Визуальный стиль
Визуальный стиль
Визуальный стиль — это набор единых правил оформления: цвета, шрифты, логотипы, композиции и повторяющиеся элементы. Благодаря этим стандартам курс выглядит аккуратно, цельно и узнаваемо.
Пользователь не отвлекается на оформление и легче воспринимает содержание.
Чтобы создать такой стиль, мы опираемся на 3 инструмента: брендбук, мудборд и гайдлайн. Они идут в связке и помогают пройти путь от общей идеи до конкретных правил.
Создание стиля
Вот простая логика создания единого визуального стиля для курса или даже всей программы:
Брендбук
Мудборд
Гайдлайн
Готовые инструкции, как оформлять курс
Поиск и согласование идей
Официальные фирменные правила
Брендбук
Отправная точка
Брендбук задает фирменные цвета, шрифты, логотип и стиль компании. Мы не придумываем оформление с нуля — сначала смотрим, что уже утверждено, чтобы курс выглядел единообразно с другими материалами компании.
У нашей компании есть корпоративный брендбук, а на ПКД размещены готовые элементы фирменного стиля — ими можно пользоваться при оформлении курсов и создании мудбордов.
Хочешь посмотреть? Перейди по ссылке
Возможно, у твоего направления есть собственный брендбук — такие случаи нам знакомы😉
Мудборд
Поиск идеи и настроения
Следующий шаг — мудборд. Это подборка визуальных примеров будущего курса. В него входят:
Палитра
Шрифты
Иконки
Примеры экранов
Он нужен, чтобы согласовать с заказчиком настроение и общий визуальный подход еще до начала разработки. На этапе мудборда можно пробовать разные решения, экспериментировать и уточнять стиль.
Не всегда мудборд «вытекает» из брендбука. Бывают случаи, кода разработчик сам «нащупывает» стиль будущего курса: подбирает подходящие к теме цвета, шрифты, стили иконок и т. д.
Гайдлайн
Рабочая инструкция для всех
После утверждения мудборда мы собираем гайдлайн — документ, где фиксируем все согласованные правила оформления.
В гайдлайне прописано:
какие шрифты и цвета использовать
как оформлять кнопки и блоки
какие отступы и размеры считать стандартными
какие шаблоны экранов применять
примеры «как правильно»
Гайдлайн помогает всем разработчикам работать одинаково и держать единый стиль как в отдельном курсе, так и в целой программе.
Твои действия при выработке стиля
Шаг 1
Изучи брендбук компании или бизнес-направления
Шаг 2
Подбери визуальные примеры и создай мудборд
Шаг 3
Согласуй визуал с заказчиком
Шаг 4
Зафиксируй принятые решения в гайдлайне
Шаг 5
Используй гайдлайн при оформлении всех инструментов программы
Советы новичкам
Смотри шире
Ищи вдохновение не только в e-learning, но и на сайтах, в презентациях и мобильных приложениях
Не бери примеры «как есть», адаптируй их под формат
Полезные ресурсы
Собирай идеи
Сохраняй удачные сочетания цветов и шрифтов
Делай скриншоты хороших экранов
Со временем у тебя появится свой мини-справочник, и ты не будешь тратить время на поиски идей с нуля
Экономь время
Используй готовые шаблоны слайдов и элементов оформления. Это ускорит работу и сохранит единый стиль курса
Следующая
Предыдущая