Навыки проектировщика в стилизации интерфейсов
Доклад Ильи Бовкунова из «Собаки Павлова» на ProfsoUX 2016.
Один из последних этапов длинного пути проектировщика — подготовка прототипа. Сделайте прототип лучше, проработав:
- Акценты на страницах;
- Вертикальный ритм;
- Мелочи;
- Цветовую палитру.
Акценты
Акцент задаётся не только размером элемента и контрастом, но и положением элемента в блоке: в центре и по углам.
Упорядочьте элементы блока. Расположите их так, чтобы дробность уменьшалась в одном считываемом направлении.
Вертикальный ритм
Строится от размера базового текста. Базовый блок состоит из целого числа строк базового текста.
Мелочи
Расставьте правильные кавычки (ёлочки и лапки), дефисы и тире. Уберите висящие предлоги. И так далее.
Смотрите рекомендации Ильи Рудермана по оформлению текста.
Цвет
Используйте материалы заказчика, логотип, предыдущий сайт или сами выберите цветовую гамму: базовый цвет, 2 дополнительных акцентных. Плюс тёмносерый для текста и светлосерый для миниакцентов.
Подбор серых цветов:
- Возьмите базовый цвет и оттенки серого #a0a0a0 и #333333.
- С прозрачностью 95% наложите базовый цвет на серые.
Также вместо плашек можно использовать изображения.
Комментарий Саши Куценко из Aidem
Fantasy Interactive делает высокодетализированные прототипы: финальная типографика, шрифты, текст, но без цветов. Для расстановки акцентов используются градиенты серого.
Понравилось — подписывайтесь
- Заметки UX-проектировщика ВКонтакте или в Фейсбуке;
- Рассылка UX-проектировщика.
Конспект подготовил Антон Григорьев.
Другие доклады с ProfsoUX 2016:
- Начало работы в большой компании;
- Позвоните пользователям. Сила телефонного интервью;
- «Скучные» интерфейсы — где найти вдохновение;
- Как команде юиксеров работать без начальника;
- Контекст — король. Один из лучших докладов по итогам голосования;
- Построить зазеркалье;
- Программистский подход в дизайне;
- Дзен и искусство проектирования себя.