Цель и задачи проекта
Цель
Разработать корпоративный сайт для производителя продуктов из топинамбура
Задачи
- Проанализировать материалы и бриф от заказчика
- Разработать концепт на базе полученных материалов
- На базе концепта собрать все страницы сайта и стайлгайд
С чем работаем?
В апреле 2021 года к нам обратились из Богословского Меридиана, компании, которая занимается производством экологически чистых продуктов из топинамбура — для создания корпоративного сайта своей компании. Компании нужен был красивый, светлый и яркий сайт, передающий атмосферу бренда. Кроме того, необходимо было доступно рассказать на сайте о преимуществах продукции.
Сначала собираем концепт
Получив бриф и входные материалы от заказчика, мы начали работу над сборкой первых концептов, по традиции в концептах фигурируют несколько блоков, которые мы собираем по-разному.
В первом концепте преимущества продукции собрали под главным слайдером, а этапы производства показали в виде иконок. Открытую форму обратного звонка разместили на плашке.
Первый концепт
Во втором концепте форма и преимущества заняли по отдельному блоку, ключевое отличие от первого концепта — более крупные блоки по сравнению с первым концептом и больших теплых тонов в оформлении фона.
Второй концепт
Законченная главная
Из двух концептов собрали одну финальную версию главной страницы — теперь можно было работать над оставшимися страницами и прорабатывать текстовые стили, интерактивные элементы и стили шапки, подвала и меню в стайлгайде.
Финальная версия главной страницы
Проработка остальных страниц
После того, как работа над лицом компании в виде главной страницы была закончена, можно было сфокусироваться над другими не менее важными страницами — страницами о компании, продукции, производства, оплаты и доставки, а также контактов. На них мы раскрыли особенности продукции и контактные данные «Богословского Меридиана», технологии производства и вкратце рассказали о компании.
Страница о компании
Страница продукции
Страница оплаты и доставки
Страница производства
Страница контактов
Страница 404
Адаптивность
Сайт — полностью адаптивен. Каждую из страниц мы проработали в 3 экранах: 320 (смартфоны), 768 (планшет) и 1920 (стационарные компьютеры) для того чтобы сайт идеально отображался на любом устройстве.
Стайлгайд
Для полноценной адекватной работы сайта в стайлгайде собрали все интерактивные состояния элементов, стили текста, цвета интерфейса для сайта состояния шапки и подвала и многое другое
Шапка и подвал, стики
Типографские стили
Интерактивные элементы
Инпуты
Модальные окна
Кнопки
