Клиенту нужен был удобный раздел с материалами кадастровых инженеров и земельных юристов. Мы спроектировали и внедрили витрину и страницу статьи — с поиском, темами и навигацией для чтения, внутри действующего сайта на 1С-Битрикс.
Бренд Вита Хауз был до нас: знак, синий и гарнитура Mont. Раздел собран в этих рамках.
Знак — пятилучевая фигура, «звезда-домик», в двух оттенках синего.
Название в логотипе набрано строчными: «вита хауз».
Заголовки и текст — Mont, три начертания.
Синий 110%#001DC8
Основной#0023F5
Синий 60%#00A3FF
Синий 30%#9EDCFF
Чёрный#363636
02 — Раздел статей
Первый экран
Темы со счётчиками стоят над списком, рядом поиск по материалам, а в карточке видны рубрика и время чтения.
vita-house.ru/articles/Первый экран1600 × 1000
Было
Раньше теги и фильтры занимали отдельные блоки, а выбрать материал можно было только по заголовку.
03 — Три экрана
Как устроен раздел
Выбрать
Темы и поиск
Темы со счётчиками, поиск и подборки собраны над списком. Выделенный анонс задаёт точку входа.
Читать
Структура статьи
Заголовок и вводный текст отделены от материала, рядом — автор и время чтения. Появились оглавление и прогресс чтения.
Продолжить
Связанные материалы
Рекомендации по теме и услуге идут рядом с текстом, а в конце — переход к консультации.
04 — Детали
Решения интерфейса
Два шаблона, не новый сайт
Раздел работает внутри действующей 1С-Битрикс. Мы изменили витрину и страницу статьи, не трогая остальной сайт и привычную работу редакции.
Адреса сохранены
Публикации и их адреса остались прежними: раздел обновился, ссылки из поиска и рассылок продолжают вести туда же.
Навигация на узком экране
Оглавление длинного материала на телефоне убрано в компактную панель — иначе оно занимало бы первый экран целиком.
05 — Ход работы
Что было и что сделали
Задача
С чего начали
В прежнем разделе теги и фильтры занимали отдельные блоки, а статья шла плотным текстом без структуры. Экспертные материалы было трудно найти и неудобно читать. При этом менять платформу и ломать привычную редакционную работу клиент не хотел.
Решение
Что изменили
Изменили два шаблона в существующей системе. Темы со счётчиками, поиск и подборки собрали в понятную иерархию над списком. У статьи появились оглавление, прогресс чтения, автор и время чтения, а в конце — рекомендации по теме и услуге. Публикации и публичные адреса сохранены.
06 — Что входило
Состав работы
Исследование и структура
Арт-дирекшн
UX/UI-дизайн
Разработка и запуск
Технологии, на которых собран проект.
1С-БитриксPHPJavaScriptCSSАдаптивная вёрстка
Границы кейса
Что показывает эта страница
Снимки сделаны с работающего проекта, а не с макета. Показываем интерфейс и решения, которые сделали сами.
Результат кейса — выпущенный интерфейс. Изменение числа заявок, выручки и позиций в поиске мы этой работой не измеряли и не приводим. Полоса с цифрами появляется только там, где измерение действительно есть.