Этапы процесса проектирования UI/UX с последующим демонстрированием во время обучения на личном опыте. Я считаю, что конечный дизайн проекта требует корректировок. (околодизайн годов 2010'ых и в современных дизайнах никуда не годится)

1. Исследование целей и задач по отношению к заказчику

• Нужно понять задачи, потребности и конечные цели пользователей сайта, чтобы создать эффективный, гибкий и удобный интерфейс сайта (включая предпочтения заказчика, если таковые имеются). Ключевыми задачами проекта (Beauty salon site) становятся:

• Привлечение новых клиентов в пределах страны

  Предоставление информации о салоне и его услугах

• Возможность записи на услуги онлайн через сайт

• Создание положительного имиджа салона за счет визуальной составляющей

На данном этапе у меня имеется тематика "салон красоты", необходимая заказчику, которая должна составлять в себе:

2. User story map

USM - это функционал будущего прототипа, включающий в себя: поставленные цели и задачи рядовым пользователем, всевозможные взаимодействия [пользователя] с сайтом и его функционал.

• Фотография USM отсутствует (утеряна)

2.1 Mindmap

3. User flow

User flow можно обозвать графическим представлением составляющей последовательности действий, а так же функций, где пользователь сможет достигнуть своей цели в рамках сайта.

User flow включает в себя: task flow (графические блок-схемы), wireframe (набросок дизайна), wire flow (объединение task flow и wireframe) и screenflow.

4. Task flow

Task flow представляет собой самую обыкновенную блок-схему. В task flow описывается последовательность действий пользователя на сайте для достижения им выбранных целей и задач.

5. Wire flow

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

5.1 Wireframe

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

5.1 PC Wireframe

5.2 Mobile wireframe

6. Screenflow

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

6.1 Функциональный прототип PC версии сайта

6.2 Функциональный прототип mobile версии сайта