Большой сайт для маленьких купальников. Микро-Бикини.

Не работайте с фрилансерами

Зимней ночью в 0ч 14м Заказчик из Калининграда обратился в нашу компанию через форму на сайте.

В 0ч 19м уже велась переписка по выяснению деталей проекта, а утром того же дня на столе менеджера лежало Техническое задание Заказчика для изучения и оценки.

Заказчик был явно удивлен такой оперативностью.

письмо.png

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

“Выбрасывать” наработки было жалко и мы провели аудит трудов фрилансера. С грустью заключили - качество кода не позволяет его использовать и придется начинать с начала.


Итак, на входе имеем:

  • ТЗ, требующее уточнений и доработки

  • Макеты почти всех страниц в формате Corel Draw

  • Осадок у Заказчика от сотрудничества с фрилансером

ложки.png

Так было положено стремительное начало проекта.


Тонкая грань между дизайном и веб-дизайном

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

В нашем случае макеты были предоставлены в Corel Draw, и каждый макет пришлось аккуратно перенести в Photoshop. В результате каждый макет был перерисован и адаптирован под реалии веб. Невооруженным взглядом работа не видна, однако провести ее было необходимо. В общей сложности на “невидимую” работу потрачено более 50 часов.

На заметку:

Не стоит заказывать дизайн сайтов у дизайнеров полиграфии, все равно переделывать!


Верстка, весна, жара...

Верстка проекта пришлась на самый разгар весны. Более 30 макетов, практически на каждом девушки в бикини, да что там говорить даже не в мини - в МИКРО-бикини. Ежедневно весь проектный отдел был обречен лицезреть всю эту красоту на мониторе верстальщика...   

Макет, который любит наш верстальщик))

сatalog.png

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

В общем всю весну было жарко.


Пришло лето, пришло время разработки…

Кондиционеры и вентиляторы работали на всю мощь — Анатолий писал код)

Взгляд программиста

С точки зрения программиста на этом сайте был целый ряд интересных задач:

  • Конструктор купальников

  • Перенос данных со старого сайта

  • Интеграция с 1С (а как же без нее, родимой)

  • Аффилиатская программа

  • Наборы


1. Конструктор купальников

Схема данных простая: есть товар, есть его цветоразмерные вариации — SKU. Их много, у каждого товара — от нескольких десятков до тысячи. Такое обилие, кстати, оказалось сюрпризом, но было предусмотрено при проектировании интерфейса. Был предусмотрен конструктор купальников, так хорошо знакомый нам по тиражному интернет-магазину Битрикса. Хотя он был сильно переработан — в ТЗ ему посвящены целых 5 страниц с выкладками и поясняющими иллюстрациями.

корзина.png

Стандартный конструктор SKU


конструктор.png

Конструктор SKU на сайте


Но просто использовать уже написанный код нельзя было — и все из-за 1С. Вместо того, чтобы выгружать цвета и размеры в разные свойства, она складывала их в одну большую характеристику “CML2_ATTRIBUTES”. Такое поведение не редкость и мы знаем, как с ним справляться. Можно было адаптировать данные под стандартный конструктор, а можно было конструктор изменить под наши данные. Выбрали второй метод и не прогадали — все работает как часы и не пришлось на лету изменять тысячи товаров при выгрузке из 1С.


2. Перенос данных со старого сайта

У заказчика уже был сайт с адекватной базой данных, поэтому это был больше организационный вопрос. Со старого сайта хотели импортировать заказы (over 9000) , пользователей (тоже over 9000) и отзывы к товарам.

Проще всего оказалось затянуть пользователей: в Битриксе для этого есть мастер импорта из CSV-таблицы.

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

А вот с отзывами был казус - на старом сайте отзыв был обычным текстом + E-mail покупателя. На новом сайте чтобы оставить отзыв нужно обязательно оценить товар по трем критериям! Вот уж, как говорится, тот неловкий момент, когда ни один из 700 отзывов не хочет импортироваться на сайт по совершенно адекватной, задокументированной в ТЗ причине — не все обязательные поля заполнены. Но и тут справились.

Еще в SEO-целях потребовалось проставить редиректы для товаров со старых страниц на новые. Тут весь процесс автоматизировать не удалось: сопоставление товаров клиент выполнял вручную (почти 300 товаров были заботливо найдены на старом сайте и сопоставлены с товарами на новом). Получилась такая таблица:

урл.png

Преобразовать таблицу в SEO-инструкции перенаправления помог небольшой специально обученный модуль.


3. Интеграция с 1С

Обмен данными с 1С — наша любимая вишенка на торте. Чего только тут не было! Например, заказчик хотел, чтобы на сайте было два типа товаров - цельные товары с SKU и комплекты, причем комплектующие должны были быть скрыты и от поиска по сайту, и от прямых переходов по ссылкам. Решили очень просто - разнесли товары по двум парам инфоблоков в 1С, установив разные коды для каталогов:

  1. Цельные товары и комплекты

  2. SKU цельных товаров

  3. Комплектующие

  4. SKU комплектующих

И у последних двух инфоблоков на сайте скрыли ссылки через системные настройки.

А еще, ближе к концу разработки, появилась необходимость выгружать из 1С не только количество товаров, но и “стратегию” их продажи - некоторые товары можно было продавать сломя голову, а для других обязателен количественный учет. Специалисты со стороны заказчика нашли способ выгружать это особое свойство в xml, а мы - читать его и записывать куда положено.


4. Прочее

Остальная часть сайта, несомненно, оказалась проще. Хотя и здесь были нетипичные ситуации. К примеру, на сайте требовался партнерский раздел - по сути это классическая аффилиатская программа. Все страницы этого раздела (информация, регистрация, приветствие, инструменты, отчеты) аккуратно оформили в один собственный комплексный компонент intervolga:affiliate.cabinet.

Или вот потребовалось дописать компонент вывода текущего уровня накопительной скидки ( catalog.discsave.info ) - стандартный компонент, пока вы не добрались хотя бы до первого уровня в такой скидке упорно информирует вас, что “Вы не подпадаете под условия действия накопительных программ”, вместо того, чтобы по-человечески сказать, а что, собственно, для этого нужно сделать.

скидка.png

Еще запомнилась длинная цепочка запросов, которые нужно выполнить, чтобы на странице истории заказов получить данные о покупке: заказ - товары заказа - SKU - сам товар - набор, в составе которого товар.


Выводы

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



Комментарии (1)

...
  • Роман
  • 19.03.2015 13:46:59
Интересно читать, проделана огромная работа, правда не заметил ссылку на сам сайт чтобы оценить вживую