Дизайн
Kate Buke
1853

5 Крутых фич для fashion e-commerce

Кейс создания эффективного е-commerce проекта Siaspace для мультибрендового магазина дизайнерской одежды.

В закладки

Siaspace — это e-commerce проект, объединивший независимых дизайнеров нишевой одежды под одной крышей. Это бренд, созданный прекрасными людьми для прекрасных людей, которые каждый день в поиске необычного проявления себя.

«Мы поняли, что мода как неотъемлемая часть человека 21-го века, нуждается в инновациях не меньше остальных индустрий. И решили, что наш бренд должен иметь лучший е-коммерс в Украине. Мы ценим наших клиентов, их время и комфорт»

Siaspace

01. Главная цель

Главная цель — улучшить визуальную часть сайта и легкость взаимодействия с окружающим миром.

Главный слайдер с зацикленными фото и видео сразу цепко держит внимание пользователя. "Рваная" сетка расположения элементов слайдера дает ощущение легкости, не давит на пользователя. Также есть возможность добавления тегов на фото, чтобы покупатель сразу мог узнать стоимость и перейти к просмотру понравившейся вещи.

02. Корзина

Мы сделали удобные меню и корзину, которые всегда под рукой.

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

При добавлении вещи в корзину пользователю предоставляются подсказки о выборе цвета и размера. Также реализована функция видео-демонстрация правильного проведения замеров основных параметров тела.

03. Фильтры

Опираясь на лучшие мировые бренды в мире моды мы выбрали наиболее подходящие значения для фильтрации для данного проекта.

Цветовой фильтр уникальный в своем роде и дает пользователю представление о полной палитре оттенков. Также Вы можете комбинировать цвета, чтобы получить наилучший результат.

04. Галерея

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

Наше решение для галереи товара помогает рассказать уникальную историю каждой вещи и превращает поверхностный просмотр в увлекательный процесс.

05. Мобильная версия

Большая часть целевой аудитории бренда при посещении сайта и совершении покупок использует мобильные устройства.

Поэтому мы уделили качеству и удобству мобильной версии сайта не меньшее внимание по сравнению с десктопной. Плюс высокая скорость загрузки контента делает пользование продуктом особо приятным.

«Ребята из Facility не просто создали красивый и удобный сайт, который увеличил интерес наших и потенциальных клиентов к нашему бренду, но и помогли наладить многие процессы, связанные например с digital продвижением, тем самым увеличив эффективность нашего бизнеса. Мы очень ценим такой комплексный подход».

Siaspace

Мы будем очень благодарны, если Вы посетите кейс Siaspace на Behance и оцените его!

Это вдохновляет нашу команду создавать для Вас больше красивых вещей и замечательных проектов 🙌.

Материал опубликован пользователем.
Нажмите кнопку «Написать», чтобы поделиться мнением или рассказать о своём проекте.

Написать
{ "author_name": "Kate Buke", "author_type": "self", "tags": [], "comments": 24, "likes": 14, "favorites": 86, "is_advertisement": false, "subsite_label": "design", "id": 54053, "is_wide": false, "is_ugc": true, "date": "Wed, 26 Dec 2018 18:55:20 +0300", "is_special": false }
0
{ "id": 54053, "author_id": 230527, "diff_limit": 1000, "urls": {"diff":"\/comments\/54053\/get","add":"\/comments\/54053\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/54053"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199114, "last_count_and_date": null }
24 комментария
Популярные
По порядку
Написать комментарий...
10

Когда наняли дизайнера с дрибббла, который умеет в визуал, и не умеет в пользовательский опыт. Это прям пособие "как не надо делать магазины" :) Корзина которая выпадает сначала сверху, потом после клика — сбоку это прям 10\10, хуже не придумаешь. Этот дизайн ничего не продаст он подойдет для бренда одежды где просто лукбук. Магазины так не выглядят) ну разве что только у вас :)

Ответить
–2

Rayan, не соглашусь – как раз для Dribbble предпочитаю что-то более сочное, зная местные дрибббловские вкусы. Что касается корзины: успех онлайн-магазина и UX-компетентность отображают результаты аналитических данных.

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

Ответить
4

С чем не согласитесь то? То что это не магазин? Или то что он ничего не продаст?
В том и дело что дрибббл дизайнера видно сразу) по вот таким приколам. Как корзина в двух местах. По экранам с листанием фото где 60% места занимают стрелки с серыми цифрами. Вот всякие слова пишите, а то что у вас визуальный мусор бесполезный вы не согласны. Где на десктопе иконка бургер меню заставляющая делать клик, где какие-то бесполезные экраны с заголовом и фоткой. Это визуально чисто, аккуратно исполнено, НО БЕСПОЛЕЗНО. Но я не поверю что сайт будет нормально продавать. Вообще ощущение что это кейс для беханса который никогда не попадет в релиз.

Ответить
3

Застряли вы где-то в прошлом! Такие дизайны сейчас только и продают!

Ответить
2

А продавать нужно не дизайн а товары в магазине ))

Ответить
0

Что там по примерам)

Ответить
4

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

Ответить
–2

Игорь, Вы не целевая аудитория, которой важны каждый стежок или каждая бусинка, что очень важно для особи женского пола ;)

Ответить
5

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

Ответить
–3

ЦА сайта – пользователи продвинутого уровня. При разработке веб-ресурсов для контингента характера комментаторов, конечно, каждое слово из комментариев будет полезным и учтено :)

Ответить
2

Нет такой ЦА как "пользователи продвинутого уровня" ))
Этот можно отнести к одному из признаков ЦА и то с большой натяжкой.

Ответить
4

5 крутых фич для екомерс: слайдер, корзина, фильтры, фотки... Вот фичи так фичи. Прям инновация.

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

Ответить
3

Всегда было интересно, хоть кто-то эти дрибловские дизайны со свистелками-перделками применяет на практике?)
По поводу негативных комментариев, это в основном мужики, не девушки. Мы всё-таки немного разные, с Венеры,Марса, и все такое прочее.
Теперь по сайту, на 2 шаге данные доставки, мне кажется полей больше, чем можно оставить. На последнем шаге кнопка Заказ не работала. Вообще. Кликал стопицот раз, реакции нет. Ux всё-таки хромает. Заходил с мобильного, в Яндекс вебвизоре подсмотрите мою сессию.

Ответить
1

в сафари не работает удаление товара из корзины

Ответить
0

Спасибо! Скажите, не работает именно крестик, или форма подтверждения удаления товара?
А также хотелось бы узнать, какая версия OS компьютера и версия Safari.

Ответить
1
Ответить
1

проверил еще раз, сейчас работает. До этого не работала форма подтверждения

Ответить
0

Еще раз спасибо!

Ответить
1

Давайте будем честны, посредственный сайт созданный радовать глаза создателей и не более

Ответить
1

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

Ответить
1
Ответить
0

ну да, вырви глаз какой-то.

Ответить
0

Главное не останавливайтесь на достигнутом. Мысли правильные, но старые, и я бы даже сказал банальные для 21-го века. Читая и перенимая опыт - вы сможете продвинуться дальше.
1) "Мы поняли, что мода как неотъемлемая часть человека 21-го века, нуждается в инновациях не меньше остальных индустрий" - почитайте про Селфриджа и его универмаг основанный в начале 20-го века.
2) "Главная цель — улучшить визуальную часть сайта и легкость взаимодействия с окружающим миром." - очень странно это слышать от бизнеса. Вроде главная цель - увеличить конверсию, а не взаимодействовать со сферическим конем в вакууме некоего окружающего мира.
3) Mobile vs Desktop - зачем приводить примеры (а значит тратить ресурсы своей компании на разработку) десктопного дизайна если вы сами пишете что большинство ваших клиентов - это мобильные пользователи?

Ответить
{ "page_type": "article" }

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "Article Branding", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "cfovx", "p2": "glug" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Баннер в ленте на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "disable": true, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } }, { "id": 20, "label": "Кнопка в сайдбаре", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "cgxmr", "p2": "gnwc" } } } ] { "page_type": "default" }