Давно не делали публикации о выполненных проектах. А о разработке нами этого, одного из самых сложных за 15 лет существования агентства, никто толком не знает, хотя окончательно pinkbus.ru был сдан в 2018 году. Сегодня исправляем эту оплошность.
В 2014 году разработали сайт для продажи вещей с принтами от иллюстраторов и дизайнеров. Наша разработка на тот момент была уникальной, потратили на нее около 200 часов и после сделали ряд улучшений. Функционал конструктора оказался актуальным и сегодня: с января 2021 года в наше агентство поступило несколько заявок на создание подобного функционала.
Цели и задачи
Целью было сделать сайт-сервис для продажи дизайнерских вещей, в котором иллюстраторы смогут формировать расположение принтов на предметах и устанавливать сумму, которую хотят получить за продажу вещи со своим дизайном на площадке PinkBus. Еще одним пунктом была реализация комьюнити-платформы для общения между иллюстраторами, дизайнерами и ценителями их работ.
Особенности проекта
Важным было по максимуму автоматизировать процесс формирования заказа, расчета доставки и выбора разных способов оплаты, включая Яндекс.Деньги и VISA.
Стоит упомянуть и контентную часть проекта. Мы спроектировали разводящую страницу блога, страницы статей с возможностью делиться ими в соцсетях. Блог позволяет проекту повышать лояльность клиентов и дизайнеров, проводя различные конкурсы и публикуя полезные материалы.
Немного фактов:
1. Серверная часть построена на фреймфорке Ruby on Rails, с использованием open-source библиотек.
2. На сайте реализована сложная система генерации превью товаров с принтами.
3. На иллюстраторов можно подписаться, чтобы получать информацию о появлении новых работ.
4. Разработан функционал для формирования макетов для печати.
Каждый иллюстратор или дизайнер имеет страничку, на которой представлены вещи с разработанными им принтами. При том стать частью команды можно лишь после отбора участников, и избранные кандидаты после заключения договора могут присылать работы для загрузки. А после старта продаж продукции получать проценты от ее реализации. Весь необходимый функционал для этого также был нами разработан.
Начинали с нескольких категорий, для которых отрисовали мокапы вещей в формате SVG:
1. холст,
2. постер,
3. сумка,
4. картина,
5. обложка,
6. чехол,
7. косметичка,
8. сумка пляжная.
Выбор векторного формата обусловлен гибкостью работы с ним на уровне кода и уменьшением объема промежуточного изображения, что важно при обработке в реальном времени.
На эти мокапы накладывалась картинка, загруженная иллюстратором через личный кабинет. В итоге, благодаря использованию библиотеки rmagick, получали итоговое изображение, которое и выгружается в каталог на сайте. При этом в панели администратора можно сформировать подготовленный к печати файл с указанием линий сгибов, разрезов и отослать его в типографию.
Со временем категории расширяли, вводили новые виды продукции и для каждого разрабатывалась сложная система по компоновке принта и макета самой вещи.
В процессе работы над проектом дизайнеры студии сделали 25 макетов сайта и разработали 19 мокапов для представления продукции. Каждый уникален, ведь для формирования итогового представления зонта, например, нужно просчитать 8 секций и собрать их в одно изображение, причем в реальном времени.
Чуть позже, в 2018 году, заказчик решил внедрить конструктор, чтобы дать возможность любому человеку напечатать понравившийся ему рисунок или фотографию на вещах. Это повысило время нахождения посетителя на сайте, что привело к росту поведенческих факторов, необходимых для повышения ранжирования проекта в выдаче поисковых систем. Конструктор позволяет проверить, как принт будет выглядеть после печати на предмете, хоть и обладает урезанным функционалом по сравнению с версией для иллюстраторов, заключивших договор.
Результат
В конце всех доработок и усовершенствований получилось сделать цельный высоко-конверсионный инструмент. Наше агентство разработало сайт, закрывающий потребности заказчика и полностью соответствующий принятому техническому заданию.
Гибкость в работе с проектом на самописном движке состоит в том, что все компоненты можно спроектировать самостоятельно, не привязываясь к имеющимся инструментам. Это не условный битрикс, ограниченный готовыми шаблонными решениями, поэтому уникальную логику проекта разрабатывали с нуля.