Вітання. Прохання до дизайнерів спільноти дати оцінку поточному UI/UX дизайну сторінки категорії інтернет-магазину. Що можна змінити для покращення взаємодії з користувачем?
Gemini радить наступні кроки:
- Замінити характеристики іконками
- Додати акцентний колір для кнопки "До кошика"
- Заокруглені краї для стікерів
- Збільшити простір між картками товарів
Можливо хтось має додаткові поради, враховуючи власний професійний досвід?
Текст інформативніше за графіку — це з книг тому джеміні це упустив при навчанні. Нормально написані характеристики.
Акцентний колір для акценту, давайте зробимо акцент на всьому?
В наявності - не побачать, зелене на сірому?
Коментарі вони треба? Рейтинг ну може і треба.
Підкреслення назви? Може крупніше? Хто це читатиме електрик?
Кількість, якщо це купують пачками то треба але висота має бути як кнопка мабуть.
Це не модний бутік, дивіться на контраст. Питайте себе: Хто і де дивитися на цей сайт? Я відкрив на мобільці і все зміг, мені все зрозуміло. Покращити можна і треба але вже не погано.
Бачив це 👇
https://preview.redd.it/x6xt55h68qcg1.png?width=1220&format=png&auto=webp&s=1f904b43d979191f348e564aed6cb64e47220dd2
Підписуюся під кожним словом. Як профільний спеціаліст схожої категорії товарів - селектор кількості взагалі зайвий, це не магазин продуктів харчування. Можна залишити на самій сторінці товару і звичайно в корзині.
Додатково можна додати: - Поле пошуку у фільтрах - Підказки (tooltips) для технічних термінів - Можливість швидкого перегляду товару - Як варіант реалізувати майстер підбору стабілізатора, що допоможе користувачам підібрати пристрій під їхні потреби
1 Ліва колонка з фільтрами занадто широка. Можна зменшити на третину. 2 Відокремити товари по горизонталі, бо не зрозуміло до якого товару відноситься ціна. 3 Кнопку "Звязку" перекинь на праву сторону. 4 Якось невдало при наведенні на товар унизу випадає вибір кількості товару, перекриваючи собою інші елементи.
Не дизайнер. Проігнорую купу дрібних візуальних багів, бо не думаю, що багато уваги приділялось планшету.
Погоджусь з AI щодо акцентного кольору кнопки. Звісно її не треба робити, як кнопку видалити з кошика, бо та просто очі ріже.
Погоджусь з AI щодо відступів між картками. Але думаю, що більшою проблемою є вибір кількості на карточці, бо він відірваний від ціни і кнопки додати до кошика.
Додаткові іконки - не завжди хороша ідея. Наприклад, я зразу зрозумів, що сердечко на карточці - це додати в обрані, а не вподобайка. Я не зрозумів що означає наступна іконка, поки не натиснув її і отримав російський переклад додати в порівняння. Можливо терези для мене спрацювали краще.
Ну, а заокругили все - це просто зараз в тренді, так само, як пару років тому було в тренді все робити квадратним.
З критичного, що бачу - «До кошика» на сторінці товару та де список товарів краще зробити помаранчевим кольором, який у вас як акцентний. Зараз сіра кнопка (ще і різних відтінків на сторінці товару та у списку) виглядає ніби товару немає в наявності і треба придивлятися, що товар все ж таки є. Характеристики тільки іконками точно робити не слід. Якщо дуже хочеться, можна додати іконки до тексту, але точно не заміняти текст іконками.
Як ідея, прибрати чіп наявності і використовувати кнопку "до кошика" як індикатор наявності.
Ага, не погана ідея!
ОП, уточни яку версію оцінювати: десктоп чи мобільну?
Мобільна версія сайту в пріорітеті
Не дизайнер, але розробник. Можна змінити назви деяких кнопок. Наприклад зачинити -> закрити, відгуків -> відгуки
Дивився на сайт через телефон. Логіка кнопки додавання в порівняння доволі дивна. По перше, сам текст при додаванні: "Ви добавили", хоч це і правильно із граматичної точки зору, але більш вживаним є варіант "додали". По друге, я можу на кнопку додавання в порівняння, і в закладки натиснути безкінечну кількість разів, типу я натиснув 1 раз - додався окей, але на 2 раз коли я натискаю я б очікував що він прибереться із закладок а не просто ще раз у мене в ведеться повідомлення що я типу ще раз його додав, ну і так само зберігати на самому товарі підсвічним кнопку закладки і порівняння поки вони досі там знаходяться, а не коли я натиснув на інший товар додати в закладки чи до порівняння. Сподіваюсь зрозуміло пояснив
https://preview.redd.it/x6ibxkkuaqcg1.jpeg?width=1080&format=pjpg&auto=webp&s=ab2fb7827d2f886b6ee7267f002da2420d62fd0b
Погоджуюсь зі sleepy-avocado
Сильно кидається в очі те, що сірі кнопки кошиків, бо вони здаються неактивними доки не побачиш ховер у десктопній версії (а в мобільній версії ще складніше зорієнтуватися) а також неспівпадіння кольорів цієї кнопки на загальній сторінці та у картці товару.
Подобається як одразу виділяється Безкоштовна доставка, це плюс.
московська мова в львівському магазині? Серйозно?
Окрім інших коментарів. Як для каталогу товарів: - не вистачає кнопки "показати 10/25/50 на сторінці" - кнопки сторінок внизу - забагато, в вас є категорії по 15 сторінок і цей елемент ту мач якщо показувати усі номери. Тим паче кнопки "наступна" і "в кінець" вже є. - після натискання "показати ще" - треба підсвітити номери сторінок з яких бачимо контент, а в вас підсвічує останню підвантажену. - Фільтри: потужність, напруги, точність - краще слайдером як і ціна, або декілька груп діапазонів. І краще деякі с фільтрів не ховати за "ширмою" назви фільтра: ті що можуть стати слайдером і 100% що ціна.
Є така гарна книга "Refactoring UI" від авторів Тейлвінду
Дуже раджу полистати її (на торентах знайти можна повний варіант), та подивитися приклади
UI мені не подобається, щось не так з типографікою... та і все нудне якесь
але не думайте що це негатив - сам сайт (UX) супер, все працює, як озер очікує, стандартно. це непогано з т. зору бізнесу. стільки програмування вкладено 👍. а UI то другорядне