UX/UI дизайн приложения для сети ресторанов
Исследования
Работа над проектом началась с исследований.
Были проведены качественные исследование, а именно интервью с владельцем бизнеса, чтобы грамотно определить цели данного проекта, выделить сильные и слабые стороны, определить потенциальных пользователей продукта. И анкетирование - для выявления проблем, с которыми сталкиваются клиенты.
Некоторые результаты анкетирования и ответы на интервью можно увидеть в презентации. Данные исследования помогли определить потребности и проблемы клиентов, которые должен решить разрабатываемый продукт.
В рамках исследований также был осуществлен анализ конкурентов, выделив плюсы и минусы конкурирующих приложений. Особое внимание было уделено отзывам пользователей: что нравится в работе с продуктом, а что вызывает негативные ощущения. Большинство пользователей хотели видеть быстрое, простое и удобное в использовании приложение.
Цели проекта
Основные цели были выделены после интервью с владельцем бизнеса и анкетирования. Представлены в презентации ниже.
Пользователи
Для более детальной проработки потенциальных пользователей была составлена карта стейкхолдеров на основе данных исследований.
Отталкиваясь от карты стейкхолдеров и результатов исследований, были проработали персонажи, иными словами пользователи продукта с рядом потребностей и проблем, которые должен решать разрабатываемый продукт.
Создание персонажа помогло увидеть продукт их глазами.
Информационная архитектура
Опираясь на портреты персонажей и решение их проблем была разработана информационная архитектура приложения. Детально продумано сможет ли персонаж удовлетворить свои потребности и решить проблемы, всё ли учтено согласно целей проекта. Выглядит ли информационная архитектура целостно и будет ли просто с ее помощью создать удобное приложение, сможет ли пользователь быстро взаимодействовать с информацией на экранах .
Варфреймы
На начальном этапе проектирования экранов приложения были созданы варфреймы. За основу бралась информационная архитектура, добавляя необходимую информацию на экран.
Для визуализации как клиент взаимодействует с продукт был составлен CJM. Таблица отображена в презентации. С помощью нее появилась возможность примерно увидеть эмоции пользователя. И проследить, как клиент пользуется продуктом и какова вероятность, что он сможет решить свои проблемы.
Цвет и Типографика
После всех исследований, доработки персонажей, создание варфреймов, заполнения CJM были проведены работы по подбору цветов и шрифтов, выравнивания объектов и текста по сетке, добавлены фото блюд, иконки, чтобы пользователь быстрее мог найти нужную ему информацию на экране.
В качестве основного цветы был выбран оттенок зеленого. Этот цвет листьев, ассоциируется с правильным питанием. Остальные цвета подбирались путем гармоничного сочетания и целостности.
Экраны
В презентации можно увидеть готовые экраны приложения с использованием цветов и выбранных шрифтов.
Основным цветом выделены интерактивные элементы, например кнопки, переключатели.
Для общего фона приложения используется нейтральный цвет, чтобы блюда из меню выделялись на фоне самой карточки, описания и цены.
Главный экран приложение - это меню. Где можно найти фильтр, сортировку, строку поиска, разделы меню по категориям, популярные блюда и актуальные скидки от сети ресторанов.
На странице блюда указана вся необходимая информация для клиента о составе, КБЖУ, весе и цене, а также времени приготовления. Здесь же можно добавить блюдо в избранное, поставить ему оценку.
В личном кабинете можно найти информацию об адресах пользователя, добавленных платёжных картах и накопленных бонусах. Из личного профиля можно быстро перейти к любимым блюдам и оформить заказ. Или удалить блюдо из этого разделе, нажав на сердечко.
На экране ресторанов есть информация о ресторане, его рейтинге, отзывы посетителей. На этом экране можно забронировать столик в конкретном заведение. И данная бронь отобразится в личном кабинете пользователя История броней.
Презентация проекта