О разделе
Раздел про пользовательский интерфейс — от понятий UX/UI до элементов экрана и принципов проектирования. Для полного маршрута веб-дизайна (референсы, типы сайтов, исследования, портфолио) начните с Веб-дизайн — маршрут от UX до портфолио.
Рекомендуемый порядок
- Пользовательский интерфейс — UX и UI — словарь и границы дисциплин.
- Визуальные, функциональные, навигационные элементы и обратная связь.
- Особенности и принципы UX и UI — юзабилити, a11y, интерактивная демо.
- Веб-дизайн — маршрут от UX до портфолио — лендинги, магазины, корпоративные сайты, исследования (по задаче).
- Справочник иконок интерфейса — что обычно означают пиктограммы в ОС и приложениях.
- Итоги и чек-лист.
Пользовательский интерфейс - UX и UI
Разбор отличий пользовательского опыта от визуального интерфейса, роли каждого компонента в процессе взаимодействия с цифровыми продуктами.
Визуальные элементы
Разбор визуальных компонентов интерфейса, правил работы с цветовой палитрой, типографикой, иконками и фонами для создания целостного дизайна.
Функциональные элементы
Разбор функциональных компонентов интерфейса, кнопок, полей ввода, чекбоксов и переключателей с акцентом на удобство и стандарты использования.
Навигационные элементы
Архитектура навигационных элементов интерфейса, принципы построения меню, хлебных крошек и систем перемещения между разделами приложений.
Элементы обратной связи
Принципы проектирования визуальной и звуковой обратной связи, индикаторов загрузки, уведомлений и статусов для улучшения пользовательского опыта.
Особенности и принципы UX и UI
Разбор принципов проектирования пользовательских интерфейсов, метрик удобства использования и методов повышения эффективности взаимодействия.
Веб-дизайн — маршрут развития
Полный маршрут веб-дизайна — UX/UI, референсы и прототипы, лендинги и лонгриды, магазины, корпоративные и новостные сайты, исследования и презентация работ.
Справочник иконок
Распространённые пиктограммы в приложениях, сайтах и ОС — что они обычно означают и как выглядят.
Интерфейс — итоги
Итоговое обобщение раздела с разбором принципов UX и UI, типовых элементов и практических рекомендаций по проектированию интерфейсов.
Интерфейс — чек-лист
Контрольный список вопросов для закрепления знаний по визуальным элементам, навигации, обратной связи и принципам юзабилити.
Интерфейс — о разделе
Обзор раздела с материалами по принципам проектирования пользовательских интерфейсов, визуальным элементам и стандартам доступности.
В подборках
Статья входит в тематические подборки и блок "С чего начать?" на главной. Соседние шаги того же маршрута:
Веб-разработка — История интернета, Сеть и интернет — о разделе, Веб-сайты и веб-приложения — о разделе, Веб-браузеры, HTML — о разделе, JavaScript — о разделе.