Короткие UI-советы: как сделать дизайн сайта значительно лучше

Вот несколько способов улучшить дизайн минимальными усилиями:

01.

Чистый серый цвет всегда выглядит блекло на цветном фоне. Чтобы быстро это исправить, сделайте текст ярче, применив к нему оттенок фона.

02.

Большое количество линеек и обводок перегружают дизайн. Вот несколько идей, как сделать его более лёгким для восприятия.

03.

Когда используете иконки с большим весом, чем текст, сделайте их немного светлее в неактивном состоянии.

04.

Стрелки, галочки и другие универсальные иконки вместо буллетов — это отличный способ сделать маркированный список визуально интереснее.

05.

Добавьте цветную полосу в шапку — эта небольшая деталь оживит ваш дизайн. Такой трюк также сработает с формами и другими модульными элементами.

06.

Размещение элементов на странице в несколько слоёв — хороший способ создать глубину и побудить пользователей прокрутить страницу дальше.

07.

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

08.

09.

Не растягивайте маленькие иконки приложений для лендинга. Попробуйте разместить их поверх фигуры с цветным фоном.

10.

Межстрочные отступы одного размера на протяжении всего текста — не самая заметная, но распространённая ошибка. Интервал 1.5 может хорошо работать в основном тексте, но когда текст становится больше, делайте межстрочное расстояние плотнее.

11.

Сделать хороший дизайн таблицы непросто. Вот несколько идей, которые облегчат вам задачу.

12.

Добавляйте к модальным элементам лёгкие тени. Смещение по вертикали поможет сделать их более естественными.

13.

Иногда возникают сложности при оформлении текста. Перед вами несколько советов, как исправить частые ошибки.

14.

Выпадающее меню — больше, чем просто скучный список ссылок. Вы можете оформлять его, как угодно! Например, такой шаблон отлично подойдёт, если вы хотите добавить в меню текстовые подсказки.

15.

Серый — не значит скучный. Добавьте в серый текст или фон немного оттенка голубого, коричневого для создания нужного ощущения.

16.

Если хотите, чтобы текст разного размера казался одинаковым по насыщенности, набирайте большой текст тонким начертанием, а текст поменьше — полужирным.

17.

Изображения с частичным наложением — хороший способ добавить интерфейсу глубины и сделать его более «дизайнерским». Сделайте вокруг картинок рамки того же цвета, что и фон, чтобы разграничить и упорядочить их.

18.

Несколько идей по оформлению тарифных карточек, которые придают им особый блеск.

19.

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

Присоединяйтесь к свободному заработку на канале Веселый Фрилансер, расширяйте свои возможности и работайте удаленно из любой точки мира!