Многим сложно применить абстрактную теорию композиции к практическим интерфейсным задачам. Вроде бы и надо, но как конкретно?
Модуль «Композиция в дизайне интерфейсов» как раз для тех, кто хочет эту сложность преодолеть.
Мы научим вас создавать дизайн интерфейсов в том числе с использованием композиционных практик и методов. А вы — набьёте руку и (при желании) освежите свои знания на практических занятиях.
Это первый из серии визуальных модулей дизайн-задачника. Будет много задач вида «Нарисуй» или как минимум «Пойми, как можно нарисовать».
Впрочем, умение рисовать не требуется: композицию в дизайне интерфейсов могут осилить все, кому она интересна и полезна, а не только художники.
Закрыто на реконструкцию
В модуле 9 уроков, 154 задачи и 6–10 тысяч знаков теории в каждом уроке.
Теория полностью авторская и не повторяет ничего из того, что встречается в других публичных источниках. Если вы «всё это где-то уже читали» — значит, вы читали перепевы с нашего. Это факт, а не кокетство.
3–4 часа на один урок
Урок 1, в котором мы отказываемся от определений, а заказчик превращается в человека
•
26 задач
Нюансы интерфейсных задач • Что решает пользователь • Чего добивается заказчик
←
Вспомните умные слова и поймете, для чего нужна композиция. В интерфейсе, не «вообще».
Урок 2, в котором историю так легко прочесть — и так внезапно надо рассказать
•
13 задач
Зачемненько, а не красивенько • Читаем • Рассказываем
←
Научитесь считывать чужие интерфейсные истории и рассказывать свои. Разные. Одними и теми же контролами на одной и той же странице.
начнете рисовать в Figma
Урок 3, в котором Чуковский бьёт в кришнаитские барабаны
•••
23 задачи
Из чего собирать ритм? • Структура ритмического шага • Сложные ритмические рисунки • Принцип открытости • Не запорите свою работу
←
Разоберетесь в механике интерфейсного ритма. И получите чек-лист для проверки композионно-ритмических решений.
Урок 4, в котором роза стабильно падает на лапу Азора
•••
23 задачи
Свобода выбора и визуальное насилие • Проклятье симметричных текстов • Стабильность, авторитет и светлые образы • Симметрия в паре с контрастом • Бессимметрия — это норма! • Снова Figma
←
Поймете, когда симметрия уместна, а когда — нет. И научитесь усиливать ее ритмом.
задачки в Figma становятся сложнее
тут будет сложно
Урок 5, , в котором чёрное — это не красное, а зелёное — не белое
•••
22 задачи
Упрощаем прочтение истории • Песочница для упёртого заказчика • Контраст образов и текста • Баннерная слепота • Образ как small talk • Цветовой контраст • Усиление цветом • Контраст как сигнал к Главному Действию • Наложение контрастных приёмов • Эмоции контраста
←
Здесь расходятся две задачи: проектирование интерфейса и его эстетическое оформление. Обе задачи важны, но одна другую никогда не заменит.
Урок 6, в котором в глазах двоится, а руками — ещё как трогать
•••
14 задач
Когнитивный? Что это? • Первый базовый конфликт интерфейсного дизайна • Две композиции в одном интерфейсе • Связь визуальной и когнитивно-интерактивной композиций • Пользовательская привычка считывать ожидания • UI-затеи и секретики-пустышки • Ну не знаю, мне всё понятно • Обучающая компонента • Когнитивные карты • Работаем с когнитивными картами
←
Визуализируете когнитивную нагрузку. И увидите, что у неё и правда есть своя композиция..
совершите маленькую революцию
Урок 7, в котором оказывается, что ликбез не работает, и приходится использовать кулаки
••
12 задач
Профилируем пользователя • Рамка, чтобы не сказать фокус, взгляда • Диапазон фокусировки • Шкала «образ — смысл»
←
Научитесь при сборке визуально-когнитивной композиции учитывать умение пользователя считывать композиционные механики.
Урок 8, в котором мы должны накосячить, чтобы улучшить
••
10 задач
Что не отдадим врагу? • Визуальная композиция ломается первой • Цвет? Шрифт? Ох • Аккуратность, структура, баланс
←
Узнаете, где можно и где нельзя ошибиться в композиции. И как исправить ошибки
Урок 9, в котором упражнений нет, но если очень поискать — найдутся
•
11 задач
Рассматривайте чужое • Тренируйтесь с фотоаппаратом • Прочтите, наконец, все эти полторы книжки • Делайте эти три чёртовых варианта • Делайте дизайн для ноута • Не надейтесь, что за углом круто
←
Поймёте, куда копать дальше.
Степень проработки навыков и интеграция всего этого добра в вашу ежедневную работу зависят от базового уровня и готовности работать с задачником.
Не устаём напоминать, что знакомства с теорией (пусть даже и достаточно конкретной) недостаточно, чтобы перейти на новый профессиональный уровень.
Хорошо, если в своей работе вы хотя бы в общих чертах сталкиваетесь с созданием информационно насыщенных систем и интерфейсов.
Не советуем браться за модуль, если вы закончили базовое образование (вуз, техникум и т.п.) меньше года назад.
Ключевой принцип задачника — самостоятельная практическая работа головой и руками.
В модуле нет видеоуроков и вебинаров. Задачник сделан на собственной интерактивной образовательной платформе. Теория в необходимых дозах интегрирована в практику.
Авторы задачника не прячутся под столом. Им можно написать в почту и через чат-бота.
На решение задач есть только 2 месяца. Продление платное.
Нужен компьютер, с телефона решать не получится. Другие технические ограничения, в общем и целом, и не особо ограничения.
Ответы на вопросы студентов — в телеграм-боте.
Во всех подробностях про формат дизайн-задачника мы рассказываем отдельно. Пожалуйста, прочитайте это описание заранее, чтобы избежать неожиданностей и разочарований.