Как дизайнеры приближаются к анимации логотипа
16 июня 2025 г.Таблица ссылок
Аннотация и 1 введение
2 Связанная работа
2.1 Синтез программы
2.2 Инструменты поддержки творчества для анимации
2.3 Денежные инструменты для проектирования
3 Формирующие шаги
4 Система логовой и 4.1 вход
4.2 Предварительная визуальная информация
4.3 Визуально обоснованный синтез кода
5 Оценки
5.1 Оценка: ремонт программы
5.2 Методология
5.3 Выводы
6 Оценка с новичками
7 Обсуждение и 7.1. Отрываны от шаблонов
7.2 Создание кода вокруг визуальных эффектов
7.3 Ограничения
8 Заключение и ссылки
3 Формирующие шаги
В этом разделе мы представляем проблемы дизайна и принципы, которые окружают нашу задачу анимации логотипа. Мы приняли смешанный метод подхода к нашей формирующей работе: сборы и картирование сродства, примеры класса, литературу по дизайну чтения о логотипах, интервьюирующие дизайнеры движения и анализ существующих инструментов конечных пользователей [10, 12, 13]. Этот шаг также направляет дизайн и технический выбор нашего метода.
Мы взяли интервью у 4 профессиональных дизайнеров движения (E1-E4) с опытом работы не менее 10 лет с инструментами проектирования движения, чтобы понять эти различные методы (например, шаблоны, ручной авторизацию) и провели необходимость на поиске анимаций логотипа. Три интервьюируемых дизайнеров движения (E1, E2, E4) создали профессионально анимации логотипа и бренда.
3.0.1 ПРЕДУПРЕТЫ ДВИЖЕНИЯ.Инструменты дизайна потребителей [10, 12, 13] обычно дают пользователям контроль над анимацией с использованием предустановки движения. Например, инструменты дизайна от Imovie до PowerPoint универсально подчиняются продовольственные предварительные задачи анимации, такие как затухание, слайды и салфетки. Эти пресеты позволяют пользователям настраивать анимацию, изменяя свойства движения, такие как скорость, направление и продолжительность. Общий шаблон дизайна - также параметризировать анимацию с вступлением в силу, цикл и анимации Outro, чтобы помочь пользователям структурировать разные состояния в своей анимации [16]. Примеры предварительных настроек анимации и то, как предустановки могут быть параметризованы и настроены, изображены на рисунке 2.
3.0.2 Эвристика и группировка.Инструменты проектирования часто также анализируют макет холста и применяют эвристику или правила к анимации на уровне страниц [12]. Например, все неразмерные элементы могут оживить по краям, падать с одного направления или последовательно исчезать. Эти виды стилей движения зависят от понимания холста с точки зрения иерархии макета (фон против переднего плана), групп элементов (симметричные элементы, копии элементов), значимость объекта (первичный и вторичный) и тип элементов (текст против изображения). Эти виды автоматических подходов позволяют пользователям легче охватить сложные анимации, абстрагируя технические сложности, такие как слоистые временные рамки и кривые смягчения для пользователя. Таким образом, анализ визуальной иерархии элементов в холсте необходим, чтобы направлять их время и синхронизацию в анимации. В нашем анализе профессионально созданных анимированных логотипов и шаблонов анимированных логотипов мы обнаружили, что элементы изображения, как правило, входят в первую очередь и освоится. Текстовая анимация имеет тенденцию быть последней, так что зритель может привести к полному эффекту визуального обмена сообщениями.
3.0.3 Ограничение шаблонов.Инструменты дизайна потребителей предлагают широкий спектр анимированных шаблонных галерей, разработанных профессионалами. В то время как шаблоны могут помочь пользователям быстро добраться до отточенной и редактируемой отправной точки (E1, E2), они не всегда легко адаптируются к содержанию пользователя или варианту использования (E2). Например, на рисунке 2 показан сценарий, в котором пользователь выбрал анимированный шаблон с предустановленной анимацией «Дрифт с правой» для начала. Они могут поменять контент заполнителей своими собственными активами и контентом и контентом и начать настраивать шаблон на их вариант использования. Однако, даже несмотря на то, что активы изображения имеют один и тот же класс (автомобиль), встроенная анимация не применяется (их автомобиль скользит в обратном направлении). Они должны отказаться от анимации по умолчанию и работать в обратном направлении в управлении, которые им приходится сделать правдоподобную и естественную анимацию, которая может аннулировать точку использования анимированного шаблона. Чтобы смягчить это, шаблонные галереи и дизайнеры шаблонов, стоящих за ними, часто заполняют и обновляют галереи шаблонов с сотнями шаблонов для покрытия всех возможных вариантов использования. Это в сочетании с тем фактом, что анимация логотипа имеет так много измерений (анимация изображений, текстовая анимация, возможности макета) делает шаблоны исчерпывающим дизайнерским решением для поддержания. Шаблоны могут быть пригодными для использования, но хрупкие, когда пользователи делают слишком много изменений вдали от значения по умолчанию.
E4 выразил ограничения шаблонов и их стремление к дизайнерам движения создавать характерное и семантически значимое движение в своей работе.
Для логотипов это идентичность бренда. Если это дерево, ему нужно расти. Если это волна, она должна размахивать. Это должно быть что -то конкретное для логотипа. Это трудно обобщить. [Относится к шаблону анимации логотипа] Вы можете просто поменять логотип, но он не имеет ничего конкретного.-E4
3.0.4 Ручное создание с инструментами дизайна.В отличие от потребительских инструментов, профессиональные дизайнеры, с которыми мы говорили, потратили значительные усилия, сосредоточившись на визуальном потоке и последовательности их анимации. Они взяли инструкции по дизайну движения от клиентов и следили за тем, чтобы ключ, преобразование и облегчение элементов выглядело естественным и профессиональным (E1, E2). В то время как подход, созданный вручную, позволяет анимациям быть сделанной на заказ и адаптирована к конкретному контенту и повествовательным целям, это требует значительных ручных усилий, времени и опыта.
Из этого формирующего понимания ландшафта дизайна для анимированных логотипов мы синтезировали следующие принципы дизайна, которые направляют наш подход.
• Принцип дизайна 1. Анимация должна быть соблюденной.Анимации должны быть настроены на предмет логотипа: будь то, применяя характерные движения к элементам героя, создавая стимуляцию и визуальный поток, который соответствует общему обмену сообщениям, или демонстрируя осознание макета.
• Принцип дизайна 2. Анимация должна уважать иерархию макета.Анимация должна отражать визуальную иерархию макета. Первичные элементы должны иметь наибольшую анимацию (момент героя), а вторичные элементы должны иметь меньше или более тонкую анимацию, чтобы не отвлекаться от основного элемента. Элементы, которые концептуально группируют вместе, должны быть скоординированы в движении.
• Принцип дизайна 3. Анимации должны иметь логическое секвенирование.Создайте ощущение визуального потока и подгонки секвенирования для раскрытия логотипа. Подход должен помочь пользователям автоматически создавать хорошо довольную и хорошо развивающуюся анимацию.
Авторы:
(1) Вивиан Лю, Колумбийский университет (vivian@cs.columbia.edu);
(2) Rubaiat Habib Kazi, Adobe Research (rhabib@adobe.com);
(3) Li-Yi Wei, Adobe Research (lwei@adobe.com);
(4) Мэтью Фишер, Adobe Research (matfishe@adobe.com);
(5) Тимоти Ланглуа, Adobe Research (tlangloi@adobe.com);
(6) Сет Уокер, Adobe Research (swalker@adobe.com);
(7) Лидия Чилтон, Колумбийский университет (chilton@cs.columbia.edu).
Эта статья есть
Оригинал