Разрабатываем дизайн
Мы уже говорили, что сайт — это не просто красивая картинка. Он должен быть функциональным, понятным и приносить прибыль бизнесу. Оформление соответствует целевой аудитории, информация должна легко считываться, взаимодействие с сайтом должно быть простое.
С помощью ux-дизайна можно управлять вниманием людей, чтобы они совершали нужные вам действия. При этом важно помнить, что сайт делается для покупателя, и не всегда то, что нравится вам как собственнику бизнеса, подойдет клиентам — такие моменты как раз можно выяснить при анализе целевой аудитории.
При разработке дизайна необходимо обратить внимание на типографику, сочетание цветов и форм, глубину, визуальный вес и анимацию. На этом этапе
Визуальный вес — это способность объектов притягивать к себе внимание. На это влияет множество факторов, главные из которых цвет и размер. Как выделить нужные элементы, расскажем ниже. В зависимости от этих параметров посетитель оценивает элементы как тяжелые и легкие. Так, светлые элементы кажутся легче темных, при этом разница заметна даже в оттенках.
Типографика — направление по работе и визуальному оформлению текста. Если вы соблюдаете правила типографики, текст удобно читать, он визуально подталкивает к нужному действию. Обращайте внимание на количество шрифтов, на одном сайте не рекомендуется использовать больше 2-х шрифтов. Главное правило — оформление текста должно быть максимально легким, помогать считывать контент и правильно расставлять акценты.
Контраст формы и цвета — еще один инструмент для управления вниманием. Самые важные объекты должны бросаться в глаза сразу. Поэтому необходимо уметь грамотно их выделять. При этом важно помнить, что есть близкие друг к другу цвета и формы. Например, квадрат точно будет выделяться в окружении кругов, а вот овал затеряется. Сайты, которые делаются под рекламу, чащего всего делают на светлом фоне, потому что так информация считывается намного легче и это увеличивает конверсию. Сайты с темным фоном выглядят стильно, но сфокусироваться на контенте пользователю будет сложнее. Важно не переборщить, не используйте слишком много форм и цветов.
Анимация делает акцент на необходимых элементах, оживляет страницу. Создает иллюзию движения на веб-странице с помощью изменения свойств элементов (цвета, размера, положения). Отдельно стоит уделить внимание ховер-эффектам, которые дают пользователю обратную связь при взаимодействии с сайтом — например, кнопка изменяет цвет, когда наводишь на нее курсор. Все это помогает привлекать внимание пользователя к нужному элементу, делает навигацию проще. Главное правило все то же — не перегрузить.