Перейти к содержимому

Дизайн и вёрстка
сайтов на Joomla

Создаём современный и удобный дизайн, переносим готовые макеты и обновляем внешний вид существующих сайтов. Работаем с YOOtheme Pro, UIkit, Joomla и JoomShopping.
Дизайн работает вместе со структурой, контентом и функциональностью сайта.

Дизайн, который помогает выполнить действие

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

Понятная структура

Страницы и навигация соответствуют задачам пользователя.
02

Заметные действия

Кнопки, формы и покупка не теряются среди контента.
03

Единая система

Типографика, цвета и компоненты используются последовательно.
04

Готовность к развитию

Новые страницы и функции добавляются без полного редизайна.

Три способа начать работу

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

Новый дизайн

Проектируем главную, внутренние страницы, каталог, формы и повторно используемые компоненты с учётом фирменного стиля.

Структура → направление → система

Вёрстка макета

Переносим дизайн из Figma, PenPot или другого формата на Joomla, согласуя его с реальными возможностями компонентов.

Макет → компоненты → адаптация

Редизайн сайта

Сохраняем полезную структуру и материалы, обновляем шапку, типографику, страницы, магазин, кабинет и служебные экраны.

Аудит → приоритеты → обновление

Адаптивность — это поведение, а не уменьшенная копия

На каждом размере экрана проверяем, насколько легко выполнить ключевые действия.

Компьютер

Полная навигация, широкие сетки, сравнение данных и многоколоночные формы.

Планшет

Перестроенная сетка, удобные зоны нажатия и контроль длинных таблиц.

Смартфон

Меню, поиск, галерея, фильтры, атрибуты, корзина и checkout доступны одной рукой.

Дизайн интернет-магазина JoomShopping

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

Каталог

Сетка товаров · фильтры · сортировка
02

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

Галерея · атрибуты · цена · покупка
03

Корзина

Состав · количество · итог
04

Оформление

Контакты · оплата · доставка
05

Кабинет

Заказы · лицензии · поддержка

Стандартного шаблона недостаточно?

Переделаем шаблоны JoomShopping под дизайн проекта и нужную логику отображения товаров, атрибутов, цен и заказа.

YOOtheme Pro и UIkit как управляемая дизайн-система

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

Контент

Тексты · изображения · данные Joomla
02

Шаблоны

Страницы и типы материалов
03

Компоненты

Секции · формы · карточки · меню
04

Интерфейс

Единый вид на всех страницах
UIkit используем для сеток, меню, модальных окон, переключателей, слайдеров и форм. При необходимости добавляем собственные CSS, JavaScript, PHP и шаблоны.

Индивидуальные элементы YOOtheme Pro

Когда стандартных возможностей конструктора недостаточно, создаём элемент с нужными настройками и источником данных.

Каталог услуг

Карточки и категории с управляемым выводом

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

Специальное представление цены, атрибутов и покупки

Таблица характеристик

Структурированные технические параметры

Калькулятор

Расчёт по правилам бизнеса

Фильтруемый список

Поиск и отбор в собственных данных

Форма с логикой

Условные поля, проверки и передача данных

Иногда полный редизайн не нужен

Можно точечно исправить то, что мешает пользоваться сайтом и завершать нужные действия.

Навигация

Упростить меню, поиск и переходы между разделами.

Взаимодействие

Сделать CTA заметнее, сократить формы и количество шагов покупки.

Представление

Улучшить карточки товаров, мобильный вид и визуальную иерархию контента.

От анализа до готового интерфейса

До начала работ согласовываем страницы, функциональность и границы проекта.
01

Анализ

Сайт, задача, аудитория и ограничения
02

Структура

Страницы, сценарии и приоритеты
03

Направление

Типографика, цвета и принципы
04

Дизайн

Макеты и повторно используемые компоненты
05

Вёрстка

Joomla, YOOtheme Pro, UIkit, JoomShopping
06

Проверка

Формы, покупка, экраны и подготовка к запуску

Дизайн не существует отдельно от системы

Мы знаем, как макет будет управляться в Joomla и как он взаимодействует с каталогом, расширениями и бизнес-логикой.

Joomla

Учитываем компоненты, модули, шаблоны и структуру управления контентом.

JoomShopping

Можем изменить не только внешний вид, но и представление товаров, атрибутов, цен, корзины и checkout.

Разработка в одной команде

Если макет требует нового шаблона или функции, реализуем это в рамках одного проекта.

Дальнейшее развитие

Система остаётся пригодной для новых страниц, языков, товаров и интеграций.

Уже есть макет или рабочий сайт?

Пришлите ссылку, макет, список страниц, примеры и описание нужных изменений. Мы проверим материалы, предложим способ реализации и подготовим предварительную оценку.

Какие страницы хотите изменить?

Добавьте ссылку на сайт или макет, примеры и объясните, что сейчас неудобно.
Объём, стоимость и сроки определим после оценки задачи.
Краткий бриф

Расскажите о вашем проекте

Несколько ответов помогут понять задачу и оценить следующий шаг.

01. Задача
02. Детали
03. Контакты
Не нужно готовить полное техническое задание. Опишите задачу своими словами.

Обсудить интеграцию

Опишите сервис и данные, которыми нужно обмениваться. Этого достаточно для предварительной оценки задачи.


Что нужно интегрировать?
Можно выбрать несколько вариантов.
Если документация публичная, добавьте ссылку. Это поможет быстрее оценить возможности интеграции.

Как должен работать обмен данными?
Например: получать остатки из CRM, передавать заказы с сайта или синхронизировать данные в обе стороны.
Какие данные нужно передавать?
Опишите желаемый сценарий работы. Технические термины необязательны.