Создание интернет-магазина по продаже фермерских продуктов

Летом 2020 года в нашу веб-студию обратился заказчик с уже готовым техническим заданием для создания нового сайта - интернет-магазина фермерских продуктов. В принципе, создание интернет-магазина по готовому техзаданию для нас не является чем-то из ряда вон выходящим, но некоторые пункты и детали этого задания показались нам необычными.

Было ясно, что это не типовой проект, и реализация некоторых возможностей функционала потребует от нас нестандартного подхода. Кроме того, проект задумывался как достаточно широкомасштабный: сайт нужно было сделать на трех языках, причем основным языком должен был стать грузинский, поскольку ресурс должен был запускаться и работать в Грузии, в городе Батуми.

Задачи проекта

Общий замысел проекта был таким: сделать единую онлайн площадку по продаже и доставке самых лучших грузинских продуктов, - как для жителей Грузии, так и для гостей страны.

По замыслу заказчика на сайте в итоге должно было быть не менее 500 уникальных товаров со всех уголков Грузии - экологически чистых и полезных продуктов от небольших фермерских хозяйств. Каждый товар должны сопровождать уникальные фотографии, описание и характеристики, а также возможность оставить отзыв о продукте и рейтинг, составляющийся на основе имеющихся отзывов.

Кроме того, помимо товаров, на сайте должен был присутствовать раздел с каталогом фермеров, с фотографиями хозяйств, их подробным описанием, чтобы посетитель сайта видел, откуда прибыли продукты и в каких условиях они выращивались. На основании отзывов о товарах определенной фермы также составлялся и рейтинг соответствующего хозяйства. Система отзывов и рейтингов должна была помочь посетителю определиться с выбором.

Таких нестандартных пунктов у проекта было довольно много. Кроме того, предстояла и обширная работа, чтобы сделать сайт полностью под ключ:

• купить доменное имя в зоне GE, оформить его на заказчика;
• полностью подготовить контент для сайта, включая фотографии, описания и тексты для всех страниц – на русском, грузинском и английском;
• придумать и согласовать название сайта, разработать логотип и фирменный стиль, и, используя его, нарисовать макеты всех страниц;
• сверстать ресурс, используя адаптивную верстку;
• наполнить его, настроить необходимый функционал (включая онлайн-оплату), в том числе создать и протестировать нестандартный, описанный заказчиком в техзадании;
• проверить сайт, перенести его с тестового домена на основной.

Изначально заказчик отводил нам на все это 40-60 дней, но поскольку в проекте нужно было реализовать некоторые по-настоящему нестандартные подходы и объем предстоящих работ был достаточно большим, он согласился разбить все работы на четыре основные этапа:

• подготовка всех материалов, включая написание текстов на трех языках, подготовка четырех уникальных карточек товара, необходимых к моменту переноса сайта на основное доменное имя;
• разработка логотипа, фирменного стиля и дизайн-макетов для всех страниц;
• верстка сайта, его наполнение и адаптация всех страниц;
• настройка необходимого функционала, тестирование и перенос ресурса.

Сроки начала и окончания работ, стоимость каждого этапа и конечная стоимость были оговорены с заказчиком и после достижения согласия - подписан договор и оплачен первый этап.

Реализация цели

Работа началась с создания подробной структуры сайта, в том числе его главной страницы. При разработке мы старались учесть все пункты техзадания, а также те пожелания, которых не было в первоначальном варианте, но которые появились у заказчика в результате обсуждения проекта. Кроме того, мы постарались воплотить некоторые идеи исходя из собственного опыта, тем более что заказчик это всячески приветствовал и был открыт к рекомендациям.

В шапке сайта разместили логотип, три кнопки для переключения языковых версий сайта, информацию о времени работы магазина и номер телефона для связи. Ниже расположилось главное меню, содержащее пункты: каталог, акции, доставка и оплата, новости, отзывы, наша миссия, фермы, контакты. Здесь же, правее, находились кнопки «Поиск», «Корзина» и вход в «Личный кабинет». Под главным меню, по нашей задумке, должна была находиться красивая тематическая картина с главным заголовком «Доставка грузинских продуктов и товаров на дом».

Ниже (под основной картинкой) разместился слайдер с акционными товарами и предложениями. Далее - список с категориями товаров, которые мы планировали выполнить в виде соответствующих им иконок. Изначально было запланировано 9 категорий, а впоследствии, при необходимости, их число можно было увеличить. Ниже разместили блоки «Популярные товары» (сюда автоматически выводились превью самых покупаемых товаров) и «Новинки» (формирующиеся из последних загруженных на сайт товаров).

Ниже мы выделили место для блока «О нас», где планировали поместить небольшой текст о сайте «Geo Market» и рисунок. Далее следовали блоки «Наши преимущества», «Отзывы наших покупателей», форма обратной связи «Остались вопросы» и футер с картой сайта, контактной информацией и ссылками на соцсети компании.

Одновременно мы сделали структуру для карточки товара. Карточка должна была содержать название товара, его фотографии, указание фермы, откуда был он был привезен (а под название фермы мы планировали «подложить» ссылку с переходом на страницу этого хозяйства), стоимость товара в национальной грузинской валюте - лари (на всех языковых версиях сайта цена должна была отображаться только в лари), поле выбора количества необходимых товаров, кнопку «В корзину», форму для написания отзыва и блок «Похожие товары».

Все созданные проекты структуры страниц и карточки мы направили заказчику, который уже на следующий день связался с нами для обсуждения деталей, пунктов меню и каталога и задал вопросы по отдельным, интересующим его моментам. Получив ответы, он согласовал наши разработки и попросил как можно скорее заняться созданием контента и дизайна будущего сайта.

Исходя из тематики мы предложили заказчику несколько названий для ресурса. Он остановился на названии «Geo Market», понравившемся ему больше всего. После этого копирайтер занялся написанием уникальных текстов для главной страницы и четырех карточек товара.

Тексты должны были быть оригинальными, легко читаться и приятно восприниматься, а от описаний требовалось быть содержательными, уникальными и интересными. Русскоязычные тексты были готовы за 10 дней, после чего отправились к переводчикам, которые потратили еще 3 дня на перевод.

После полной готовности текстового контента дизайнер приступил к его оформлению. Начал он с разработки логотипа. Поскольку заказчик не просил чего-то конкретного, а лишь хотел получить что-то интересное и по теме сайта, за следующие 4 дня дизайнер создал порядка 12 разноплановых логотипов - все в разных стилях и цветах, из которых заказчик выбрал понравившийся. Однако и его требовалось слегка доработать. Когда логотип и основные цвета сайта были утверждены, дизайнер приступил к созданию дизайн-макета главной страницы.

Самой ресурсоемкой и затратной по времени стала работа над созданием тематической картинки для главного экрана сайта. Нашей задачей было сделать яркую, красивую и запоминающуюся картинку. Заказчик не имел представления, каким должен был быть ее стиль и тематика, а лишь сказал, что было бы неплохо, если б на ней были какие-то узнаваемые места или здания Батуми.

Мы предложили отталкиваться от главной идеи сайта: доставки фермерских товаров со всей Грузии, поэтому попробовать изобразить процесс их доставки в Батуми. Заказчик эту идею поддержал и дизайнер принялся за работу.

Пока дизайнер ломал голову над воплощением этого “графического шедевра”, мы нашли в Батуми человека, который согласился посетить одну из ферм и сделать серию фото, дающих представление о хозяйстве, его продукции, процессе выращивания и сбора урожая. Уже через пару дней мы получили неплохие, хоть и нуждающиеся в дальнейшей доработке фотографии особых фермерских теплиц и растущих в них пряностей и овощей: марокканской мяты, греческого базилика, украинского кабачка и рукколы.

К этому моменту дизайнер уже закончил основные работы по созданию рисунков для главной страницы, которые отправились на изучение к заказчику, и, чтобы не терять время, занялся отбором, обработкой и подготовкой фотографий для сайта. Часть из них была выбрана для использования в карточках товаров, а часть - для раздела «Фермы».

Через пару дней заказчик вышел на связь: ему понравилась идея с картинкой и ее воплощение дизайнером, но он все-таки попросил сделать незначительные изменения, что мы и выполнили в течение дня. После некоторых доработок цветовых элементов картинки дизайнер занялся слайдером с акционными товарами и предложениями. Затем нарисовал девять уникальных иконок для каждой категории товара, оформил блоки «Популярные товары», «Новинки» и «О нас», создал тематическую инфографику для блока преимуществ, оформил блоки «Отзывы наших покупателей» и «Остались вопросы», а также нарисовал картинку для блока «О нас».

Пока заказчик изучал направленный ему дизайн-макет главной страницы, дизайнер оформил карточку товара, используя уже подготовленные фотографии и тексты, после чего оперативно выслал макет заказчику. К нашему удивлению, оба макета были приняты заказчиком безоговорочно, после чего дизайнер продолжил оформлять оставшиеся страницы сайта в выбранном стиле. Работы с макетами были полностью завершены за пять дней, и после их утверждения мы занялись версткой сайта.

Еще в самом начале, в процессе переговоров с заказчиком мы обсуждали вопрос выбора CMS для сайта подобного уровня и функционала и целесообразность использования платных движков. Учитывая задачи, поставленные в техзадании, мы понимали, что готового решения для воплощения подобного функционала не существует – ни в бесплатных CMS, ни в платных, так что часть функционала придется дорабатывать.

Поскольку мы достаточно давно работаем с CMS OpenCart, мы хорошо знаем его базовые возможности и в случае необходимости можем внести нужные изменения путем доработки кода, создания скриптов или установки сторонних модулей с последующей доработкой (если и они не смогут помочь в достижении нужного результата). Заказчик полностью доверился нам и утвердил CMS OpenCart для своего проекта.

В течение десяти дней веб-мастер верстал и наполнял сайт контентом, а также настраивал необходимый функционал. Воплощены были все нестандартные опции: установлен упрощенный вариант оформления заказа (с помощью установки стороннего платного модуля), создан общий рейтинг товаров и фермерских хозяйств на основе отзывов посетителей, с отображением его в карточке товара и на странице фермы).

Интересное решение было использовано при настройке бронирования товара: поскольку большая часть товаров на сайте привозится под заказ, в среднем в течении 1-2 дней, информацию о дате получения товара следовало обязательно отображать в карточке товара и при его оформлении, чтобы дать покупателю ясное представление о том, когда именно он получит свою покупку.

Кроме того, на сайте должен был быть установлен онлайн-платежный модуль, но на момент запуска ресурса заказчик еще не определился с банком-посредником, через который будут проходить платежи. Также нами был сделан ряд мелких доработок функционала.

Когда все работы были завершены, наш системный администратор создал несколько ящиков корпоративной почты для заказчика, которые веб-мастер «привязал» к формам обратной связи для уведомления о заказах, сделанных на сайте.

Затем ресурс в течение нескольких дней тестировался, проверялся на кроссбраузерность и кроссплатформенность. В сентябре мы купили и оформили на заказчика доменное имя geo-market.ge, после чего перенесли сайт на него.

В данный момент заказчик определяется с полным списком всех товаров, количеством фермерских хозяйств и выбирает банк для онлайн-оплаты. Также он планирует создать аккаунты компании «Geo Market» в соцсетях и прислать ссылки на них. Когда все это будет готово – пройдут завершающие работы с ресурсом и состоится его полноценный запуск.