Добро пожаловать в наш огород!Нет, нет, мы не сошли с ума. Все в отличной психической и физической форме, на свежем воздухе ведь работаем.Пришёл интересный заказчик с вкусной темой, поэтому мы решили показать нашу работу с ним, да и вообще наш типичный процесс работы по созданию сайта на примере агро процесса по выращиванию чего-нибудь.Если честно, у нас ещё корыстный интерес есть к этой теме, только не говорите никому)В будущем можем серьёзную конкуренцию заказчику составить. У нас есть все задатки.Анализ конкурентов и целевой аудитории. Этап 1Анализ рынка и планирование урожая. Мы как агрономы-предприниматели на этом этапе обязаны были изучить и проанализировать текущую ситуацию на рынке:Мы досконально изучили материалы и наметили две задачи, которые должен был решать сайт...Задача №1. Узнаваемость брендаУ заказчика был конкретный запрос и шикарный брендбук. Поэтому первоочередной задачей сайта было повышение узнаваемости бренда среди широкой аудитории.Задача №2. Клубника или ягода?Такой вопрос возник у нас сразу при обдумывании идеи сайта. У заказчика планировался большой ассортимент ягод, но на момент разработки сайта была только клубника.Поэтому перед нами встала непростая задача: нужно было и весь ассортимент показать, которого пока нет, с заделом на будущее, и клубнику выделить, ведь именно её нужно было продавать.Разработка структуры и текст. Этап 2Что посеешь, то и пожнёшь... Мы решили сеять ягоду!То есть в тексте мы использовали именно слово «ягода» и подразумевали весь ассортимент. Клубнику просто польём получше на следующем этапе, чтобы она затмила пока остальные ягоды.Прежде чем продолжим готовиться к посеву, вставим сентиментальную, НО ВАЖНУЮ РЕМАРКУ.Мы ему прям поверили, в его любовь к делу, в сладкий вкус клубники зимой, в то, что детей можно спокойно ей кормить. И конечно, сделали всё, чтобы в это поверили его клиенты. У нас даже слоган родился.Посев...Семена мы подготовили, осталось их только грамотно посеять: в правильном порядке, с нужными интервалами, по структуре.В текстовом прототипе сначала отразили наиболее важную информацию:Разработка дизайн-концепций. Этап 3Начинается наш любимый этап, где мы буквально поливаем и оживляем наши задумки из серии:В данном проекте к серии «Показать не показывая и скрыть, не скрывая» относился пока ещё не существующий ассортимент, который нужно было показать, но не сильно. При этом сделать акцент на клубнику, но не только.Дизайн-концепция №1Тут образ был построен на основе логотипа «Пять сезонов» — прямоугольные, закруглённые формы, напоминающие геометрию силуэта упаковки.Вариант 1.1:1. В главном экране сделали акцент на клубнике.Максимально минималистично, с концентрацией на самом продукте, разместили красивую сочную клубнику, в качестве подложки взяли силуэт упаковки из логотипа - просто, но со смыслом. Неявная деталь, которая усиливает ассоциативную связь продукта с брендом.2. При этом показали остальные ягоды, не показывая :)Чтобы учесть наш нюанс - не делать акцент на будущих продуктах, но дать понять, что производят не только клубнику, решили убрать другие ягоды в слайдер на главном экране. При этом показать наличие других ягод сразу через пагинаторы в виде миниатюр.3. То же самое сделали в каталоге.Необходимо было показать всю продукцию, даже которой пока нет. Поэтому мы решили указать в карточках товара предполагаемую дату, когда ожидается урожай.Данную дизайн-концепцию мы сделали ещё в одном цветовом решении.Основой служил теперь светло-бежевый цвет, а темно-зеленый выполнял роль акцентного, так концентрация внимания на каждом блоке усилилась.Вариант 1.2:Дизайн-концепция №2Более классическая. Сделали акцент не только на продукции, но и показали масштаб производства — теплицы и готовый урожай. Так родилась девушка с клубникой на главном экране.Вариант 2.0:1. Основу концепции составляли сочные фотографии.2. КаталогВ каталог заложили идею разных фонов, цвет которых у каждой ягоды был бы свой. Но, чтобы избежать пестроты, каталог свернули в слайдер.Доработка дизайн-концепции. Этап промежуточныйБыл выбран первый дизайн-концепт в светлом исполнении, но с несколькими поправками.Каталог также требовал завершенности.Заказчику не понравилось пустое место в каталоге, попросил решить данную проблему. Нам пришла идея сделать элемент по форме карточек и ещё раз показать лого бренда вместе со слоганом - это стало достаточно логичной акцентной точкой в данном блоке.Разработка полного дизайна. Этап 4Разрабатываем полный дизайн-макет. Чтобы всходы быстрее дали плоды, удобряем, предупреждаем возможные проблемы.Например, было несколько моментов, которые даже на этом этапе могли быть непонятны заказчику. Дело в том, что мы не делаем анимацию сразу, а на согласование отправляем статичные макеты. Поэтому, чтобы избежать недопонимания, подготавливаем сопроводительное письмо с объяснениями.Подготовка к вёрстке, тз для верстальщика. Этап 5Если бы всё было так просто после всходов, то определённо у всех агрономов была бы не жизнь, а малина.А тут, когда кажется, что всё уже готово, ещё нужно прополоть, окучить, адаптивы сделать, ТЗ для верстальщика написать. А потом ещё надо урожай собрать, продегустировать и отгрузить.Вёрстка, разработка, тестирование. Этап 6И вот так всегда! Вся наша ягода достаётся верстальщику.Сначала он её собирает и по коробочкам раскладывает, а затем пробует и наслаждается отличным вкусом и результатом.Итак, что сделали:Сверстали все страницы.Разработали функционал на CMS Битрикс.Провели тестирование на исправную работу сайта, адаптивность. На всех устройствах: компьютерах, ноутбуках, телефонах, планшетах, Windows, Mac Book.Выявили и устранили проблему: видео с сайта не проигрывалось на телефонах Android.Проверили скорость загрузки сайта и оптимизировали.Передача проекта заказчику. Этап 7Отгружаем партию заказчику, как положено - с накладной и полным отчётом.Настроили админ панель. Продумали и подготовили подробный мануал, чтобы заказчик в дальнейшем мог самостоятельно управлять сайтом. Это важно, так как необходимо будет добавлять новые продукты.Хотите, чтобы в ваш проект погрузились также, не бросайте камень в наш огород, бросьте заявку :) Оставьте заявку на сайте.Подпишитесь на наш телеграм-канал, где мы рассказываем про коммерческий дизайн и показываем работу студии изнутри.