Как мы делали formoza29.ru
Dec. 21st, 2011 05:14 am![[personal profile]](https://www.dreamwidth.org/img/silk/identity/user.png){kind=small}
ermouthКогда я взялся за новый сайт Архангельской Формозы, – это было в начале ноября, – мне нужно было решить, на чём сфокусировать свои дизайнерские и организационно-инженерные скиллы. Вводные были примерно такие:
- до НГ надо сделать публичную бету с основным функционалом
- это должен быть Битрикс – пожелание заказчика
- есть база товаров, выгружаемая из 1С не последней версии, база актуальна – на ней работают офлайновые магазины
- база – это очень неравновесное дерево (см первые два уровня на старом сайте и попробуйте чёнить понять) с кучей проблем:
- некоторые маловажные группы товаров находятся на самом верхнем уровне
- некоторые важные группы распределены по нескольким веткам
- другие важные группы закопаны очень глубоко (2-3 уровень вложенности)
- логика вложений групп по большому счёту для покупателя совершенно неочевидна
- база не атрибутирована и не категоризирована – в каждой строке базы есть только описание и цена, никаких полей типа “призводитель” или там “объем памяти” или “диагональ”
- в описаниях полный разнобой и каша
- привести исходную базу к единообразным описаниям не получится – там в районе 9000 наименований, да и не ясно было, каким должно быть это единообразие
- атрибутировать руками базу не получится: 1С-бухгалтерия – это чудовищное интерфейсное говно, на задание одного атрибута товара нужно сделать в районе 10 кликов и выборов из дропдаунов, а атрибутов может быть несколько (диагональ там, цвет, то-сё)
Чтобы было понятно, какие там описания товаров в базе – вот три строчки со старого сайта:
Это причём из одного раздела. Насколько различаются описания из разных разделов, лучше не знать.
Всё это совершенно не мешает Формозе быть вторым по объемам компьютерным ритейлом на Северо-западе РФ – потому что продажи идут через консультантов в офлайновых магазинах, потому что цены низкие, потому что большой ассортимент и логистика отлажена. Но понятно, что сайт, организованный по таким принципам, обречён.
Как я это решал (многабукф, неподготовленному читателю будет сложно :) …
Стало быть, мне нужно было придумать эффективный способ приемлемой автоматической категоризации, да причём такой, которая хорошо накрывала бы как имеющиеся, так и будущие группы товаров и прощала кашу в описаниях. И которую можно было бы гнуть и расширять по ходу пьесы и по фидбэку пользователей.
Первый подход к снаряду – попробовать переразбить базу при импорте из 1С на сайт – отвалился при самой грубой оценке трудозатрат.
Во-первых, Битрикс работает поверх реляционной модели – то-есть все будущие и имеющиеся категории и атрибуты надо было бы сначала вкрутить в справочники. То-есть приколотить в самом начале разработки совершенно волюнтаристским способом – что явно не вариант.
Во-вторых, Битрикс написан на php, то-есть про все прелести функционального программирования типа карринга для генерации контекстно-зависимых фильтров, делегатов для подстановки обработчиков и тп вкусностей сразу можно было забыть. А имитировать это всё в ООП-модели – это обречь себя на бесконечную отладку и тщательнейшее проектирование.
В третьих, такого рода парсеры – это всегда куча регулярных выражений, которые трудно отлаживаются и чрезвычайно прожорливы до процессорного времени и памяти. Что резко повышало требования к аппаратному обеспечению сервера в момент импорта базы из 1С.
И я решил поступить своим излюбленным способом – оставить за сервером только выдачу сырых данных, а всё разбиение на категории и атрибуты (то, что я тегами называю), вынести на сторону клиента. Пусть браузеры работают, а сервер отдыхает. Ну и в браузере же делается приведение описание в читаемый вид – то есть вот такое вот…
прямо в браузере становится вот таким (тоже не ах, но куда читаемей):
Сейчас, в общем, так и сделано. После загрузки страницы товаров запускается скрипт, который выделяет основные категории и атрибуты товаров довольно мудрёным образом. И уже прямо на клиенте в зависимости от выдачи строятся тэги.
То-есть, если отключить скрипты, страничка группы товаров будет выглядеть такой-же неюзабельной кашей, как и на старом сайте.
Вообще, такой подход большинством веб-разработчиков почитается за полную ересь. Исключительно из твердолобости, на мой взгляд, кстати.
Также часто воспринимается как ересь и отказ от человекопонятных урлов (у меня просто хэши, в гробу я видел урлы типа /catalog/aksessuari-dlya-planshetnikov/).
Ещё «ереси»:
- разработка проекта вообще без техзадания (я использую vision-based подход, “жирное” прототипирование и всю мощь русского языка как для описания, так и для управления)
- agile-подход с элементами scrum (без присущего скрам-подходу идиотизма типа митингов в фиксированное время, приколочнной частоты спринтов и тп)
- пользовательское бета-тестирование с публичной руганью недоработок
- доработки прямо на боевом сайте
- полное игнорирование seo- и “маркетинговых” подходов к структурированию контента.
Ну и так далее. Все эти ереси вместе сократили время разработки до 5 недель (с моей первоначальной пессимистичной оценки 4 месяца) и бюджет примерно раз в 10.
Мой основной принцип – надо делать так, чтобы было удобно пользователю. А как это сделано технически и организационно никого не должно волновать. Главное не пытаться спроектировать и сделать продукт сразу, а двигаться аккуратными итерациями.
После того, как проект у меня вырисовался, оставалось только решить, как делать заглавную. Ясно было, что имеющееся разбиение на группы неприемлемо наглухо – и мне пришла в голову отличная имхо по простоте мысль. Я просто съездил в Формозу и посмотрел, как организована выкладка в офлайновом магазине. И сгруппировал заглавную по аналогичным принципам.
Такие вот пирожки. Остальное – дело техники и команды отличных инженеров.
![[identity profile]](https://www.dreamwidth.org/img/silk/identity/openid.png){kind=small}
no subject
Date: 2011-12-21 01:21 am (UTC)>> 10 кликов и выборов из дропдаунов, а атрибутов может быть
>> несколько (диагональ там, цвет, то-сё)
Ну ерунду говоришь. Если есть желание и руки, то это таб, начать печатать, выбрать подходящую подсказку. Если нет ни того ни другого -- вопросы к внедренцам.
no subject
Date: 2011-12-21 01:27 am (UTC)я написал, что версия 1С -- не последняя, для реалий тех лет там нормально всё сделано.
плюс для начала опять же должен быть справочник этих категорий -- а его нет, и делать его было просто некогда да и непонятно, что именно в него выносить.
no subject
Date: 2011-12-21 01:36 am (UTC)надо как-то таги-то вносить. Кнопками быстрее чем кликами.
no subject
Date: 2011-12-21 01:43 am (UTC)то-есть, это нужно делать, но ставить в зависимость от этого запуск нового сайта -- это очень хреновая идея.
no subject
Date: 2011-12-21 07:18 am (UTC)Я не уверен, что это вообще нужно делать.
Т.е. смотри. Я ввёл в формозу "ноутбук 2GB" и нашёл много ноутбуков как с 2GB RAM, так и с 2GB видео-RAM. Единственное, чего не хватает - это чтобы я кликнул на "GT555M" и понял, что это модель видеокарты (сейчас пришлось гуглить). Но для такого сценария всё ещё не очень нужны тэги - можно просто сгенерить словарик терминов и автозаменять слова на ссылки простым full text поиском.
no subject
Date: 2011-12-21 07:20 am (UTC)Мой поинт что "это хорошо". Меня как потенциального потребителя совершенно не интересует загромождённый UI, в котором я смогу специально сказать, что 2GB это именно RAM, а не видео, или наоборот. Пусть будут в перемешку.
no subject
Date: 2011-12-21 06:56 am (UTC)no subject
Date: 2011-12-21 07:34 am (UTC)Из потребителей никому не нужны сотни сборок лаптопов, отличающихся одним гигабайтом туда или сюда. Пусть будет 10 сборок. Кому надо - будут покупать запчасти отдельно и сами собирать, это будет мизерное количество энтузиастов (может, сегодня больше, но количество постоянно уменьшается по мере того, как брендовые сборки становятся всё более предпочтительными по разным критериям - напр., поддержка, замена, лёгкость выбора, уровень тестирования, цена со скидками и пр.)
no subject
Date: 2011-12-21 07:45 am (UTC)no subject
Date: 2011-12-21 07:55 am (UTC)no subject
Date: 2011-12-21 07:39 am (UTC)no subject
Date: 2011-12-21 08:29 am (UTC)no subject
Date: 2011-12-21 09:10 am (UTC)no subject
Date: 2011-12-21 12:27 pm (UTC)no subject
Date: 2011-12-21 05:51 pm (UTC)no subject
Date: 2011-12-21 07:07 pm (UTC)это какбе говорит о том, что важность проблемы вполне понятна и пока предложено паллиативное решение.
no subject
Date: 2011-12-21 07:12 pm (UTC)no subject
Date: 2011-12-23 06:22 am (UTC)no subject
Date: 2011-12-23 08:44 am (UTC)no subject
Date: 2011-12-23 09:41 am (UTC)Как на штатном браузере, так и на жопере, через вайфай, смотрящий в интернет каналом 8 мбит, полное устаканивание разметки с появлением верхнего блока с параметрами отбора происходит через 5-10 сек. В среднем около 6. Для меня это сильно много дохуя, плюс эпилептически дёргающаяся разметка после полной загрузки странички (прогресс-бар исчез) раздражает очень сильно. Я на такие сайты стараюсь не ходить вообще.
Я понимаю, что компромисс, то-сё, но у тебя же "пользовательское бета-тестирование с публичной руганью недоработок" — пожалуйста, вот мой вклад в оное )
no subject
Date: 2011-12-23 09:44 am (UTC)no subject
Date: 2011-12-23 10:17 am (UTC)Wildfire S
Разделы — сейчас перепроверил "электронные книги", "ноутбуки".
На десктопе, кстати что-то странное в FF происходит — открываю "ноутбуки", доматываю до конца страницы, нажимаю кнопку "назад", и попадаю не в корень каталога, откуда и пришёл, а в начало страницы "ноутбуки" без её перезагрузки.
no subject
Date: 2011-12-23 11:50 am (UTC)хотя ты меня на интересную мысль натолкнул по поводу таких устройств. сделаю проверку на производительность клиента и просто не буду гасить тэги в зависимости от уже выбранных -- это самая дорогая операция.
по ФФ не смог воспроизвести.
no subject
Date: 2012-03-13 05:01 pm (UTC)Мы примерно в 20 раз ускорили отбор и перерисовку, приемлемо ли стало на андроиде?
no subject
Date: 2012-03-13 06:09 pm (UTC)no subject
Date: 2012-03-13 06:37 pm (UTC)Хистори-бэк да, сделаем. Никто не просит -- мы и не торопимся.
Я щас пост напишу, про то, как ускорение делалось. Охуеть какие чудеса в мире яваскрипта есть.