UI-дизайн – дословно пользовательский интерфейс. UI включает в себя основную работу над графической составляющей, позволяет визуализировать веб-сайт и реализовать его прототип. Это и кнопки, и картинки, шрифты, формы и анимации. Задача дизайнера обеспечить пользовательский интерфейс сайта красивым визуалом и эффективной и интуитивно понятной работой сайта.

Какие основные элементы пользовательского интерфейса?

• Заголовки. Находясь в поисковой системе, перед тем, как перейти на сайт, человек видит перед собой заголовки. Они играют очень важную роль для сайта, потому спомощью этого текста нужно заинтересовать человека. Первый заголовок самый значимый, второй менее, и так далее.
• Ссылки. Это выделенные слова в тексте. Они могут отображаться другим цветом или подчеркиваться. Ссылками можно указывать на другой продукт или статью этого же сайта или любого другого.
• Кнопки. Базовый элемент интерфейса, сочетаемый с дизайном веб-сайта. С нажатием кнопки должно происходить какое-либо действие: переход, возвращение, подтверждение и т.п.
• Радиокнопка. Это элемент UI, который предлагает пользователю выбрать один пункт из предложенного набора. Рядом с кнопкой чаще всего находится ее описание.
• Форма. Чаще всего требуется для заполнения пользователем информации о себе (почта, имя, телефон, адрес). Формы могут быть нескольких видов (может отличаться внешне в зависимости от дизайна сайта): неактивные, информацию в нее указать нельзя по какой-либо причине; активная, в которую нужно внести данные; форма с ошибкой, если пароль указан неверно, номер телефона внесен не верно; успешно заполненная форма, где внесены данные и они соответсвуют требованиям.
• Попап, иначе окно авторизации. Нужно регистрации и входа пользователей.
• Пагинация. С помощью постраничной пагинации можно быстро переключаться между страницами с текстом или товарами. Чаще всего это строчка цифр и стрелок «назад» и «вперед». Сейчас можно встретить пагинацию в ввиде «бесконечного» текста, то есть долистывая до конкретного момента появляется кнопка «загрузить больше» или похожее. Также возможно автоматическое обновление с помощью прелоадера.
• Прелоадер — это значок самой загрузки. Есть он появляется на сайте, значит что-то загружается.
• Меню. Это навигация по всему сайту, то есть, к любому товару, статье, тех. поддержке.

Это основные элементы для UI, которые должны быть на каждом сайте и важно не забыть о них при проектировании сайта.