Приветствую! Меня зовут Михаил Городничев и я веб-дизайнер.

Прототип это "фундамент" качественного сайт.

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

UX – user experience, он же «пользовательский опыт». За этой фразой, в идеале, всегда скрывается интуитивно понятный интерфейс. Это значит: пользователь без особого труда способен комфортно использовать ваш продукт и, при необходимости, получать подсказки.

Вернёмся к примеру из Прототипирования – сайт продающий услуги. Работа над UX будет включать в себя:

• Создание удобной и логичной навигации в рамках отдельной страницы / целого сайта.
• Уточнение функционала блоков страницы и отдельных элементов.
• Определение способов информирования и обратной связи.

Продуманный UX, в нашем примере, даст чёткое понимание когда, во сколько и с кем ваш потенциальный клиент будет договариваться, если оставит заявку.

Допустим вы оставили заявку на сайте. Плохой вариант – всплывающее окно с надписью «спасибо, ваша заявка принята». Хороший вариант – страница благодарности, на которой есть фото менеджера с подписью и текст: «спасибо, наш менеджер *имя менеджера* свяжется с вами в течение 5 минут». Получается решили сразу 3 задачи. Первая – клиент не будет суетиться в течении 5 минут и подождёт вашего звонка. Вторая – клиенту комфортно, ведь он знает с кем будет говорить. Третья – страницы благодарности лучше отслеживаются Метрикой, у вас в отчётах достижение цели будет с меньшей погрешностью. Это позволит точнее работать с рекламным бюджетом. Ещё страницей благодарности можно дополнительно прогревать аудиторию и осуществлять через неё доп. продажи. Как вам плюсы от такого простого UX решения?

А теперь представьте, что заявку оставляют в нерабочее время. У вас в офисе никого нет. Никто клиенту не перезвонит в течении 5 минут. И впереди длительные выходные. Нет смысла писать ему «вам перезвонят через 100500 минут». Чем больше времени прошло, тем больше шанс что ваш «клиент» обговаривает сделку с конкурентами. Возникает задача из разряда – «как заставить заявку подождать ответа менеджера».

Может быть и так, что у человека стоит галочка в телефоне «отвечать только на номер из записной книжки». При этом человек готов купить у вас или ваших конкурентов. Вопрос лишь в том, кто первым предложит ему удобный способ коммуникации. Возникает задача – «как быстро обсудить сделку без лишних разговоров с автоответчиком».

Большинство таких задач решаются на стыке Маркетинга и UX. UX – отвечает за то, как будет работать ваш продукт: функционал, удобство, отзывчивость. Маркетинг – отвечает за грамотные продающие решения. Это мощный тандем.

Нет предела совершенству. Постоянно собирайте статистику и отзывы – дорабатывайте UX продукта.

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

Возвращаясь к предыдущему примеру, который упоминался в разделе Прототипирование и UX дизайна, а именно – сайт продающий услуги. Задачи для UI в рамках этого примера:

• Типографика – делаем тексты легко воспринимаемыми. Повышаем читаемость за счёт шрифтов и шрифтовых пар, размерности и начертания. По необходимости делаем цветовое выделение. Если у вас в брендбуке указаны специфичные шрифты – без необходимости не стоит их тянуть на сайт. Лучше использовать безопасные, проверенные – это ускорит скорость загрузки сайта. Сайт должен грузиться быстро и отображаться корректно. Это критично.

• Обработка фотографий. Типичный набор действий: улучшение качества изображений нейронными сетями, удаление фона, подгонка размер и цветокоррекция, оптимизация веса фотографии для ускорения загрузки.

• Создания иллюстраций. Как правило — это создание коллажей. Отдельный вид искусства с кучей операций в Photoshop и Figma.

• Работа с композициями и отступами.
• Создание и добавление декоративных элементов.
• Расставление акцентов.

• Подготовка проекта: чистка, группировка, автолейауты, компоненты и стили, страниц и секций – весь проект нужно причесать для удобной работы.

С UI немножко не так как с UX. Оформление регулярно устаревает. Следите за трендами, смотрите поведение пользователей и переодически улучшаете внешний вид.