Mobile Belissimo app
была поставлена задача:
Разработать дизайн 3 контентных экранов iOS приложения. Результат выполнения предоставить для проверки в формате png.
Общее описание продукта
Приложение представляет из себя большую книгу рецептов, сгруппированных по странам мира. Реализовать требуется 3 экрана этого приложения:
- Экран выбора страны происхождения рецепта;
- Экран списка рецептов (после выбора страны);
- Экран просмотра рецепта с алгоритмом приготовления блюда по шагам.
Входные данные
О каждом рецепте в базе данных содержится следующая информация:
- название рецепта;
- страна происхождения рецепта;
- иконка (превью) для списка рецептов;
- основное изображение рецепта (для страницы рецепта);
- время приготовления;
- уровень сложности приготовления;
- калорийность готового блюда на 100 гр;
- количество добавлений в “избранные рецепты” и его статус для конкретного пользователя (является ли избранным), другими словами неактивный/активный индикатор избранного;
- текст рецепта, разбитый по шагам приготовления блюда.
Для каждой страны доступны следующие элементы:
- название страны;
- изображение страны (для списка стран);
- иконка флага;
- среднее время приготовления блюда;
- общая сложность рецептов выбранной страны.
Все вышеупомянутые элементы можно использовать при проектировании экранов.
Описание экранов
Ниже описаны некоторые подробности об экранах, которые необходимо учесть при реализации дизайна.
Экран “Выбор страны”
Необходимо придумать схему расположения категорий рецептов (по странам), при этом учесть следующее:
- Обязательно наличие изображение страны;
- Обязательно наличие названия страны;
- Обязательно наличие индикатора уровня сложности;
- Экран не должен быть перегружен информацией (не допускается расположение большого количества стран на одном экране);
- Допускается наличие поиска по стране в топе экрана.
По нажатию на одну из стран пользователь переходит на страницу списка рецептов.
Экран “Список рецептов”
Важно! Этот экран не должен быть перегружен контентом (не допускается расположение большого количества рецептов на одном экране).
Для каждого рецепта необходимо использовать следующие параметры:
- Название рецепта;
- Превью рецепта;
- Иконка страны рецепта;
- Время приготовления блюда;
- Индикатор “Избранное” и количество добавлений рецепта в избранное по системе.
Также, при проектировании можно комбинировать любые параметры рецептов, которые имеются в базе (элементы перечислены в начале ТЗ).
По нажатию по одному из рецептов пользователь переходит на страницу описания рецепта и алгоритма приготовления.
Экран “Рецепт”
Необходимо реализовать не менее 300% этого экрана.
Как и в случае с предыдущим экраном, на этом экране возможно комбинирование имеющихся в БД параметров.
Обязательные к использованию параметры на этом экране:
- Основное изображение блюда;
- Время приготовления;
- Уровень сложности приготовления.
Алгоритм приготовления блюда необходимо представить по шагам, например:
Шаг 1: Готовим рис. Два стакана воды выливаем в кастрюлю и доводим до кипения. Высыпаем в кипящую воду стакан риса. Через минуту уменьшаем огонь. Накрываем кастрюлю крышкой. Отвариваем рис на медленном огне 45 минут.
Шаг 2: Котелок с выпуклым днищем разогреваем на среднем огне.
Шаг 3: Когда рису осталось вариться 25 минут, разрезаем курицу на маленькие кусочки. Наливаем масло в котелок и обжариваем мясо.
И так далее.