Компания Pixel 24

pixel24.ru
Oдин из лучших интернет-магазинов по продаже профессиональной и любительской фото- и видеотехники с 2009 года.

  • Адаптивный дизайн
  • Инфографика
Главное изображение Фоновое изображение Фоновое изображение Фоновое изображение Фоновое изображение Фоновое изображение Фоновое изображение Фоновое изображение Фоновое изображение Фоновое изображение Фоновое изображение Фоновое изображение

Проектирование

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

Аудит сайта

На первом этапе работы был проведен комплексный аудит, который помог сформировать план работы над проектом.

  • 1. Аудит продвижения
  • 2. Технический аудит
  • 3. Аудит дизайна и юзабилити
  • 4. Анализ выявленных ошибок
  • 5. Подведение итогов
  • 6. Составление плана по редизайну сайта

Основные разделы сайта

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

Структура сайта

Концепции

С учётом аудита и полученной структуры мы предложили две концепции сайта.

Дизайн

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

  • 1

    Была изменена структура главной страницы и нейминг основных блоков.

    Прототип Прототип Прототип Прототип
    1. Персонализация выбора 2. Выделены важные разделы 3. Новый блок с категориями 4. Свежая подача информации в блоге
  • 2

    Пересмотрели систему навигации: главный акцент был сделан на каталог товаров, значимые пункты меню вынесены наверх, второстепенные размещены в футере.

    Старый дизайн Новый дизайн
  • 3

    Тщательно проработали функционал основного меню “Каталог товаров”.

    Каталог товаров, список

Каталог

В каталоге детально продумали систему фильтров, окна уведомлений, сравнение товаров и многое другое.

Каталог товаров
Страницы каталога Страницы каталога Страницы каталога Страницы каталога Страницы каталога Страницы каталога Страницы каталога Страницы каталога Страницы каталога Страницы каталога Страницы каталога Страницы каталога

Нашли идеальное решение для карточки товара.

  • Карточка товара
  • Карточка товара
  • Карточка товара
  • Карточка товара

Корзина и личный кабинет

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

Карточка с ценой
  • Каталог на мобильном Каталог на мобильном Каталог на мобильном
  • Каталог на мобильном

Фотостудия и фотошкола Pixel24

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

Фотошкола
Фотостудия
  • Фотошкола
  • Фотостудия
Студия навигация Фотошкола навигация
Внутренние страницы

Внутренние страницы

В ходе проекта было разработано более 150 макетов. Все страницы спроектированы по принципам модульного дизайна и адаптивной вёрстки. Благодаря этому контент корректно отображается на устройствах с разным разрешением экрана.

UI-Kit

Все элементы интерфейса собраны в единый UI KIT, облегчающий дальнейшую работу и масштабирование сайта.

UI kit
Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка Иконка

Особенности реализации

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

  • Модальные окна в телефоне
  • Модальные окна в телефоне
  • Модальные окна в телефоне
  • Модальные окна в телефоне
  • Модальные окна в телефоне
  • Страница в телефоне
  • Страница в телефоне
  • Страница в телефоне
  • Страница в телефоне
  • Страница в телефоне

Рекламные материалы

Дополнительно был разработан набор рекламных материалов из 24 баннеров.

рекламные баннеры рекламные баннеры рекламные баннеры рекламные баннеры рекламные баннеры