Возникли вопросы?
Оставьте заявку и наши эксперты проконсультируют вас
Оставьте заявку и наши эксперты проконсультируют вас
Разработка сайта, UX/UI дизайн-концепции и верстка витрины для ознакомления (не продажи) табачной и кальянной продукции
Cайт «Воздух маркет 18+»
Компания представляет табачную и кальянную продукцию в формате ознакомительной витрины, формируя структурированный каталог товаров. В этой сфере сайт должен быть не просто списком позиций, а удобным инструментом просмотра: он помогает изучать ассортимент, сравнивать характеристики и получать информацию о продукции.
«Воздух маркет» — витрина для ознакомления с табачной и кальянной продукцией
О проекте
Сайт должен решать несколько задач: помогать ориентироваться в ассортименте табачной и кальянной продукции, структурировать представленные категории и упрощать ознакомление с товарами, снижая сложности при выборе. Структура выстроена так, чтобы каждый экран последовательно формировал понимание ассортимента: от общего представления о витрине — к категориям продукции, характеристикам и деталям каждого товара.
Задача от заказчика
Что нужно было сделать
Для проекта использована лаконичная визуальная система, подчеркивающая аккуратность и структурированность подачи. В формате ознакомительной витрины важно понятно представить ассортимент и упростить восприятие категорий, поэтому дизайн построен на аккуратной сетке, выразительной типографике и сдержанных акцентах, помогающих быстро ориентироваться в информации.
UX/UI
#000000
#393785
#11185C
#FFFFFF
Используемые материалы и иконки
Размер шрифта
Палитра
Шрифт
12px
14px
35px
Regular
Bold
Semibold
Aa
Aa
Aa
Montserrat
Дизайн и айдентика
Преимущества разработки на MODX + React
MODX позволяет выстроить сайт под конкретные задачи бизнеса: каталоги, услуги, региональные страницы, новости, формы и дополнительные разделы без жестких шаблонных ограничений.
1. Гибкая архитектура
Клиент может редактировать тексты, добавлять страницы, обновлять карточки, новости и разделы через административную панель MODX без постоянного обращения к разработчику.
3. Удобное управление сайтом
React помогает создавать быстрые и удобные пользовательские интерфейсы: динамические блоки, фильтры, интерактивные элементы, плавную навигацию и работу страниц на разных устройствах.
2. Современный интерфейс на React
Разработка проекта
Реализация
Для создания сайта использовали связку MODX + React, что позволило реализовать гибкую структуру, нестандартную логику разделов, быструю работу интерфейса и удобное управление контентом без ограничений типовых конструкторов.
Сделали проект
на платформе MODX
Дизайн разработан
в программе Figma
Настроили все устройства
Адаптация
Планшетные устройства
от 640px
Ноутбуки и компьютеры
от 980px и более
Мобильные устройства
от 320px
Результаты разработки
Готовый проект
Получился современный сайт, который помогает наглядно представить ассортимент табачной и кальянной продукции, упростить ознакомление с товарами и структурировать выбор. Проект сочетает понятную структуру, лаконичный визуальный стиль, адаптивную верстку и продуманную подачу информации, последовательно знакомящую пользователя с категориями и характеристиками продукции.
Разработка информационного сайта-витрины «Воздух Маркет 18+»
Сайт-витрина отличается от полноценного интернет-магазина тем, что его задача заключается в представлении ассортимента, а не в организации онлайн-продажи. Для «Воздух Маркет 18+» требовалось создать информационный каталог табачной и кальянной продукции с учетом возрастной направленности проекта и без сценария дистанционной покупки.
В Figma были разработаны айдентика и UX/UI-интерфейсы. При дизайне сайта-витрины каталог должен оставаться главным содержанием, поэтому визуальная система помогает разделять категории и просматривать позиции без лишнего количества элементов. При этом интерфейс отличается от стандартной карточки e-commerce, поскольку функции корзины и онлайн-оплаты здесь не являются задачей проекта.
Каталог реализован на MODX и React. Эта технология позволяет организовать структуру продукции и управлять ее содержанием, а React использовать для гибкой пользовательской части. Адаптивная верстка сайта обеспечивает корректное отображение каталога на разных устройствах, сохраняя навигацию и визуальную иерархию.
Кейс показывает, что формат ресурса должен определяться реальной бизнес-задачей. Если компания использует сайт исключительно для ознакомления с ассортиментом, нет необходимости искусственно добавлять функции интернет-магазина. Правильнее создать специализированную витрину, которая решает именно информационную задачу. Другие варианты каталогов, магазинов и корпоративных проектов представлены в разделе портфолио Кулибин IT.
В Figma были разработаны айдентика и UX/UI-интерфейсы. При дизайне сайта-витрины каталог должен оставаться главным содержанием, поэтому визуальная система помогает разделять категории и просматривать позиции без лишнего количества элементов. При этом интерфейс отличается от стандартной карточки e-commerce, поскольку функции корзины и онлайн-оплаты здесь не являются задачей проекта.
Каталог реализован на MODX и React. Эта технология позволяет организовать структуру продукции и управлять ее содержанием, а React использовать для гибкой пользовательской части. Адаптивная верстка сайта обеспечивает корректное отображение каталога на разных устройствах, сохраняя навигацию и визуальную иерархию.
Кейс показывает, что формат ресурса должен определяться реальной бизнес-задачей. Если компания использует сайт исключительно для ознакомления с ассортиментом, нет необходимости искусственно добавлять функции интернет-магазина. Правильнее создать специализированную витрину, которая решает именно информационную задачу. Другие варианты каталогов, магазинов и корпоративных проектов представлены в разделе портфолио Кулибин IT.