Министерство науки и высшего образования Российской Федерации

федеральное государственное бюджетное образовательное учреждение

высшего образования «Алтайский государственный университет»
Институт гуманитарных наук

Кафедра культурологии и дизайна

ОТЧЕТ ПО ПРОИЗВОДСТВЕННОЙ ТЕХНОЛОГИЧЕСКОЙ

(ПРОЕКТНО-ТЕХНОЛОГИЧЕСКОЙ) ПРАКТИКЕ

Выполнил(а) студент
направления
подготовки
09.03.03 Прикладная
информатика
(в дизайне),
группа № 1307а
Силина Дарья Александровна
(Ф.И.О)
(подпись)
Руководитель практики:
Каратаев Алексей Антонович
(Ф.И.О)
научная степень, научное
звание
(подпись)
Работа защищена
«___» ________ 20_____ г.
Оценка________________

Барнаул 2023
 СОДЕРЖАНИЕ
ВВЕДЕНИЕ............................................................................................................................3

1 Видео редакторы и графические редакторы................................................................9

1.1. Adobe Photoshop. и Adobe After Effects......................................................................9

1.2. Преимущества программ.............................................................................................9

1.2.1 Основные характеристики Adobe After Effects......................................................9

1.2.2 Основные характеристики Adobe Photoshop.......................................................11

1.3 Выбор ПО для обработки видео/аудио.....................................................................11

1.4 Tilda.................................................................................................................................12

2 РАБОТА НАД ПРОЕКТОМ..........................................................................................13

2.1 Обработка исходников.................................................................................................13

2.2 Моушн-дизайн...............................................................................................................13

2.3 Работа над сайтом (описание процесса создания сайта).......................................14

ЗАКЛЮЧЕНИЕ...................................................................................................................16

СПИСОК ЛИТЕРАТУРЫ И ИСТОЧНИКОВ..............................................................17

 ВВЕДЕНИЕ
Цель практики: Создание рекламного видеоролика для сети магазинов
НОВЭКС.

Редизайн сайта для студии цветов Азалия

Задачи практики:

● Проанализировать программное обеспечение Adobe After Effects для

реализации проекта, изучить дополнительную литературу и видеоуроки;
● Редактировать полученные материалы от заказчика (Изображение товара
сети магазинов НОВЭКС);
● Найди или создать необходимые исходники для последующей компоновки
в проекте;
● Компоновать исходные материалы в проекте и создать текст;
● Наложить эффекты на объекты композиции;
● Сделать анимацию объектов.
● Зарендерить финальную версию проекта.
● Сделать редизайн сайта для студии цветов Азалия и разработать новый
логотип для него.
● Изучить конструктор сайтов Тильда
Место практики: ООО «Дюшес видео», г. Барнаул
Сроки практики: с 24.01.23 по 19.02.23
Объект практики: Инструменты моушн-дизайна и графические редакторы
Adobe Photoshop. и Adobe After Effects.

Предмет практики: Создания моушн-дизайна рекламного ролика для сети

магазинов НОВЭКС. Редизайн сайта для студии цветов Азалия.

Практическая значимость работы: Создание видеоклипа для рекламы сети

магазинов НОВЭКС.

Общепрофессиональные компетенции и индикаторы их достижения

Код
общепрофе Наименование Код и наименование
с- общепрофессиональ индикатора достижения
сиональны ных компетенций общепрофессиональной
х (ОПК) компетенции
компетенц
ий (ОПК)
ОПК-1.1. Знает основы
математики, физики,
Способен применять
вычислительной техники и
естественнонаучные и
программирования.
общеинженерные знания,
ОПК-1 ОПК-1.2. Умеет решать
методы математического
стандартные
анализа и моделирования,
профессиональные задачи с
теоретического и
применением
экспериментального
естественнонаучных и
исследования в
общеинженерных знаний,
профессиональной
методов математического
деятельности
анализа и моделирования.
ОПК-1.3. Владеет навыками
теоретического и
экспериментального
исследования объектов
профессиональной
деятельности
ОПК-2.1. Знает современные
информационные технологии
Способен понимать
и программные средства, в
принципы работы
том числе отечественного
современных
производства при решении
ОПК-2 информационных
задач профессиональной
технологий и программных
деятельности.
средств, в том числе
ОПК-2.2. Умеет выбирать
отечественного современные информационные
производства, и технологии и программные
использовать их при средства, в том числе
решения задач отечественного производства при
профессиональной решении задач
деятельности; профессиональной деятельности.
ОПК-2.3. Владеет
навыками применения
современных
информационных
технологий и
 программных средств, в
том числе отечественного
производства, при
решении задач
профессиональной
деятельности.
ОПК-3.1. Знает принципы,
методы и средства решения
стандартных задач
профессиональной
деятельности на основе
информационной и
Способен решать
библиографической
стандартные задачи
культуры с применением
профессиональной
информационно-
деятельности на основе
ОПК-3 коммуникационных
информационной и
технологий и с учетом
библиографической
основных требований
культуры с
информационной
применением
безопасности.
информационно-
ОПК-3.2. Умеет решать
коммуникационных
стандартные задачи
технологий и с учетом
профессиональной
основных требований
деятельности на основе
информационной
информационной и
безопасности
библиографической культуры
с применением
информационно-
коммуникационных
технологий и с учетом
 основных требований
информационной
безопасности.
ОПК-3.3. Владеет навыками
подготовки обзоров,
аннотаций, составления
рефератов, научных
докладов, публикаций, и
библиографии по научно-
исследовательской работе с
учетом требований
информационной
безопасности
Общие задачи на практику от организации:

1. Изучение нового программного обеспечения в сфере моушн-дизайна

2. Обработка полученных исходников(видеоматериалов)
3. Создание эффектов на исходных материалах
4. Создание анимации и новых материалов для моушн-дизайна
5. Обработка финальной композиции

 Видеостудия Dyshes' Video начала свое становление в 2003 году.

     На сегодняшний день сфера деятельности Dyshes' Video охватывает уже
более десятка различных направлений. От съёмок частных мероприятий до
создания корпоративных фильмов ведущих предприятий страны. 

     В 2008 году организована школа видеооператоров и режиссёров монтажа

Dyshes' Video при Алтайском Государственном Университете.  На
сегодняшний день студия готовит специалистов видео и фото индустрии на
базе собственной школы. Лучшие из выпускников которой, принимаются на
работу в Dyshes` Video.

     С начала работы студии, в команде работают профессиональные

операторы, креативные режиссеры монтажа и талантливые сценаристы.
Коллектив Dyshes` Video достаточно молод и перспективен. Каждый
участник команды, ежедневно работает над собой, развивается и повышает
уровень своего профессионализма. А вместе с ним растет и студия. 
 1 Видео редакторы и графические редакторы

1.1. Adobe Photoshop. и Adobe After Effects

Какую из программ по работе с видео и графикой лучше применять для
конкретных задач? Очевидно, ответ на этот вопрос будет зависеть от
ситуации.

Перед нами стоит задача создать рекламный видеоролик с

использованием моушн-дизайна. Для таких целей существует огромный
спектр ПО. Например для обработки видео наиболее популярные - это Adobe
Premiere, Sony Vegas Pro, Movavi. Но на мой взгляд Adobe After Effects
лучшая программа для данных целей.

Для обработки исходных изображений буду использовать

Adobe Photoshop. Программы из пакета Adobe полностью совместимы,

поэтому, будет очень удобно экспортировать файлы из программ.

1.2. Преимущества программ

1.2.1 Основные характеристики Adobe After Effects

After Effects – потрясающий инструмент, который с момента своего

появления используется для создания визуальных эффектов и титров к
фильмам. Видеодизайнеры быстро оценили его мощь и стали использовать
также для создания различных анимационных роликов.

Преимущества:

1. Удобный, понятный пользовательский интерфейс

Просто и быстро вы можете менять расположение, размер панелей,
добавлять или удалять ненужные окна, настраивать рабочее пространство по
своему усмотрению и создавать шаблоны под различные задачи.

2. Удобство работы со слоями. Pre-comps

 Приучать себя к порядку желательно с самого начала работы в After
Effects. И это совсем несложно: программа позволяет вам создавать
множество композиций, группировать и делать прекомпозы слоев. Пара
кликов и тысячи слоев сгруппированы в одну композицию. Это нередко
упрощает работу.

3. Быстрый рабочий процесс

Не имеет значения, чем вы занимаетесь: монтажом видео, созданием
элементов web-дизайна или риггингом персонажей в After Effects. Важно
иметь возможность быстро показать наброски, тестовые варианты заказчику.
Особенно это актуально, когда у вас не так много времени. В After Effects
необходимый элемент можно быстро анимировать и вывести.

4. Интеграция с различными программами

То, что After Effects и Premiere Pro давно «дружат» известно многим.
И вообще, прелесть программ Adobe в том, что все они прекрасно
взаимодействуют друг с другом (например, есть легкий импорт файлов из
того же Adobe Photoshop в After Effects).

5. Выражения
Выражения упрощают работу в After Effects и значительно сокращают
время создания сложных взаимосвязей между свойствами слоев и эффектов.
Благодаря встроенному движку Java-Script, при помощи выражений вы
сможете создать сложнейшую и красивейшую анимацию без необходимости
проставлять сотни ключевых кадров вручную.

6. Easy Ease, Ease In, Ease Out.

Одной из самых необходимых и полезных функций при работе в After
Effects является использование интерполяции ключей (Easy Ease, Easy In,
Easy Out), которые позволяют добиться более реалистичного движения
объектов.
 ● Out - более плавное, медленное начало и быстрое движение в конце
(как на примере движущегося автомобиля).
● In - резкий старт в начале и замедление в конце.
● Ease - плавный старт и плавное замедление.

1.2.2 Основные характеристики Adobe Photoshop

Adobe Photoshop — один из самых популярных и востребованных

графических редакторов, который широко используется не только
фотографами, дизайнерами, полиграфистами, но и обычными людьми,
желающими обработать свои фотографии.

Преимущества:

1. Обработка и ретушь фотографий

В программе реализована работа со слоями, сложной графикой, также

можно делать коллажи из нескольких картинок. Есть много опций для
цветокоррекции и настройки баланса белого. При необходимости очень легко
повысить качество отсканированных снимков и устранить дефекты и
несовершенства.

2. Работа с текстом
Широкий выбор инструментов для создания текста и его обработки —
набор шрифтов, эффектов и фильтров.
3. Большое количество эффектов и фильтров
С их помощью получится обработать кадры практически моментально.
4. Встроенный 3D-модуль
Он предназначен для проектирования трехмерных изображений.

1.3 Выбор ПО для обработки видео/аудио

Из-за ряда преимуществ и простоты использования программ были

выбраны Adobe Photoshop. и Adobe After Effects.
 В Adobe Photoshop получится качественно обработать исходники, а в
Adobe After Effects анимировать и создать моушн-дизайн.
1.4 Tilda
Tilda Publishing (сокр. Tilda) — блочный конструктор сайтов, не
требующий навыков программирования. Позволяет создавать сайты,
интернет-магазины, посадочные страницы, блоги и email-рассылки.

Сайты на платформе собираются из готовых блоков, которые автоматически

адаптируются под мобильные устройства и выделены в смысловые категории
(например, обложка сайта, меню, форма, текст, изображение). Также с
помощью встроенного редактора Zero Block можно спроектировать свой
собственный блок, добавляя отдельные модули (текст, форма,
геометрическая фигура, изображение, кнопка, HTML, галерея, видео,
тултип), располагая их на экране в режиме Drag-and-drop.
 2 РАБОТА НАД ПРОЕКТОМ
2.1 Обработка исходников
Для работы были получены исходные материалы, которые в
дальнейшем должны быть обработаны (приложение рис.1).

Обработка производилась с учетом корпоративных цветов компании (синий

и белый) и полученных данных от заказчика (цена товара). В результате
работы, получилась первая композиция, которую можно отправлять в After
Effects (приложение рис.2).

Нужно было подготовить ещё 2 композиции. Следующая композиция

демонстрировала другой товар (приложение рис.3).

Изображение было редактировано таким же способом. Добавлен фон, текст и

ценник товара (приложение рис.4).

Финальная композиция получилась насыщения прошлых. Нужно

добавить героя и больше деталей. Недостающий изображения
(непредоставленные заказчиком), были взяты с сайта FreePik.

FreePik— молодой фотосток, начинавший с бесплатных картинок и

заработка на продажах контента Shutterstock. Сейчас фотобанк предлагает
бесплатные и платные картинки. Стоимость подписки, для покупателей не
велика. Благодаря этому, Freepik имеет большой трафик и хорошо продает.

В композиции звёзды и планеты были нарисованы в Photoshop, а Герой

(мальчик) взят со FreePik. Финальная композиция получила интересный вид
(приложение рис.5).

2.2 Моушн-дизайн
После того, как наши изображения готовы, можно импортировать их в
Adobe After Effects и начать создания эффектов и анимаций. В начале нужно
скомпоновать слои. Как и задумывалось, получилось 3 композиции
(приложение рис.6).
 Когда файлы импортированы и композиции готовы, можно начать
самую ответственную часть. наложить эффекты и анимацию. При помощи
ключевой анимации можно заставить двигаться объекты (приложение рис.7).

Мультипликация по ключевым кадрам — технология создания

мультипликации, при которой первоначально создаются основные (ключевые
или компоновочные) рисунки, а затем добавляются промежуточные между
ними, называемые фазами.
В конце концов, должно получится 3 композиции с множеством слоёв
и ключевых кадров. Проверяем композицию и ставим на рендер. Проект
готов. Осталось только отдать его на монтаж саунд-дизайнеру (приложение
рис.8).

2.3 Работа над сайтом (описание процесса создания сайта)

Подбор референсов и обсуждение проекта

 какова будет общая концепция продукта;

 Что нравится целевой аудитории;
 что из референсов может лучше всего подойти.
Прототипирование
Так как у нас выделен только 1 день на прототип - прибегаем к
быстрому решению при помощи Figma. В рамках этого сервиса есть уже
готовые ui киты, другими словами блоки, которые можно компоновать в
дальнейшем как угодно. Опираемся на те примеры сайтов, которые
утвердили на предыдущем этапе и на основе их логики / структуры -
переносим все это на наш прототип в Figma.
Дизайн
Подбор и поиск будущих элементов сайта, а именно:
 Иконки
 Изображения
 иные визуальные элементы, которые нельзя отнести к чему-то
конкретному, но от этого они не становятся менее важными
Все должно быть объединено общей идей, сочетаться между собой.
 ЗАКЛЮЧЕНИЕ
В ходе практики были решены поставленные в работе задачи.
Оценивая проделанную работу, можно сделать следующие выводы: сайт
предоставляет пользователям наиболее нужную ему информацию, а именно -
возможность ознакомиться со списком услуг, дизайн сайта соответствует
предполагаемым предпочтениям целевой группы, реализована навигация с
помощью меню по страницам сайта, реализованы предпочтения и заявки для
клиентов, разработан логотип и редизайн сайта.
Для редизайна сайта были использованы следующие средства: Figma,
Tilda, Adobe Photoshop.
В дальнейшем на сайте так же возможно расширение списка
предоставляемых услуг, акций, новостей. Данный ресурс стабилен в работе и
не требует высоких знаний для работы с ним.
А также был создан рекламный видеоролик в Adobe After Effects для
сети магазинов НОВЭКС.
 СПИСОК ЛИТЕРАТУРЫ И ИСТОЧНИКОВ
1. After Effects 5.5: революция качества цифрового видения (+CD-
Rom) / Дж.Дж. Кингснорт и др. - М.: Лаборатория Базовых Знаний, 2020. -
367 c.
2. Adobe After Effects 5.0 Видеомонтаж, спецэффекты, создание
видеокомпозиций. - М.: Триумф, 2016. - 400 c.
3. Фостер, Джефф Анимация и спецэффекты в After Effects и
Photoshop (+ DVD-ROM) / Джефф Фостер. - М.: НТ Пресс, 2018. - 480 c.
4. Волкова, Татьяна Photoshop CS4 за 14 дней / Татьяна Волкова. - М.:
Вильямс, 2018. - 352 c.
5. Мерсер Drupal 6. Создание надежных и полнофункциональных веб-
сайтов, блогов, форумов, порталов и сайтов-сообществ / Мерсер, Дэвид. - М.:
Вильямс, 2020. - 272 c.

6. Дакетт, Джон HTML и CSS. Разработка и дизайн веб-сайтов (+ CD-

ROM) / Джон Дакетт. - Москва: Наука, 2020 г.