AVON, пощади! Или квест "попробуй - закажи".
Здравствуйте, уважаемые пикабушники!
Скорей всего многие из вас знают о такой компании Avon Products, которая продает косметику и другие побрякушки для женщин, мужчин, детей, рептилоидов.
Я не являюсь экспертом в области веб-дизайна, но дизайн их .ru сайта настолько плох, что мне захотелось написать о том, как обычно делается заказ на этом сайте.
Примерно так я себя чувствую, когда захожу на сайт, чтобы сделать заказ по просьбе матушки:
Ну что же? Время страданий приключений!
Как только вы решили зайти в личный кабинет представителя, выскакивает приветствующее окошко:
Там конечно еще и сумму пишут которую должен, но содержание примерно такое.
Это всплывающее окошко console.alert() совсем необязательно, т.к. в правой колонке написан ваш баланс, но ведь представитель наверное слепой, а давайте мы ему console.alert() в глаза запихнем, не умрет.
Возможные решения: сделать выделение отрицательного баланса в правой колонке или, если уж так хочется всплывающее окно, то поставить какой-нибудь jquery плагин или написать свой код с всплывающим окном, которое не блокирует всю страницу.
Ладно денег мы задолжали, приуныли и нажали ОК, окно закрылось, и тут, БАДУМ ТССС, ТЫ НЕ ПРОЙДЕШЬ.
Они хотят наши данные, и они их не получат! Сиё чудо вылазит примерно каждые 3 месяца.
Это окно - iframe занимающий половины страницы.
1) Сама информация занимает примерно 30% размера всплывающего окна. Ну это просто лютый звездец, товарищи. Помните я писал ранее про "свой код с всплывающим окном"? Забудьте.
2) Внутри находится таблица с одним столбцом и одной строкой, в которой еще одна таблица в которой.... ну вы поняли.
3) Мелкий шрифт и отсутствие отступа по всем сторонам.
4) Текстовые поля для ввода емаила и телефона сжали шакалы, поэтому длинные емаилы могут не влазить полностью.
5) Кнопки ДАЛЕЕ и ОБНОВИТЬ, которые могут запутать вас. ДАЛЕЕ просто закрывает всплывающее окно БЕЗ СОХРАНЕНИЯ, а ОБНОВИТЬ сохраняет данные и закрывает окно. Вопрос знатокам: зачем нужна кнопка ДАЛЕЕ? Правильно, чтобы у всех представителей горели жопы, когда это окно появится в следующий раз, когда вы зайдете на сайт. Ну и дизайн кнопок просто божественен.
6) ЗАКРЫТЬ, почему ты убежала из верхнего правого угла! А тебя тут заперли, ну ладно.
Приговор: сжечь это окно к чертям.
Фуф, мы смогли пробиться через два окна, какие приключения нас ждут дальше? Наводим курсор на "Мои заказы" ииии.... что-то должно было появится, но не хочет.
Просмотрев дерево html документа в браузере я пришел к выводу, что должно было появится выпадающее меню, но его нет.
Копаем дальше, залезаем в консоль, видим ошибку javascript плагина, как тебе такое Илон Маск?
Это довольно странный баг, потому что если перейти на другие страницы выпадающее меню работает нормально.
Ладно фиг с ним, жмем "Разместить заказ", попадаем на ЭТАП №1 (оформления заказа) и вводим коды товаров в таблице:
Думаете так всё просто? Нифигашеньки. После ввода кода продукта вам нужно КАЖДЫЙ #$&^ РАЗ мышкой тыкать на лупу, чтобы узнать название товара и существует он или нет, причем кнопочка с лупой пропадает после её нажатия.
Почему бы поиск товара не осуществлялся автоматически, например, после перехода на следующую строку таблицы, или когда пропадает фокус с поля "код продукта"?
Хм, а если вы нажали на лупу и такого товара нет или он не доступен? Думаете кнопочка с лупой вернется на место? ПФФ, ФИГНЯ, пишите на новой строке, зачем париться.
Ладно, с горем пополам мы ввели все товары, и ... ааа стоп, под таблицей была кнопка "ПРОСМОТРЕТЬ ОПИСАНИЕ", которая показывает сразу названия всех введенных товаров, может логичнее было написать на кнопке что-нибудь типа "Поиск товаров"?
С кем не бывает, листаем вниииииз, видим кнопочки "ОБНОВИТЬ", "ОЧИСТИТЬ" и "ПРОДОЛЖИТЬ". Помните то чудесное окно с вводом персональных данных? Тут та же история.
Налево пойдешь - коня потеряешь,
Направо пойдешь - жив будешь.
Тут уже становится не до смеха, такое чувство что тебе надо отрезать нужного цвета проводок, чтобы бомба не взорвалась.
Без паники! Сначала нужно нажать "ОБНОВИТЬ" потому, что если сначала нажмете "ПРОДОЛЖИТЬ" вас тыкнут палкой в виде console.alert() после чего вы должны догадаться, что "провод" не тот. Если вы все-таки нажмете на ОК - то придется вводить все коды товаров заново. OH MY GOD
Окей нужный "провод" мы перерезали, жмем "ПРОДОЛЖИТЬ", мы дошли до ЭТАПА №2.
Тут нам дают посмотреть электронные каталоги, ээммм... А нафига они нам если в прошлом этапе мы уже ввели коды? Может их надо было сделать ДО ввода кодов товаров? Да НЕЕ, нафига, смотри каталоги, а потом вернись на ЭТАП №1 и введи то, что еще нашел. Зашибись.
Фиг с ними, с каталогами, жмем "ПРОДОЛЖИТЬ", попадаем на ЭТАП №3. ОХ ё мае, распродажа!
Некоторые товары опускаются на вторую строку, так что ни цены посмотреть, ни заказать его у вас не выйдет, посмотрите на него и валите отсюда продолжайте заказ! А что если нажать ссылку "Подробнее"? Думаете покажут полное описание товара, картинку товара в полном размере? Да НЕЕЕ, прочитай еще раз, и закрой всплывающее окно.
Листаем вниз а там опять кнопочки и ничего не предвещало беды... как вдруг...
Но мы уже опытные саперы, и так же как и в конце ЭТАПА №1, нам предстоит перерезать нужный "проводок".
После того, как заказали побрякушек, переходим на Финальный этап - ЭТАП №4
На этом этапе, слава богу, все довольно просто, можно выдохнуть, выбираешь нужное отделение почты россии / постамат и т.д., вводишь количество клиентов и жмешь "ПРОДОЛЖИТЬ", проверяешь все товары и скидки и жмешь "ОТПРАВИТЬ". Вы великолепны!
Всем спасибо!
P.S. Да знаю, есть приложение AVON`a для Android и там гораздо легче заказывать, но оно сейчас тоже в состоянии "зародыша" - постоянно вылетают ошибки и нельзя указать другие способы доставки кроме "почты россии".