Клиент обратился к нам с задачей создать сайт для приложения по правильному питанию. Задача была не только сделать сайт, но и помочь с подготовкой видео контента о приложении. Необходимо было сделать 12 коротких роликов к каждому разделу приложения и один длинный информационный ролик. Всего в итоге получилось 13 видео роликов. Видео ролики включали в себя анимацию и интервью с врачами. Ролики делала сторонняя компания, мы же полностью сопровождали и помогали в написании сценария.
Создание сайта обычно начинается с проработки структуры, конкурентов и составления семантического ядра. Но этот проект был не стандартным. Проекту ДиетПро совершенно нет аналогов, только если очень отдаленно и мы не стали на них равняться, так как при работе над видео роликами у нас уже определилась стилистика и структура.
В первую очередь был сделан прототип сайта. Прототип, проще говоря, это наброска блоков, которые показывают дизайнеру какой контент и примерно, в каком виде должен находиться.
Цель сайта - не продажа чего-либо, а информирование клиента о приложении и призыв к его загрузке.
Шапка
Шапка сайта получилась достаточно легкой.
Первый экран
Первый экран очень важная составляющая, тут важно чтобы клиент заинтересовался в первую секунду и понял куда он попал и что может тут получить. На первом экране посетителю предлагается краткая информация о приложении и справа экран приложения с видео имитирующим пользование приложением. И чуть ниже кнопки, где клиент может загрузить непосредственно приложение.
Блок с видео
Как расположить 13 видео на одном экране? Задача была не из легких, но совместно с заказчиком сайта мы придумали вот такой блок:
При клике на круг всплывает окно с видео и описанием.
Окна с видео также можно открыть через верхнее меню.
Блок с преимуществами и цитаты врачей
Подвал сайта
Страница "Авторы"
Т.к. было важно показать, что в создании приложения участвовали врачи профильной специальности, под авторов была выделена отдельная страница. Идея блока заключалась в том, чтобы поместить всю информацию на первом экране и выдержать в единой стилистике в соответствии с кругами на главной странице. При клике на маленький круг, появляется текстовое описание о соответствующем авторе. Фото вылезает в крупном центральном круге.
Страница "Новости"
Проект интересен уникальным дизайном и использованием полностью нестандартных блоков. Цвета для сайта были взяты, использованные в приложении.
Больше наших работ смотрите на нашем сайте.