EduHund Logo
Начинайте учиться прямо сейчас!

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Программа / Композиция в дизайне интерфейсов

Экспериментальный модуль

Композиция
в дизайне интерфейсов

Это утконос, талисман модуля. Он появится в сертификате.

Многим сложно применить абстрактную теорию композиции к практическим интерфейсным задачам. Вроде бы и надо, но как конкретно?

Модуль «Композиция в дизайне интерфейсов» как раз для тех, кто хочет эту сложность преодолеть.

Мы научим вас создавать дизайн интерфейсов в том числе с использованием композиционных практик и методов. А вы — набьёте руку и (при желании) освежите свои знания на практических занятиях.

Это первый из серии визуальных модулей дизайн-задачника. Будет много задач вида «Нарисуй» или как минимум «Пойми, как можно нарисовать».

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

Закрыто на реконструкцию

Записаться пока нельзя.

Модуль закрыт на реконструкцию.

  • старт сразу после оплаты или в удобный день
  • учитесь два месяца
  • платное продление доступа к задачнику еще на два месяца
  • напишите нам, если из вашей страны
    не работает ЮКасса или что-то
    пошло не так
  • можно оплатить от юридического лица

P.S. Есть и другие тематические модули.

Состав модуля

В модуле 9 уроков, 154 задачи и 6–10 тысяч знаков теории в каждом уроке.

Теория полностью авторская и не повторяет ничего из того, что встречается в других публичных источниках. Если вы «всё это где-то уже читали» — значит, вы читали перепевы с нашего. Это факт, а не кокетство.

Скачать программу модуля в формате PDFMS Word

Как выглядят задачи и теория

Фрагмент одного из писем модуля. Так все 10 уроков: немного теории с картинками — и отсылки к задачам, в которых эту теорию и нужно прорабатывать

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

Одна из задач модуля. Привязана к теории, поэтому на глазок вы и не поймёте, что тут и зачем. Зато сразу видно, что задача — это задача, а не тест

Одна из задач модуля. Привязана к теории, поэтому на глазок вы и не поймёте, что тут и зачем. Зато сразу видно, что задача — это задача, а не тест.

Статистика урока. У каждого — своя, совершенно индивидуальная. Ваши успехи (и провалы) никто не видит

Статистика урока. У каждого — своя, совершенно индивидуальная. Ваши успехи (и провалы) никто не видит. А ещё задачи с недостаточно высоким баллом вы можете перерешать сколько угодно раз.

Фрагмент одного из писем модуля. Так все 10 уроков: немного теории с картинками — и отсылки к задачам, в которых эту теорию и нужно прорабатывать

Сертификат. Хулиганский, как мы привыкли. Полностью интерактивный: не нравится цвет — меняйте, не нравятся баллы — решайте недорешённое и смотрите на новые числа.

Previous slide
Next slide

Поурочный план модуля «Композиция в дизайне интерфейсов»

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 задач

Рассматривайте чужое • Тренируйтесь с фотоаппаратом • Прочтите, наконец, все эти полторы книжки • Делайте эти три чёртовых варианта • Делайте дизайн для ноута • Не надейтесь, что за углом круто

Поймёте, куда копать дальше.

Итого: 9 уроков, 154 задачи

Ключевые навыки

Степень проработки навыков и интеграция всего этого добра в вашу ежедневную работу зависят от базового уровня и готовности работать с задачником.

Не устаём напоминать, что знакомства с теорией (пусть даже и достаточно конкретной) недостаточно, чтобы перейти на новый профессиональный уровень.

Базовые ожидания к студентам

Хорошо, если в своей работе вы хотя бы в общих чертах сталкиваетесь с созданием информационно насыщенных систем и интерфейсов.

Не советуем браться за модуль, если вы закончили базовое образование (вуз, техникум и т.п.) меньше года назад. 

Особенности формата

Ключевой принцип задачника — самостоятельная практическая работа головой и руками.

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

Авторы задачника не прячутся под столом. Им можно написать в почту и через чат-бота.

На решение задач есть только 2 месяца. Продление платное.

Нужен компьютер, с телефона решать не получится. Другие технические ограничения, в общем и целом, и не особо ограничения.

Ответы на вопросы студентов — в телеграм-боте.

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

Это эксперимент

Вот главное, что вам нужно знать, ввязываясь в экспериментальный модуль «Композиция в дизайне интерфейсов» дизайн-задачника.

Возможны перерывы между уроками

Стандартное расписание «Урок в неделю», скорее всего, выдержать не удастся. Может быть, иногда уроки будут приходить с интервалом в две недели. Как мы знаем, для многих это не критично.

Набор ограничен

Максимально в один экспериментальный модуль влезут только 70 человек.

План условный

В экспериментальных модулях мы меняем программу на ходу. Обычно — расширяем. Но какие-то темы могут из плана и вылететь (хотя раньше такого не бывало ни разу).

Объём приблизительный

10 писем и 100 задач будет точно. Но очень вероятно, что будет гораздо больше. Просим запастись терпением.

Будут ошибки в задачнике

Исправляем оперативно, как обычно.

Надеемся, все эти странности и неопределённости с лихвой компенсирует цена: 50% от обычной стоимости.

Все это справедливо для стартовавшего 3 декабря экспериментального набора. Следующие запуски модуля «Интерфейсные фокусы» будут в полном порядке (и по полной цене без скидок, 6200 рублей).

Записаться
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.

Особенности формата

Ключевой принцип задачника — самостоятельная практическая работа.

Письма с теорией — email, задачник — в формате Google Sheets.

В частности, в модуле нет видеоуроков и вебинаров.

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

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

На решение задач есть только 2 месяца. Продление — на усмотрение авторов модуля и для всей группы в целом (не индивидуально).

Ответы на вопросы студентов — в публичном канале и также на усмотрение авторов.

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

Всего будет как минимум 10 уроков и 100 задач

Программа

Обратите внимание: модуль стартует впервые. Поэтому программа может поменяться (скорее в сторону увеличения объёма).

  • Знаете? А теперь почувствуйте.
  • Слова, чтобы казаться умными.
II. Ключевая задача интерфейсной композиции
  • Нюансы интерфейсных задач.
  • Что решает пользователь.
  • Чего добивается заказчик.
  • Первичные критерии качества интерфейсной композиции.
III. История в композиции интерфейса
  • Зачемненько, а не красивенько.
  • Читаем.
  • Рассказываем.
IV. Применяем композиционные методы
  • Роль эскиза в поиске композиционного решения.
  • Разбор и отработка типовых дизайн-практик.
  • Как понять, что пора использовать композицию?

Рисовать будем в Figma

V. Работа в производственных границах
  • Адаптивность композиционных решений.
  • Ядро дизайна и фреймворк проработки интерфейса.
  • Как остаться «внутри» стилевого и композиционного решения.
VI. Текст и шрифт
  • Конфликт контента и оформления.
  • Что вы на самом деле делаете, когда работаете со шрифтами.
  • «Текстовая» и «образная» слепота.
VII. Композиционные шаблоны в интерфейсах
  • Расшифровки типовых композиционных решений.
  • Поиск шаблона под задачу.
  • Как использовать и не использовать стандартные ходы.
VIII. Проблема грязного листа
  • Работа со «случайной» композицией.
  • Как исправить то, что сделали до вас.
  • Схема «Разобрал–собрал».
IX. Композиция как тема для разговора
  • Как содержательно обсуждать композицию.
  • Как донести дизайнеру, что с композицией что-то не так.
X. Делаем для людей, а не для дизайнеров
  • Овернасмотренность дизайнеров.
  • Что пользователи видят, а что нет.
  • Разнообразие восприятия композиционных инструментов.
XI. Lifehack'и и наблюдения за живой природой
  • А где же цвет, линия и форма?
  • Сравнение композиционных традиций в разных визуальных отраслях.
  • Как с пользой смотреть на чужие работы.
  • Связь композиции с аккуратностью.

3–4 часа на один урок

10-15 задач

  •

Урок 1

Необходимый минимум теории
  • Знаете? А теперь почувствуйте.
  • Слова, чтобы казаться умными.

10-15 задач

  •

Урок 2

Ключевая задача интерфейсной композиции
  • Нюансы интерфейсных задач.
  • Что решает пользователь.
  • Чего добивается заказчик.
  • .Первичные критерии качества интерфейсной композиции.

10-15 задач

  •

Урок 3

История в композиции интерфейса
  • Зачемненько, а не красивенько.
  • Читаем.
  • Рассказываем.

10-15 задач

  •

Урок 4

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

10-15 задач

  •

Урок 5

Работа в производственных границах
  • Адаптивность композиционных решений.
  • Ядро дизайна и фреймворк проработки интерфейса.
  • Как остаться «внутри» стилевого и композиционного решения.

10-15 задач

  •

Урок 6

Текст и шрифт
  • Конфликт контента и оформления.
  • Что вы на самом деле делаете, когда работаете со шрифтами.
  • «Текстовая» и «образная» слепота.

10-15 задач

  •

Урок 7

Композиционные шаблоны в интерфейсах
  • Расшифровки типовых композиционных решений.
  • Поиск шаблона под задачу.
  • Как использовать и не использовать стандартные ходы.

10-15 задач

  •

Урок 8

Проблема грязного листа
  • Работа со «случайной» композицией.
  • Как исправить то, что сделали до вас.
  • Схема «Разобрал–собрал».

10-15 задач

  •

Урок 9

Композиция как тема для разговора
  • Как содержательно обсуждать композицию.
  • Как донести дизайнеру, что с композицией что-то не так.

10-15 задач

  •

Урок 10

Делаем для людей, а не для дизайнеров
  • Овернасмотренность дизайнеров.
  • Что пользователи видят, а что нет.
  • Разнообразие восприятия композиционных инструментов.

10-15 задач

  •

Урок 11

Lifehack'и и наблюдения за живой природой
  • А где же цвет, линия и форма?
  • Сравнение композиционных традиций в разных визуальных отраслях.
  • Как с пользой смотреть на чужие работы.
  • Связь композиции с аккуратностью.

Записаться пока нельзя. Модуль закрыт на реконструкцию.

Рассказали всё. Начинайте учиться прямо сейчас. Цена 11 700 руб. за модуль. Юрлицам чуть дороже. Записывайтесь.