Разбор полетов

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

тем не менее пришло время написать его.



Разбор полетов набора в команду:

http://techdesigner.ru/blogs/post-7867/




Александр

1. И, пожалуй, самое главное - нет цены.

2. Даже если все списать на то что этот сайт торгует исключительно iRobot'ами, то как минимум не хватает пункта меню "Расходники" или "Аксессуары".

3. Немного гуляет сетка

4. Малоинформативная страница не раскрывает полностью тему пылесоса.

5. Нельзя вернуться назад...



Что хорошо:

1. Видно что в корзине

2. Можно переключиться на "соседние" модели (жаль что нельзя вовсе по всей линейке перелючаться)



В целом чистенько и аккуратно.

3/5




Алексей

1. Сетки нет

2. Есть ощущение что занятие бросили через полчаса работы - нет половины сайта, нужных элементов...

3. Отстутсвует каталог товаров (всегда доступный без дополнительного клика)

...

По большому счету тут и так все видно =)

Общая неопрятность, непродуманность и недоделанность.

1/5




Вик

Что хорошо:

1. Есть каталог (плохо что он с выпадающей менюшкой)

2. Предусмотрены комментарии

3. Учтена "доступность"



Что плохо:

1. В корзине в лучшем случае видно сколько товаров, но не на какую сумму

2. Как уже говорил, выпадающие меню

3. Неинтересная сетка, неудобно читать (удобно читать колонки и не столь большой текст)

4. Нет кнопки поиска

5. Нет таких важных моментов как "Доставка", "Оплата"...



3/5




Евгений

Один из лучших конкурсантов.

Возможно, если бы он чуть улучшил пару моментов и изобразил конкретно страничку магазина, а не только карточку товаров - мы бы взяли именно его.

Что хорошо:

1. есть цена, заметно "Купить", есть доступность...

2. Сказано про доставку и гарантию!

3. Описание, хар-ка, комплектация... все есть (только интересно как большая комплектация или хар-ка там поместится)

4. Можно поделиться и оставить отзыв...



Что плохо:

1. Сетка загуляла у доставки и гарантии

2. "Посмотреть фото и видео" - почему нельзя их глянуть сразу если тут и так много фото?



4/5




Николай

Что хорошо:

1. Есть поиск, можно посмотреть все товары одним списком...

2. Есть телефон

3. Есть каталог!

4. Есть хлебные крошки!

5. Есть хар-ка, которая интересует людей больше, чем описание.

6. Можно засунуть в закадки, сравнить...

7. Заметная цена, доступность и большая кнопка "В корзину"

8. В корзине сазу видно сколько товаров и на какую сумму

9. Комплектация, отзывы...

10. Сопутствующие товары!



Что плохо:

1. Есть неудачные места. Например, колонку "В закладки", "Сравниваем" и т.п. можно было бы вынести в другое место - расширились бы хар-ки, а эти элементы стали бы лучше смотреться.

2. Только одно фото и нет видео...

3. Мелкие косяки (типа прибитой стрелочки вправо у комплектации, корявый футер и т.п.)

4. Нет ответов на самый частозадаваемые вопросы посетителя интернет-магазина: Доставка и оплата.



5/5



Итого на работу принят Николай!

Поздравляем его ;)


(Кстати говоря уже работает над тремя проектами и получил оплату по одному из них)








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

1. Вынес важные вопросы наверх, каталог налево

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

3. Отдельно оставил правую колонку для корзины, цены, покупки, шаринга, сравнения... По задумке эта колонка всегда остается на виду (читай, fixed) - сколько не крути бегунок - "Купить пылесос" всегда навиду ;)

4. Никто не любят читать много или разбираться в чем-то, понимать 60Дб это много или мало и разбираться в схеме работы каждого пылесоса... Поэтому самые важные моменты я вынес инфографикой (КСТАТИ, это лучший пылесос для владельцев животных... ниодин конкурсант этого не указал)

5. Тут же при желании люди могут почитать или посмотреть все хар-ки развернув их...

6. А слева мы предлагаем сразу посмотреть пылесос в действии...

7. показываем комплектацию....

8. Отзывы...

9. Предлагаем кредит и доставку (само собой, если у магазина есть опция при заказе от, скажем, 20 000 рублей доставка в пределах МКАД бесплатно)...

10. А так же предлагаем сразу приобрести бонусные товары.

11. Ну а в футере еще пишем что мы принимаем кучу всего к оплате и т.п.



Из плохого:

1. Страница персонализирована и придется под каждый пылесос прорабатывать страничку. Впрочем я только за такой подход!

2. Некоторые говорят что их раздражает когда они крутят бегунок а какой-то элемент остается на одном и том же месте - наверное им это не понравится.

3. Нет большого количества фотографий, ракурсов и т.п. (но добавить не проблема, на самом деле) =)

И я думаю можно найти много всего, но для этого мне самому нужно посидеть над этим.... при желании вы сами можете дополнить список ;)

А я могу лишь еще дополнить, что меня не взяли на эту вакансию, а значит либо они хотели еще лучше (а я уверен - можно еще в разы лучше.... дополняйте список моих косяков или пишите советы! всем пригодится), либо же они не спроста уже почти год ищут веб-дизайнера (в чем я, вообщем-то, сомневаюсь). А я тем временем очень рад, что меня туда не взяли - мне нравится где я сейчас.... и рядом с домом =)



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








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

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



Я думаю никто не будет против если профессионалы своего дела дополнят мой разбор полетов, а так же лично я не буду против (а только за), если вы покритикуете конкретно мою работу ;)



Всем спасибо за внимание!



P.S.

Прошу прощения если где-то опечатки, что-то неграмотно написал или что-то упустил из виду - писал в спешке.

А так же подозреваю что мог разместить пост не в тот раздел, тогда прошу модеров сильно не сердиться, а просто перенести пост куда нужно ;)








Конкурсантам по e-mail я отвечал и рекомендовал литературу.

Не думаю что я кого-то удивлю, но рекомендую Купера и Раскина.

А так же коротенькую книжечку, которая помогает думать (и советую её пролистывать каждый раз перед проектированием интерфейса):

http://uibook2.usethics.ru/

Комментарии пользователей

brusher

Прежде чем это случится сразу скажу: Этот пост в первую очередь для конкурсантов, для тех кто хотел увидеть разбор полетов и для всех интересующихся. Я уверен мы все будем рады дополнительной объективной критике. Но прошу сразу всех троллей, лентяев и просто любителей развести флуд не по теме вовсе не писать сюда!

rse32

По вашему макету. В селекте написано "тип напотльного покрытия", значит должно быть где-то указано какой тип в данном пылесосе. В самом низу "В дополнение вы можете...", почему чекбоксы? Вот выбрал я чекбокс, что дальше, как оформить? А если эти жетлые плашки- кнопки, то зачем чекбоксы? На кнопке "Купить пылесос", пунктирное подчеркивание неуместно, имхо, и так видно что это кнопка. Я бы вообще заменил надпись на "КУПИТЬ", такие вещи должны быть поярче... Там где "Комплектация", стрелочка вниз, это что? свернуть блок этот можно? прикольно, а почему другие блоки нельзя тогда?..

brusher

По вашему макету. В селекте написано "тип напотльного покрытия", значит должно быть где-то указано какой тип в данном пылесосе.
это указано в инфографике ("Отлично чистит гладкие поверхности и ковры с ворсом до 25мм"), просто не вынесено в какой-то отдельный блок =) В остальном "В дополнение вы можете" - действительно косяк. Подозреваю что думал о том, чтобы ставить галочку и жмакать на "Купить пылесос" - но в наше то время можно просто асинхронно класть в корзину. Огромное спасибо! =) Что же касается кнопки "купить" дело в том что без подчеркивания будет не ясно при клике ты попадешь в корзину или останешься здесь, а подчеркнутые пунктиром ссылки обычно символизируют о какой-то динамике (JS), а не о переходе по ссылке. Соответственно таким образом убираем неоднозначность =) Спасибо за дельную критику! =) m0rte, действительно жаль, но увы сейчас уже есть дизайнер, а проектов не так много, чтобы искать еще одного. Надеюсь в недалеком будущем конечно у нас увеличится поток и тогда будем искать еще одного человека в команду, и я буду иметь вас ввиду (но так или иначе, думаю что отбирать человека в команду буду опять таки по тестовому заданию). Кстати, как видите как многим показалось, высокий уровень работ не требовался, а тех. задание было не чтобы нанять супер-гуру, а чтобы нанять думающего дизайнера, который прежде чем сядет рисовать изучит тему, продумает интерфейс с разных сторон, продумает что необходимо, какие фичи можно сделать и т.п. =) Это ни в коем случае не в обиду конкурсантов. Если уж это и камень в чей-то огород, то скорее камень в сторону тех, кто в посте с тестовым заданием разрывался про тестовое задание и низкий бюджет... не вчитываясь в детали и думая что я хочу дешево и супер-клево =)

Goodman

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

Arsi

Одно и тоже, везде, повсюду. Веб 2 приросло как банный лист к одному месту, везде. Все копируют всех. Обсуждать то в целом и нечего. Верстка есть, дизайна - нет. Молодые зажались в рамкам повседневных стандартов - подчеркнутые ссылки, распределенные блоки, узнаваемый wireframe. Старики строчат под копирку что жрет заказчик чтобы не потрерять места. Русский дизайн стал узнаваем до боли в худшую сторону - огромные номера телефонов в хедере, идентичная структура блоков, зациклинность на отрисовке одной хрени и забивания болта на всю концепцию. Зачем заставлять себя подражать если , наверняка в головах есть зачотные идеи сделать по-свойму? Потенциал есть а ведетесь как доктор прописал. http://www.thefwa.com в помощь для оценки как воплощается дизайн, не скованный рамками по мышлению. Наболело просто ребят, смотря работы.

Zhenchur

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

brusher

Arsi, во-первых, так или иначе интерфейс должен быть удобным, понятным и легка выполнять стоящие перед пользователем цели (желательно, в один клик и чтобы ему не пришлось ничего читать). А во-вторых, как сказал котофей... Обычно стараюсь сначала предоставить заказчику действительно новый необычный подход (одновременно с этим обязательно выполняющий цели пользователей и не вводящий их в ступор), но зачастую бракуется. Аргументы разные, начиная с простого "я хочу!" и заканчивая "мои инвесторы не оценят" (или "они хотят чтобы было как тут"). И даже при таком развитии событий всегда идут долгие споры и обсуждения, всегда стараюсь убедить заказчика и по кусочкам выигрываю (или, бывает, проигрываю) какие-то элементы сайта. За последние полгода был, кажется, только один проект, над элементами или концепцией которого я не спорил (и то это проект клиента, с которым мы уже работали. И клиент просто по итогам первой работы был так удовлетворен что сказал "нужен редизайн, я вам доверяю - делайте чтобы было клево". Конечно, были утверждения, правки, но по мелочам, которые действительно были делом вкуса, а не мешали взаимодействию с пользователем (как это чаще всего и бывает). Сейчас этот проект еще находится в стадии работы, когда его запустим - покажу ;)

grawest

arsi на FWA 80% сайтов с е#учим флэшем, который я считаю издевательством над пользователем. Да, красиво. Да, прикольно. Но на такие сайты я зайду один раз, чтобы просто посмотреть и забыть как страшный сон. взять только сайт дня http://www.thefwa.com/site... ВОТ НАХРЕНА мне нужно выяснять откуда идет музыка (потому что я промотал вниз, а видео с ролика только подгрузилось), тратить своё внимание на то что бы вырубить его НАХ#Й!? Бесит... Так что FWA не очень хороший пример. также наболело...

Mysorshik

arsi на FWA 80% сайтов с е#учим флэшем, который я считаю издевательством над пользователем. Да, красиво. Да, прикольно. Но на такие сайты я зайду один раз, чтобы просто посмотреть и забыть как страшный сон. взять только сайт дня http://www.thefwa.com/site... ВОТ НАХРЕНА мне нужно выяснять откуда идет музыка (потому что я промотал вниз, а видео с ролика только подгрузилось), тратить своё внимание на то что бы вырубить его НАХ#Й!? Бесит... Так что FWA не очень хороший пример. также наболело...
Пользоваться этим сайтом не пробовали? Там есть категории... флеш, без флеша, приложения и т. д.

spdif

«артели Васисуалия Уткина» Это же какое ЧСВ надо иметь, чтобы себя так называть?!

brusher

spdif, это уже не ко мне вопрос =) Легенду про Васисуалия можно прочитать у них на сайте ;) p.s. Что-то не пойму как ЧСВ расшифровать =)

4EPIK

Чувство Собственной Важности )))

VladimirYalenko

лажа во всех работах. в магазине цена должна быть всегда в поле 700 px -- из всех ребят, справились (с низу) 1-й проджект +3-й снизу -- остальные допустили максимально возможное кол-во ошибок. чтож это будет если у меня нетбук -- я скролить искать цену не буду(((

VladimirYalenko

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

Теперь же я покажу как я сам выполнял это же тестовое задание (обращаю внимание во избежание конфликтов и несуразиц, что это тестовое задание я взял из вакансии артели Васисуалия Уткина а должность "Веб-дизайнер", т.к. сам его выполнял. Я об этом в посте уже говорил, поэтому и копирайт соответствующий):
-- а вот это решение жесть! Коментарии стоят выше чем стоимость((( Что-то в проектирование витрин да и мультивитрин, видать Вы не очень fadac11824537cde3adaccc4cec17c6b.jpeg вот как должно быть. см. атач

000
000

http://www.thefwa.com/site - на большом широкоформатнике очень круто, на обычном монике конвульсии какие-то.

Arsi

Я думаю, тут дело в большей части в заказчиках, они привыкли видеть шаблонный сайт, который, как им кажется, "продает" лучше. (я не беру ту маленькую часть, все же ищущих уникал. В основном это гиганты или крупные корпорации, которые не очень уж стремятся работать с фрилансерами, в силу русского менталитета). По этому рядовым дизайнерам, у которых отличная голова, руки из нужного места и отличные идеи, приходится выкручиваться, жить то нужно на что то в конце концов. Тем более после случаев отвержения этих классных вариантов заказчиком и не один раз, по причине не адекватности и не компетентности оного, уже и не хочется ничего делать. Вывод, талантливых людей много, но все понимают и ценят их творчество.
Естественно, чтобы заработать авторитет работодателей приходится лепить унылое .... и одновременно пихая своё но получше, на заказ, пока не наступит то время когда к вашим идеям люди начнут прислушиваться, понимая что вы несете выигрышный вариант. Но насколько я понял по топику, ТЗ было свободного полёта а ребята автоматом начертали по шаблону исходя их личного опыта и примеров из сети, не добавя ничего своего нового, свежего, интересного. Собственно, в этом и косяк - вариант проявить себя был но никто не решился его осуществить.
Arsi, во-первых, так или иначе интерфейс должен быть удобным, понятным и легка выполнять стоящие перед пользователем цели (желательно, в один клик и чтобы ему не пришлось ничего читать). А во-вторых, как сказал котофей... Обычно стараюсь сначала предоставить заказчику действительно новый необычный подход (одновременно с этим обязательно выполняющий цели пользователей и не вводящий их в ступор), но зачастую бракуется. Аргументы разные, начиная с простого "я хочу!" и заканчивая "мои инвесторы не оценят" (или "они хотят чтобы было как тут"). И даже при таком развитии событий всегда идут долгие споры и обсуждения, всегда стараюсь убедить заказчика и по кусочкам выигрываю (или, бывает, проигрываю) какие-то элементы сайта. За последние полгода был, кажется, только один проект, над элементами или концепцией которого я не спорил (и то это проект клиента, с которым мы уже работали. И клиент просто по итогам первой работы был так удовлетворен что сказал "нужен редизайн, я вам доверяю - делайте чтобы было клево". Конечно, были утверждения, правки, но по мелочам, которые действительно были делом вкуса, а не мешали взаимодействию с пользователем (как это чаще всего и бывает). Сейчас этот проект еще находится в стадии работы, когда его запустим - покажу ;)
Да, к сожалению, большиство интересных мокапов не реализуется, даже в больших фирмах с хорошим бюджетом, это бич от снобистых кураторов проектов не только в России. Там, насколько я понял, с этим делом гораздо легче - "я так хочу" и разговор закончен, за бугром же под идентичное решение еще и подсовывают объяснительный базиз, который, по сути, сводится к русскому варианту но прикрывается "весомостью" Иьелских и Кембрджско- Оксвордских дипломов вице-шефов отделов и манагеров среднего и высшего звена на побегушках, с коими вести дисскусию неоправдано по потере времени. Едиственный вариант поставить точку над своим "i" - просунуть полностью свой композ под нежданный dead-line, который будет успешен и без корректировок любящих сувать нос куда не стоит, и в будующем варианте занять жестко свою позицию по негласной теме - будем продолжать работать по течению прошлого успеха. Тем не менее, есть клиенты, заказы, давление клиента, а есть варианты для себя (когда остается время) где можно проявлять и реализовывать свои задумки, новые подходы, смелые, пусть неотесанные но оригинальные и цепляющие. В представленных по сабжу топике, я таких, к сожалению, не увидел.

brusher

VladimirYalenko, про цену ниже чем отзывы - это вы про мою работу? Если да, то хочу прояснить один момент: цена, "Купить" и все такое прочее, вплоть до социальных сервисов помещается на один экран, если у вас разрешение не ниже чем 1024х768 на нетбуке ;) Конечно, возможен вариант, что у вас internet explorer 6, да еще и с кучей тулбаров и вы видите узкую полосочку - тут уж ничего не поделать — придется поскроллить (или для таких случаев проектировать реагирующий дизайн, впрочем в паре последних проектов пытаюсь внедрить это новшество - надеюсь, верстальщик не подведет).

VladimirYalenko

VladimirYalenko, про цену ниже чем отзывы - это вы про мою работу? Если да, то хочу прояснить один момент: цена, "Купить" и все такое прочее, вплоть до социальных сервисов помещается на один экран, если у вас разрешение не ниже чем 1024х768 на нетбуке ;) Конечно, возможен вариант, что у вас internet explorer 6, да еще и с кучей тулбаров и вы видите узкую полосочку - тут уж ничего не поделать — придется поскроллить (или для таких случаев проектировать реагирующий дизайн, впрочем в паре последних проектов пытаюсь внедрить это новшество - надеюсь, верстальщик не подведет).
мы говорим об одном и том же только на разном языке. рассудить может только конверсия магазина и "собранная аналитика". готов поспорить на публичное повествование, что конверсия с Вашим решением ниже, чем решение в разработанном мной магазе. хотя если сам заказчик настаивает, то против баранов не попреш(

skonik

что конверсия с Вашим решением ниже, чем решение в разработанном мной магазе.
согласен, что реальные результаты может показать только собранная аналитика, но не согласен, что у вас конверсия будет выше. У вас не карточка товара, а мешанина какая-то. Для кого вы писали технические характеристики? Это просто неуважение к человеку писать таким образом технические характеристики, хоть бы интерлиньяж побольше сделали чтоли. К чему восклицательный знак после слова "Купить"? Нервы?
вот как должно быть. см. атач
Это исключительно ваше мнение и ваше право сделать таким образом. Ни один нормальный и адекватный автор разработанных интерфейсов не стал до сих пор убеждать людей в правильности одного решения. Вы можете говорить о правильности подхода, последовательности разработки, но говорить о правильности решения во всех ипостасях вы не имеете права, будь вы хоть трижды Купер и Раскин вместе взятые. Каждое решение имеет право на жизнь только исключительно в рамках его целевой аудитории, в рамках восприятия людей, которые будут этим решением пользоваться. Скажите для кого вы делали это решение, назовите конкретно пользователей, для которых создавался ваш интерфейс, и тогда уже аргументируйте свое решение, как правильное, для данной аудитории. Решение brusher, вполне возможно применяется к совершенно другой аудитории, и разрабатывалось с учетом опыта совершенно иных людей, для которых отзывы гораздо важнее цены. И неужели, блин, вы думаете, что аудитория покупающая пылесос за полторашку гривен, будет той же, что покупает пылесос за штуку баксов? Так что, прежде чем разводить демагогию и предлагать свои решения как единственно верные, ознакомьтесь прежде с тем что, как и для кого делалось.

brusher

Ребят, спокуха =) Что касается "важнее" и т.п. - по большому счету я считаю что важные элементы просто должны помещаться на первую страницу и в данном случае по ним человек уже должен составить какую-то оценку товара. А что сделать выше - цену или отзывы, я думаю не столь важно, если и то и другое поместилось на первый экран и прекрасно видно. Более того, я расположил конкретно так, чтобы если человек будет смотреть не "сканируя" (как чаще всего и делают, и именно поэтому не важно ниже или выше цена, ведь глаз ухватится за крупные цифры и яркую кнопку, а не за мелкую ссылку), а последовательно читая, то он мог сразу сравнить товар (если ему уже есть с чем сравнивать) или почитать отзывы, прежде чем видеть цену и принимать решение о покупке. В частности могу добавить к минусам своего решения: на первый экран не влазит столь полезная для принятия решения инфографика... Если же для человека этого не достаточно, то он может крутить ниже и узнавать больше и больше информации о товаре, которая в итоге поможет ему определиться. Кстати, мой макет магазина предусматривает, что на нем может продавать и пылесос за 1000 рублей. А про конвертацию действительно спорно. По-моему конвертация больше там где удобно и приятно, а не там где крупнее и выше цена ;) Про удобство skonik уже аргументировал, поэтому не буду высказываться. Впрочем так или иначе это все моё имхо, и я предлагаю не устраивать здесь холиваров ;)