Небольшое путешествие через (малые и большие) веб-сайты электронной коммерции

Люди не тратят свои деньги в Интернете легко. Подумайте об этом: Если бы вам пришлось ответить на длинный список вопросов или бороться, чтобы ориентироваться на сайте, сколько денег вы готовы расстаться с? Интернет-магазины об удобстве и комфорте, и те из нас, кто, по крайней мере один раз решился в области интернет-магазинов знаю, как много времени и неприятно это может быть.

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

Дальнейшее чтение на SmashingMag:

Интересные сайты электронной коммерции

Бонобос
Торговый опыт Bonobos гладкий. Хорошая типография и тонкие цвета помогают сосредоточиться на продуктах и функциях, со всеми отвлекающими тем, что вы взаимодействуете с сайтом. Когда новый элемент добавляется в корзину, он появляется в раздвижной боковой панели справа, что побудило клиентов либо держать покупки или проверить. Дизайн формы оформления является элегантным и чистым. Требуемый объем данных никогда не бывает подавляющим, так как они четко разделены управляемыми кусками. И самое главное: значок является иконой бананов! Теперь это довольно прохладно.

bonobos-opt

Мартина Сперл
Сайт Мартины Сперл является прекрасным веб-сайт. Магазин имеет полированную фотографию своей продукции, с простой навигационной панелью, закрепленной на правой стороне страницы. Эффект наведите курсора прост, но смел, показывая номер товара и цену смело в большом шрифте без засечек. Вы можете, конечно, нажмите на изображение, чтобы просмотреть детали о продукте и получить 3-D вид мебели (просто серия изображений). Покупка предмета мебели требует от вас заказать по электронной почте. Опять же, смелые полноширинные изображения продукта используются на страницах продукта, и вы можете нажать на значок «сердце», чтобы выразить свою любовь к продукту. Работает на WordPress.

Martinasperl

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

Evyi

Банан Кафе
Банан кафе с ума. 3-D нависшие эффекты сайта являются последовательными по всему опыту покупок. Блоки вращаются в разных направлениях, создавая интересное движение по всему сайту. Это не ваш обычный интернет-магазин, а коллекция предложений для вашего шкафа. Эффекты наведения показывают справочный номер, который вы будете использовать в контактной форме в нижней части страницы. Ну, аудио и видео в фоновом режиме на самом деле не нужны, но они дополняют уникальный опыт на сайте довольно хорошо.

Banana Cafe

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

madeforfunmadesimo-opt

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

joyandwonder-opt

Уолмарт
Walmart в последнее время реагировать редизайн должно быть довольно предприятие. Основная навигация была скрыта за кнопкой «Магазин Все отделы», которая запускает вне холст навигации на стороне. Элементы хорошо организованы, элементы интерфейса и типографии обеспечивают обзор без беспорядка. Отзывы по каждому пункту могут быть оценены как полезные или не совсем полезные. По мере добавления элемента в корзину появляется лайтбокс, побуждаемый клиентов перейти к выезду или продолжить покупки. Оформление оформления хорошо продумано в разных разрешениях, и вы видите только то, что на самом деле полезно для завершения оформления. Хорошая информационная архитектура, хорошая планировка, хороший редизайн.

walmart-opt

Приборы онлайн
Хотя обзор предметов в категории довольно подавляющим на ao.com, торговый и выезд опыт очень приятный действительно. На страницах продукта клиенты могут сравнить функцию недавно просмотренных элементов рядом друг с другом в таблице, в то время как многие продукты имеют встроенный видео-обзор. Оформление предоставляет различные варианты, но это легко следовать шагам, чтобы в конечном итоге только то, что вам нужно, когда вам это нужно.

applicances-online-

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

moomin-opt

ГоМакро
Если вы ищете a. . различные интернет-магазины опыт, GoMacro это вариант стоит проверить. Вместо того, чтобы простой обзор сетки элементов, все элементы сгруппированы в цветные круги элементов. Опыт добавления элементов в корзину очень уникален, как вы буквально место баров в корзину. Оформление также хорошо продумано и довольно просто следовать через хотя основная навигация («Назад» и «Следующий шаг») как-то скрыты за фактической кассе lightbox. Уникальный дизайн может работать также, и GoMacro показывает, как это можно сделать.

gomacro-opt

Потерял свое имя
Хорошо, это на самом деле не интернет-магазин, но оформление кассы довольно прекрасно. Дизайн применяет мягкое прикосновение визуального дизайна бренда к веб-формам, создавая приятный общий опыт. Вероятно, лучшее прилагательное для описания дизайна является «дружественным». Так же, как и опыт оформления.

lostmyname-opt
lostmyname-opt-2

ИндокиноТорговый опыт Indochino является королем настройки. В основном вы можете настроить все. Тем не менее, это требует довольно некоторого взаимодействия со стороны клиентов. Изображения продукта на видном месте выделены в виде фоновых изображений. В костюмах, все, от лацканов куртки до вентиляционных отверстий, пуговиц, карманов, подкладок и складок могут быть настроены. Перед отъездом вас просят предоставить подробные данные измерений, которые занимают всего 18 шагов. Ну, если вы хотите предоставить много индивидуальных вариантов в вашем магазине, Indochino является прекрасным примером для обучения. Отзывчивый дизайн не совсем работает в некоторых сценариях, хотя, особенно когда дело доходит до страниц с большим количеством доступных вариантов.

indochino-opt

AbletonСайт Ableton является лишь еще одним примером того, как яркая цветовая гамма не обязательно мешает хороший опыт покупок. Сайт использует много цветов, но они хорошо сочетаются друг с другом, создавая комфортную атмосферу на странице. Хорошая типография, соответствующие цвета, со всем положением в нужное место. Это, вероятно, хорошая идея не использовать «navicon» значок для навигации в заголовке страницы.

ableton-optjpg

КоконыЭтот магазин имеет довольно замечательное взаимодействие с пользователем. Шикарный эффект нависка поворачивает рукав IPad вокруг для вас, чтобы увидеть, как он выглядит со спины. Большие полношириные фотографии на страницах продукта довольно хорошая идея, чтобы показать продукты «в действии». Еще одной желанной особенностью является маленькая кнопка в заголовке, которая говорит вам, если элемент был добавлен в корзину. Веб-форма для биллинга детали короткий и простой, завершая приятный опыт покупок. Единственным недостатком является селектор страны, который может быть замененчто-то немного более элегантный.

Cocones

Бендж и СотоБен и Сото является строго функциональный сайт с чистым дизайном. Он имеет совершенно уникальное взаимодействие; Вы можете украсить свой собственный куб, а затем просмотреть все шесть сторон, ну, на самом деле его поворота. Мне очень нравятся аннотированные элементы, которые добавляют своего рода незавершенный вид к нему. Понятно, что вы должны создать учетную запись или войти в Twitter или Facebook, чтобы создать и сохранить дизайн. Хороший способ визуализации продукта.

Benj & Soto

MotorolaОтзывчивый интернет-магазин Motorola красиво оформлен, отображая большие фотографии продуктов, которые доминируют на экране. Плоский дизайн создает впечатление, что продукты без хлопот опыт. Motorola призывает своих пользователей к разработке своего собственного взгляда, и веб-сайт имеет прекрасный UX, с большими четкими кнопками. В узком представлении фильтр и поиск реализуются с помощью фиксированного меню фильтра/поиска – может быть хорошей идеей рассмотреть возможность использованияНаложение «режим просмотра»Вместо.

Martinasperl

ДиттоОдна вещь о он-лайн ходить по магазинам что вы не можете попробовать его дальше до тех пор пока вы не будете получать его в почте. До сих пор, что есть! Виртуальная функция try-on Ditto выводит взаимодействие с пользователем на новый уровень, так как вы можете видеть, как будет выглядеть набор кадров для очков на вашем лице с экрана компьютера. Информация о доставке довольно быстро и легко заполнить, и весь процесс только два шага в длину. И приятное взаимодействие на первой странице с «открытием» книг весьма примечательно.

Martinasperl

ЦоветУтонченность и элегантность – это слова, которые приходят на ум при посещении этой страницы. Компания Tsovet имеет интересный дизайн, сопровождаемый красивой черно-белой фотографией, которая задает тон бренду. Процесс оформления выезда относительно безболезненен: все, что вам нужно сделать, это заполнить простую одностраничную форму оформления. Изображения прокручивают друг друга, добавляя еще один интересный эффект. Приятно видеть, как страницы продукта удается содержать так много деталей, используя простой шаблон аккордеона.

Tsovet

Навес(в настоящее время вниз?)
Навес все лучшие вещи на Amazon, Куратор тех, кто знает вас лучше всего. Вы можете увидеть продукты, рекомендованные друзьями, или сделать свои собственные рекомендации. Каждая ссылка приведет вас прямо в магазин Amazon, где вы можете следить за знакомым процессом. Мне нравится минималистичный дизайн сайта, и макет имеет открытое чувство к нему. Цены хорошо видны на каждом продукте, помогая вам просматривать веб-сайт с легкостью. Очень необычный торговый интерфейс, который используется разумно и правильно на сайте.

Canopy

ОрландоСтраница Орландо имеет довольно интересные переходы. При нажатии на различные категории предыдущее изображение исчезает, оставляя достаточно места для нового изображения и деталей продукта. Тем не менее, вы не можете на самом деле купить товары с самого сайта; скорее, вы должны заказать по электронной почте, что довольно удивительно. Навигация предоставляется с левой стороны в виде наложения. Также довольно необычно для интернет-магазина.

Orlando

МинимальныеМинимумимеет красиво мягкую, минимальную эстетику. Веб-сайт, который продает приглашения для душа ребенка, мило и дружелюбно. Удивительно, как простые закругленные углы в блоках может поставить вас в покое. Эффект нависшей немного неудобно — имя и цена исчезают, когда вы берете мышь прочь. В корзине клиенты могут выбрать страну, в которую должен быть отправлен товар, и сразу обновить общую цену. Магазин без колоколов и свистков, но с уникальным, личным дизайном. Работает на Bigcartel.

Minimals

НудоллТеперь это что-то немного другое! Noodoll имеет весело записки чувство; милые страницы загрузки анимации прекрасны, как они создают немного интриги с вырезом символов в правом верхнем углу. В самом деле, мало анимации посыпать все вокруг веб-сайта, создавая игривый и привлекательный опыт. Как вы добавляете больше элементов в корзину, они появляются в левой боковой панели, а не в правом верхнем углу, который немного необычно. Работает на Shopify.

Big Cartel

Ле Коль де КлодинСайт Le Col De Claudine имеет элегантный дизайн, который демонстрирует модный бренд. Посетители встречают с красивыми, мягкими фотографиями, которые выступают в качестве большого заголовка. Оформление является пятиступенчатым процессом, без опции выезда гостей. Есть не трюки или эффекты, чтобы отвлечь от предмета. И эффект нависшего над модой штук смелый, не будучи слишком громко, хотя он не работает на мобильных телефонах, конечно. Интересно видеть цены не отображаются по умолчанию, но только на наведении.

Twelve South

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

Martinasperl

ВеликихОтзывчивый Greats ‘интернет-магазин очень хорошо разработан, с большим количеством польских и внимание к продуктам. Онлайн-только мужской обувной бренд использует последовательную типографику и фотографии, чтобы представить свою продукцию хорошо. Все предметы, как представляется, плавают в воздухе, будучи выстрел под тем же углом. Особенности каждой обуви тщательно описаны и представлены. Как только элементы добавляются в корзину, вы можете просмотреть корзину в приятной накладке. Дизайн кассы, возможно, слишком упрощен, но он хорошо работает в брендинг сайта. Интернет-магазин с хорошо представленными продуктами и продуманной планировкой.

Greats Brand

Большой картельФотография на Большой картель сильна и смелая, с богатыми, земными цветами, которые привлекают внимание пользователя. Есть также не длительные описания, а краткие биты объяснения. Этот веб-сайт не имеет гостевой вариант выезда (что довольно редко), но весь процесс покупки составляет всего четыре шага в длину и все на одной странице, которая держит процесс от чувства утомительно и освобождает пользователя от необходимости постоянно нажимать на следующий шаг. Веб-формы также просты в использовании и красиво оформлены. Хороший пример опыта покупок, который фокусируется на одном крупном товаре на странице, и больше ничего.

Big Cartel

Повинуйтесь одеждеObey обеспечивает плавный опыт покупок, используя последовательную типографику. Страницы продукта обеспечивают подходящие и укладка руководства, а также количество просмотров для каждого элемента. Ссылка на выезд показывает быстрый предварительный просмотр — наложение с пунктом, s, цены и возможность удалить или отменить элементы из сумки, которая вполне удобна. Оформление является довольно обычным, но то, что не хватает является прогресс бар, который общаться, в какой части процесса оформления данных пользователь в настоящее время. Приятно прикасаться красный плюс знак, который означает «добавить в корзину», которая сопровождается «Добавлен один пункт в корзину» заголовок, который появляется. В этом случае, простой, без излишеств дизайн укрепляет имидж бренда хорошо.

Martinasperl

ФрютеВеб-сайт Фрюте имеет дизайн, который соответствует всем формам Интернета. Контраст может быть улучшен немного, но плоские эстетические создает мягкий, но приземленный чувствовать, что соответствует бренду. Это интересно увидеть сочетание общей сетки и больших, видных изображений продукта по всему сайту. Существует нет варианта выезда гостей, но вы можете войти в систему с помощью учетной записи Facebook. Это также довольно необычно, чтобы увидеть «философия» раздел в интернет-магазине, которые объясняют страсть компании и обоснование своей продукции. Как элемент добавляется в корзину, он появляется как лайтбокс в правом верхнем углу.

Martinasperl

Sew SewПростой макет сетки и плавные переходы, наряду с ценами, четко отображаемыми под каждым элементом, делают для удобного веб-сайта. Магазин находится в ведении Клэр Уоллс, который проектирует все самостоятельно, и ее личность светит через веб-сайт довольно ярко. От тонкой цветовой гаммы до фотографий продуктов и описания продуктов — все говорит одним последовательным голосом. Для независимых интернет-магазинов это, вероятно, самое значительное качество, чтобы заботиться.

Sew Sew

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

Fiorly

Заключение

Там у вас есть, некоторые из интересных интернет-магазинов там. Тратить с трудом заработанные деньги трудно, поэтому, конечно, как дизайнер интернет-магазина, вы хотите, чтобы ваши пользователи чувствовали себя максимально комфортно. Если вы продаете свои собственные услуги дизайна или пару дизайнерских джинсов, речь идет о хороший общий опыт покупок и быстрый выезд. Теперь, если это не причина, чтобы удалить пару ненужных флажков, добавить лучшую типографику и удалить ненужные в кассе, что?

Что интересно дизайн / UX методы для лучшего опыта покупок вы нашли в последнее время? Или как вы оптимизировали процесс оформления в интернет-магазине в последнее время? Препятствуйте нам знать в комментариях!

Мы благодарим всех, кто представил свои ссылки через Twitter и Facebook в течение последних нескольких дней. Ты разбиваешь, ты это знаешь, да?

Источник: smashingmagazine.com

Великолепный Журнал

Великолепный, сокрушительный, разящий (см. перевод smashing) независимый журнал о веб-разработке. Основан в 2006 году в Германии. Имеет няшный дизайн и кучу крутых авторов, которых читают 2 млн человек в месяц.

Добавить комментарий

%d такие блоггеры, как: