Макеты интернет-магазина ювелирных украшений «Silivir.ru»
Главная страница
Главная страница позволяет пользователю осуществить быстрый подбор товара по его свойствам, не заходя в каталог, а также знакомит с новинками и популярными моделями, и предоставляет информацию об ассортименте и доставке. Мы прорисовали несколько вариантов главной страницы со всеми возможными состояниями взаимодействия пользователя с элементами. Вот некоторые из них.
- Статика
- Наведенные элементы
- Форма регистрации
Разводящая страница каталога товаров
Визуальный каталог товаров позволяет быстро сориентироваться в многообразии ювелирных изделий. Каждый большой раздел каталога выполнен в виде «плитки», содержащей изображение товарной группы, ссылки на раздел и его подразделы. При наведении на «плитку» изображение затемняется, позволяя осуществить выбор нужной ссылки не отвлекаясь на фон.
Список товаров
Список товаров — один из самых сложных разделов сайта. Он содержит подробный фильтр товаров, с помощью которого пользователь в несколько кликов подберет для себя нужный товар. Здесь фильтрация осуществляется по типу изделия, цене, размеру, материалу, вставке, бренду, и т.п. Блоки фильтрации выводятся в соответствии с теми свойствами, которые в текущий момент присутствуют у товаров. Например, нельзя отфильтровать каталог колец по вставке «Изумруд», если такой вставки нет хотя бы у одного изделия в списке, этот пункт просто не будет показан. Также в списке можно, кликнув по кнопке элемента «Посмотреть», открыть модальное окно быстрого просмотра карточки товара, что сэкономит время на переходах. В режиме быстрого просмотра есть возможность просмотреть товар во всех возможных вариантах вставок.
- Список товаров
- Быстрый просмотр товара
Карточка товара
Карточка товара содержит исчерпывающую информацию об изделии. Здесь же представлены данные о комплекте, весе изделия, отзывы, а также продемонстрированы товары, которые пользователь уже просмотрел. Важной особенностью карточки является то, что она «знает» выбор пользователя на предыдущем этапе фильтрации (если таковая была), и показывает сразу тот вариант изделия, который искал покупатель. В качестве дополнительных функций на странице предусмотрены блоки «Поделиться ссылкой» и «Хочу в подарок», что может положительно сказаться на социальных факторах продвижения и конверсии.
Корзина и заказ
Больше не нужно никаких шагов оформления заказа — корзина и форма для ввода данных о покупателе выводится на одной странице. От момента перехода пользователя в корзину до совершения конверсионного действия (покупки и оплаты) всего пара действий. По статистике именно на этапе оформления заказа происходит максимальное число отказов от покупки, т.к. от пользователя зачастую требуется указать слишком много всяких данных, либо процесс оформления сам по себе слишком сложный и запутанный. В спроектированном нами магазине у покупателя больше нет подобных преград в виде поэтапного заполнения форм, подтверждения состава покупки (снова и снова) и т.п. Для совершения покупки даже не требуется регистрация. Покупателю автоматически будет создан аккаунт на основании тех данных, что он введет при оформлении заказа, а на почту придет письмо с инструкциями. Здесь покупать украшения легко и приятно!
- Корзина
- Завершение заказа
- Письмо о заказе
Дополнительные страницы
Для сайта нарисовано большое количество дополнительных макетов, таких как список желаний, текстовые страницы, шаблоны писем и рассылок, страницы пользователя, страница управления подписками и напоминаниями, и т.д.
Произведенные работы:
Разработка сайта — проектирование веб-интерфейса, создание PSD-макетов.
Спроектировано и отрисовано несколько десятков макетов сайта, включая UI-элементы (техническая графика, позволяющая пользователю лучше понимать предназначение того или иного элемента интерфейса): иконки, кнопки, переключатели, панели сортировки и фильтрации товаров и т.п. Помимо страниц сайта спроектированы и нарисованы макеты HTML-писем об успешном заказе, писем-напоминаний о незавершенном заказе и т.п. На основе проекта создано объемное техническое задание на верстку шаблонов и программирование, а также описание обмена данными сайта с программой 1С. Осуществлен авторский надзор за техническим внедрением проекта.