Дизайн интернет-магазина мебели с нуля: от брифинга и согласования первой страницы до настольных и мобильных макетов, UI kit и передачи в разработку.
В этом кейсе
От брифа к первой странице
Я разработал дизайн нового интернет-магазина Sirius Art в Figma. Работу начал с брифинга: уточнил пожелания заказчика, состав страниц и объём товарного каталога. За дизайн сайта отвечал самостоятельно; логотип и фотографии мебели предоставил заказчик.
Подробнее о решениях
Сначала подготовил первую страницу и согласовал её с заказчиком. После утверждения визуального направления отрисовал остальные страницы, мобильные версии и состояния интерфейса.
Главная страница
Крупные изображения мебели и интерьерные фотографии задают подачу магазина. На главной собраны промопредложения, популярные товары и переходы в каталог.
Выбор мебели
Каталог и карточка товара раскрывают разные этапы выбора: сначала отбор подходящей мебели, затем её фотографии, описание и параметры. Для каждого этапа подготовил настольную и мобильную компоновку.
Каталог на компьютере
Категории и фильтры вынесены в боковую колонку. Рядом расположены сортировка, поиск и сетка товаров с ценами, избранным и добавлением в корзину.
Корзина и оформление
В корзине объединил работу с выбранными товарами и форму заказа. Макеты предусматривают выделение позиций, удаление, избранное, контактные данные и адрес доставки.
Заказ на компьютере
Список товаров расположен слева, форма и итог — справа. Здесь же предусмотрены выбор всех позиций и очистка корзины.
Единый визуальный язык
Основу оформления составляют белый фон, чёрные акценты, тонкие линии и изображения мебели. Страница о компании продолжает эту подачу через интерьерные фотографии.
Подробнее о решениях
Для повторяющихся элементов собрал UI kit и подготовил отдельные состояния: варианты кнопок и иконок, ошибки полей, меню, поиск, фильтры и уведомления.
О компании
Текстовые блоки и интерьерные фотографии показывают бренд в той же визуальной системе, что и основные страницы магазина.
Результат
Заказчик принял макеты и передал их в разработку. По подготовленному дизайну интернет-магазин впоследствии реализовали на Tilda. Мой вклад — брифинг и дизайн сайта: настольные и мобильные страницы, UI kit и состояния интерфейса.