Подскажите как улучшить карточку товара ИМ

Тема в разделе "Креативные дела", создана пользователем sonicm, 31 июл 2013.

Модераторы: zek24
  1. sonicm

    sonicm

    Регистр.:
    15 май 2009
    Сообщения:
    182
    Симпатии:
    81
    Подскажите пожалуйста, что можно улучшить в юзабилити карточки товара. Возьмем для примера произвольную карточку нашего магазина, скажем эту (вы можете выбрать другую)



    В первую очередь интересуют вопросы:
    1) Мешают ли кнопки социальных сетей, стоит ли их опустить куда-нибудь по ниже?
    2) Должны ли быть вместе (рядышком) цена на товар и кнопка В КОРЗИНУ?
    3) Хорошо ли видны (и удобны к использованию) вкладки с описанием/ характеристиками / отзывами к товару?
    4) Заметна ли кнопка "Показать все расцветки"?

    Так же приветствуются любые другие ваши комментарии и рекомендации по улучшению юзабилити карточки товара данного магазина.
    Бужу очень признателен за ваши отзывы!
     
  2. Arcvi

    Arcvi Постоялец

    Регистр.:
    10 май 2013
    Сообщения:
    74
    Симпатии:
    32
    Я бы сделал так
    [​IMG]
     
    sonicm и shuran нравится это.
  3. sonicm

    sonicm

    Регистр.:
    15 май 2009
    Сообщения:
    182
    Симпатии:
    81
    Про расположение блоков вашу идею понял. А что вы думаете по вопросам 3 и 4?
     
  4. shuran

    shuran

    Регистр.:
    4 июн 2010
    Сообщения:
    237
    Симпатии:
    70
    Согласен что кнопку лучше перенести ближе к цене. Понимаю что сайт использует приглушенные тона, но может быть основную кнопку сделать чуть ярче?
    "Показать все расцветки" - замечаешь не сразу, сначала прокрутил все расцветки и только потом ее заметил, когда стал икать подробное описание. Имеет смысл сделать ее просто кнопкой и поместить правее.
    ОПИСАНИЕ-ХАРАКТЕРИСТИКИ_ОТЗЫВЫ - этот блок (заголовки) не растягивать на 100% а сделать уже, так будет более понятно что это закладки.

    Кстати получается добавить товар в корзину не выбрав цвет - нужно поправить.

    И чисто мое субъективное мнение - очень частое использование градиентов в серых тонах - все сливается.
     
    sonicm и Arcvi нравится это.
  5. Arcvi

    Arcvi Постоялец

    Регистр.:
    10 май 2013
    Сообщения:
    74
    Симпатии:
    32
    про "показать все расцветки" я бы перенес её наверх, чтобы не снизу было, при раскрытии списка приходиться листать вниз чтобы закрыть, а так при раскрытии если она будет наверху то она останется под мышкой. да и когда она наверху так привычнее вроде, возможно субъективное мнение.
    Стоило бы прописать этим кнопкам, включая "описание, характеристики, отзывы" font-weight: bold; . Сделать жирным
     
    sonicm нравится это.
  6. sonicm

    sonicm

    Регистр.:
    15 май 2009
    Сообщения:
    182
    Симпатии:
    81
    Хорошее предложение - подумаем над этим!

    На сколько уже? 80% от доступной ширины или сколько?
    Сейчас сложно понять, что это закладки?

    Согласен. Контраста не хватает.

    Есть товары у которых 80 и более фото - в этом случае вам все равно придется пролистывать сайт и кнопка уйдет с экрана.

    Будет слаться с заголовками таблицы в характеристиках. Там и так уже bold. Мне кажется не стоит так делать.

    На основе ваших рекомендация собрал новый прототип. Посмотрите. Что скажете?
    CapturFiles_6.png
     
  7. shuran

    shuran

    Регистр.:
    4 июн 2010
    Сообщения:
    237
    Симпатии:
    70
    Очень радикальное решение, не пугает что под это придется весь дизайн переделать? В целом пока конечно смотрится сыровато, но если по сути:

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

    Не нравится комбинация справа от картинки (выбор параметров + купить + цены) - надо думать над этим блоком. Кстати Arcvi вполне приемлемый вариант предлагал. Я когда не знаю как сделать, лезу в интернет-магазины раскрученные, при чем предпочитаю отечественные, и смотрю как народ там делает, они как правило достаточно много могут себе позволить все интерфейсы тестировать и вылизывать - можно много чего подцепить интересного!

    Вот несколько стоящих
    http://www.korablik.ru/product/28343
    http://euroset.ru/catalog/phones/mobile/lg/-/lg-l7-ii-dual-black/
    http://positronica.ru/photo-camera/canon-eos-1100d-608981/
    http://www.220-volt.ru/catalog-59206/ - этот вариант считаю ооооочень хорошим, поменять местами характеристики и блок заказа и просто конфетка!
     
    Arcvi и sonicm нравится это.
  8. cesah

    cesah Постоялец

    Регистр.:
    5 окт 2011
    Сообщения:
    61
    Симпатии:
    6
    Сайт смотрится хорошо, но кнопка "положить в корзину" должна быть ближе к цене, а не в правой части экрана, куда не каждый пользователь взглядом дойдет.
    Вот статья с полезными советами, может чего интересного найдете:
     
    donvictorio и sonicm нравится это.
  9. sonicm

    sonicm

    Регистр.:
    15 май 2009
    Сообщения:
    182
    Симпатии:
    81
    Ну это же не дизайн я прикрепил, а прототип из omni graffle, т.е. дизайн менять конечно не будем - только расположение блоков. Возможно будут введены новые блоки (типа ПОДАРКИ и тп).
    полностью с вами согласен. Этот блок (справа) нужно еще дорабатывать.

    shuran, отдельное спасибо вам за ссылки на магазины.
    Весьма неплохой вариант, все кучно и влазит в 1 экран. У нас слишком много характеристик - так сгрупировать не выйде.

    cesah, если в обратили внимание на новый прототип станицы, то из него видно, что этот момент уже учтен.
    Кстати, я думал над этим вопросом. Дело в том что не все магазины ставят цену и кнопку рядом. К примеру amazon так не делает... http://www.amazon.com/Haba-1008035-Moover-Doll-Pram/dp/B001EHJSWE/ref=pd_sim_sbs_t_4 Но пока что я склоняюсь к варианту, поставить их рядом.
     
  10. sonicm

    sonicm

    Регистр.:
    15 май 2009
    Сообщения:
    182
    Симпатии:
    81
    Коллеги! Родил новую версию прототипа страницы. Какие будут комментарии?
    ui-babyshop.png
     
    Arcvi нравится это.