Интернет-каталог - это корпоративный сайт с ограниченным ассортиментом товаров/услуг. В каталоге пользователь может выбрать понравившийся ему товар, а затем с помощью формы обратной заявки связаться с менеджером и заказать его.
Интернет-магазин - это расширенный по функционалу интернет-каталог, который имеет:
Корзину, личный кабинет, подключение к платежным системам, интеграцию со службой доставки, сервисы по статистике покупок и наличия товаров.
Процесс разработки, дизайна и запуска интернет-магазина это очень длительная и кропотливая работа большой группы специалистов.
Особенности дизайна интернет-магазина:
Меню, категории товаров и фильтры, разделы на главной странице, внутренние страницы.
1) Меню
в интернет-магазинах чаще всего многоуровневое и выпадающее. Оба эти меню разграничивают разную по смыслу навигацию на сайте: одно меню отвечает за основную навигацию - список основных категорий товаров, а второе отвечает за вторичную, но тоже важную для пользователя информацию - доставка, способы оплаты, адреса магазинов и т.д.
Строка меню интернет-магазина также обязательно содержит такие элементы, как:
Логотип, корзина, быстрые контакты, поисковое поле, личный кабинет(не во всех магазинах).
2) Категории товаров и фильтры
В большом интернет-магазине невозможно быстро выбрать товар без наличия фильтра, который помогает отобрать категории товаров по определенным характеристикам (производитель, цена, материал и т.д.)
Хорошим тоном является вынесение списка категорий товаров и фильтров в две отдельные панели.
3) Разделы на главной странице:
Главный экран, категории товаров, акции, популярные товары, новинки, бренды, клиенты, футер.
Прежде чем создавать главную страницу магазина, уточните у заказчика:
1) Собирается ли он проводить постоянные акции или распродажи. 2) Часто ли у него обновляется ассортимент. 3) Со многими ли брендами и марками товаров он работает 4) Есть ли среди его товаров необычные экземпляры, которые можно использовать для привлечения внимания и т.д.
Главный экран.
Чаще всего представляет собой баннеры с акциями, примерами трендов или новой продукцией.
Главный экран интернет-магазина может быть представлен одним постоянным экраном, но тогда пропадает ощущение постоянного обновления каталога, и пользователь теряет доверие к ресурсу.
Категории товаров.
Раздел, который демонстрирует, какие самые популярные категории товаров пользователь может приобрести на сайте.
Его не всегда используют, но если и размещают, то делают все блоки категорий водном стиле и обязательно очень показательными.
Акции, популярные товары, новинки.
Один из разделов, который должен быть не очень навязчивым, но в тоже время запоминающимся.
Задача таких разделов в том, чтобы обеспечивать постоянное обновление сайта и демонстрировать самые актуальные предложения.
Бренды, клиенты.
Раздел, который необходим для того, чтобы повысить лояльность покупателя, демонстрируя своих самых известных клиентов или же самые популярные бренды товаров, чтобы повысить доверие к магазину.
Футер.
Чаще всего футер в интернет-магазинах очень внушительные по размерам, т.к. должны содержать в себе информацию разного рода:
- логотип
- информация о компании (контакты, сотрудничество, вакансии)
- помощь покупателю (возврат, рассрочка, как оформить заказ и т.д.)
- доставка и оплата (желательно с указанием возможных вариантов электронных платежей)
- группы в социальных сетях
- поисковая строка
- ссылки на скачивание мобильных приложений для магазина (многие крупные компании не скупятся на создание мобильного приложения для своего магазина - это удобнее и мобильнее)
Видео-уроки:
1) Дизайн интернет-магазина в веб-дизайне.
2) Дизайн главной страницы интернет-магазина в фотошопе.
3) Завершение дизайна главной страницы интернет-магазина в фотошопе.
4) Создание дизайна блога (новости) в фотошопе для сайта.
Мы разобрали модуль №5 Веб-дизайн сайта. Дизайн интернет-магазина
Дальше интересней и насыщенней, следующей урок - Дизайн интернет-магазина (часть 2) - внутренние страницы. Подписывайся чтоб ничего не пропустить.
Урок №4 Уроки веб-дизайна. Дизайн внутренних страниц и всплывающих окон
Курс веб-дизайна для начинающих
