Разработка сайта · Тюмень
АртПазлСайт, который складывается как пазл
Салон керамической плитки и керамогранита в Тюмени работает с 2012 года, официальный дистрибьютор Italon и Coliseum, открыл в городе первый Italon Experience. Название и логотип салона — пазл. Команда студии разработала сайт, в котором эта идея работает на каждой странице: интерьер собирается из кусочков, а ремонт складывается из подбора, дизайна и резки.
Последний кусочек — за вами. Перетащите его на место
С нами у вас всё сложилось
- С 2012 года
- салон помогает собрать ремонт
- Italon и Coliseum
- официальный дистрибьютор в Тюмени
- 4 услуги
- сложены в один пазл
- 20 видов
- страниц и окон — одним языком
Идея
С нами у вас
всё сложится
Салон выбирают за профессионализм, большой выбор и стиль. Но главное, что он делает, — собирает ремонт целиком: помогает выбрать плитку, показывает её в интерьере и готовит детали к укладке. Поэтому девиз салона стал сюжетом сайта, а три услуги — тремя кусочками, которые сцепляются друг с другом.
- 01ПодборВ шоу-руме прикладывают образцы друг к другу и находят сочетание под интерьер, свет и бюджет.
- 02ДизайнВыбранные коллекции показывают в помещении покупателя — до начала ремонта.
- 03РезкаПлитка приходит на объект готовыми деталями: прямой рез, фаска под 45°, отверстия.
Главная
Интерьер собирается,
пока вы листаете
Первый экран главной — фотография интерьера, разрезанная на настоящие кусочки пазла с выступами и пазами. Посетитель прокручивает страницу — кусочки слетаются, по очереди появляются слова «Подбор», «Дизайн», «Резка» и «всё сложится», последний кусочек защёлкивается со вспышкой, и только потом выходит заголовок с кнопками.
- 1Подбор
- 2Дизайн
- 3Резка
- 4всё сложится
Фирменный язык
Четыре кусочка —
один знак
Знак салона — четыре кусочка пазла: два тёмных и два зелёных. Из него выросли все приёмы сайта: настоящие кромки с выступами и пазами, сцены сборки, кусочек перед заголовками. Цвета спокойные — слоновая кость, камень и глубокий чёрный, а зелёный салона работает только акцентом: на номерах, значках и в момент, когда что-то «сложилось». Шрифт — Montserrat.
Шапка
Капсула,
в которой всё под рукой
Шапка — компактная тёмная капсула над страницей: знак, каталог, разделы, поиск, телефон и корзина. «Каталог» раскрывает большое меню — разделы с фото, подбор по помещению и по дизайну с образцами фактур, фабрики. Лупа раскрывает поле поиска прямо поверх капсулы, подсказки появляются по мере ввода.
Услуги
Ремонт —
из четырёх кусочков
На странице «Услуги» четыре фотографии сложены в пазл 2×2: подбор, дизайн-проект, резка и комплектация. Нажатие на кусочек ведёт к рассказу об услуге, а сбоку едет мини-пазл «Собрано 1 из 4… 4 из 4» — чем дальше читаешь, тем полнее картина. Наведите на кусочки ниже.
Доставка
Привезём так,
чтобы всё сложилось
Страница доставки начинается с маршрута: со склада на улице Дружбы кусочек пазла едет по дороге к «вашему объекту» и встаёт на место. Дальше — три способа получения сцепленными кусочками, условия и сроки шагами и чек-лист приёмки, в котором покупатель сам отмечает, что проверил.
Подвал
Последний кусочек —
за посетителем
В тёмном подвале каждой страницы — мини-игра: интерьер, в котором не хватает одного кусочка. Его можно перетащить мышью или пальцем — он защёлкивается, картинка собирается, а вместо подсказки появляется «С нами у вас всё сложилось» и кнопки услуг и звонка. Сыграть можно на любой странице, и не один раз.
Детали
Даже ошибка —
в идее пазла
Сайт продолжается там, где обычно заканчивается оформление: на странице ошибки, в оформлении заказа, в плашке внизу страниц. Это мелочи, но по ним покупатель чувствует, что о нём подумали.
Живой сайт
Четырнадцать страниц —
одна картина
У каждой страницы своя подача, но все сложены из одних кусочков: спокойный фон, стеклянные карточки, кромки пазла и зелёный акцент. Наведите на окно — страница прокрутится, нажмите — откроется на сайте.
На телефоне
Салон —
в кармане
На телефоне — своя шапка с тёмным меню, нижняя панель с каталогом, избранным и корзиной, строка девиза. Сцена сборки на главной собирает интерьер из кусочков поменьше, фильтры каталога открываются отдельной панелью. Нажмите на телефон, чтобы остановить прокрутку.
Как шла работа
Восемь кусочков —
одна работа
Сайт собирали по частям, как пазл: от идеи и главной до каталога, заказа и телефона. Каждую часть показывали салону, и по замечаниям доводили — иногда переделывая целиком. Каталог, цены, видео шоу-рума и отзывы при этом остались на месте.
- 01ИдеяЛоготип салона — пазл, и это стало сквозной идеей сайта: интерьер собирается из кусочков, а девиз «С нами у вас всё сложится» звучит на каждой странице.
- 02УслугиПодбор, дизайн и резка — три кусочка, из которых складывается ремонт. Им отдано главное место на главной и своя страница.
- 03ГлавнаяПервый экран со сборкой интерьера при прокрутке, помещения, дизайны, видео Italon, вопросы, карта и отзывы.
- 04Шапка и подвалКомпактная капсула с меню каталога и поиском, тёмный подвал с мини-игрой и всеми адресами салона.
- 05Страницы салона«О компании», «Услуги», «Доставка», «Фабрики», «Контакты» — у каждой своя сцена в идее пазла.
- 06Каталог и магазинРазделы, коллекции, товар, поиск, избранное, сравнение и оформление заказа — в одном стиле.
- 07Спокойный стильСлоновая кость, камень и глубокий чёрный; зелёный салона оставили только акцентом — сайт стал дороже и тише.
- 08ПриёмкаКаждую страницу проверили на компьютере и телефоне и довели по замечаниям салона.
Довели на приёмке
- Первые блоки показались простыми — сделали крупные сцены вместо мелкой анимации
- Шапку в несколько строк заменили компактной капсулой
- Выступы-кусочки на карточках каталога сочли грубыми — карточки стали спокойными
- Яркий зелёный убрали с фонов и кнопок — он остался акцентом
- Блок вопросов и «Остались вопросы?» переделали — одинаковые на всех страницах
- Мини-игра доступна на каждой странице, а не один раз
- Своя страница 404 вместо стандартной ошибки
- На телефоне — тёмное меню, фильтры отдельной панелью, без лишних отступов
Сохранили
- Каталог и цены
- Видео шоу-рума
- Отзывы Яндекса
- Корзина и заказ
- Адреса страниц
- Тексты из админки
Итог
С нами у вас —
всё сложилось
Новый сайт салона АртПазл: главная со сценой сборки, капсула-шапка с меню каталога и поиском, подвал с мини-игрой, «О компании», «Услуги», «Доставка», «Фабрики», «Контакты», новости и статьи, каталог, коллекции, товар, поиск, избранное, сравнение, оформление заказа и даже страница ошибки — одной идеей и одним спокойным языком, на компьютере и на телефоне.