Кейсы

Сайт-визитка для дизайнера интерьера

Работа над проектом Валентины строилась из двух крупных этапов:
  • анализ структуры и дизайна ее прошлого сайта, изучение потребностей в сайте при работе
  • создание нового логотипа в связи с изменившейся фамилией, разработка нового сайта с учетом плюсов и минусов текущего
О разработке логотипа расскажу в отдельной статье. В этой — история создания сайта.
До редизайна и изменения текстов ее сайт выглядел так:
Плюсы:
Эстетичный шрифт, спокойная цветовая гамма, есть базовые блоки, необходимые для такого сайта - портфолио, отзывы, формы заявок, контакты, достаточно быстрая загрузка.

Минусы:
Особенность шрифта мешала чтению текстов, дополнительная геометрия изображений — их изучению. При этом текст не всегда доносил ценности специалиста, особенности подхода к работе не были раскрыты с первого экрана. Сайт был собран программистом, размещен на хостинге, клиентка не могла самостоятельно редактировать его, например, добавить новые работы в портфолио.
Такой сайт может быть хорошим вариантом для демонстрации примеров работ, но отсутствие четкого УТП, аргументов стало бы плохо влиять на конверсию при запуске на него рекламы.

Поэтому первым пунктом при разработки нового сайта стало написание текстов с продающими смыслами.

У меня был личный опыт изучения ниши клиента — в прошлом я архитектор, мой муж — архитектор и дизайнер интерьера. Поэтому я понимала и специфику работы Валентины, и потребности ее клиентов.
Также на этом этапе мы с клиенткой обсудили возможность масштабирования сайта, поэтому заложили в структуру модуль каталога для наполнения портфолио.
На Тильде каждая отдельная карточка товара может открываться по своей ссылке, что будет выглядеть для поисковиков как новые страницы, а значит — способствовать продвижению сайта по SEO.

1 экран сайта дизайнера интерьера

На прошлом варианте сайта были изображены примеры работ. Но при работе с человеком лично хочется увидеть того, кто будет с тобой на связи долгие месяцы, контакт глаза-в-глаза на первом экране помогает устанавливать доверие с пользователем.
Дизайн для десктопной и мобильной версии отличается, учитывает особенности устройств и паттерны изучения информации на странице:
для десктопа характерно размещение информации сверху вниз, слева направо,
для мобильной версии - сжатие текстов, чтение контента сверху вниз. Здесь мы применили анимацию печатающегося текста, сайт показывает 4 тезиса в одном месте по очереди.

На основе 1 экрана была презентована дизайн-концепция

Выше вы видите утвержденный вариант, но для рассмотрения было 2 идеи дизайн-концепции. По ним записывала клиентке видео и отправляла посмотреть обе в PDF-файле.
Такой подход позволяет выявить предпочтения, лучше понять друг друга на старте работы над дизайном, и, при необходимости — скорректировать вектор.

Именно такая структура работы — с ключевыми контрольными точками — помогает вести проекты без дополнительных платных правок. (На каждую контрольную точку заложено 3 правки, обычно мы с заказчиками вписываемся в них и не прибегаем к платным).

Следующий этап разработки сайта — дизайн-макет (и далее - сборка сайта на Tilda)

Предлагаю посмотреть на сайт сразу в собранном на Тильде виде, потому что внешне от макета он практически не отличается, плюс сразу можно увидеть, какая анимация и работа вложений в блоках предусмотрена:

Особенности технических настроек сайта, процессов, происходящих после верстки на Tilda

Практически для каждого сайта в состав работ входит:
  • Подключение уведомлений о заявках из форм
  • Настройка самих форм, привязка ссылок к "галочкам" на технические страницы, вроде Политики конфиденциальности и Оферты
  • Подключение страниц в CRM-системе Тильды (эта функция у конструктора пока входит в тариф без доплаты)
  • Подключение или перенос домена (на данном сайте был перенос)
  • Создание базы под SEO (бейджики, заголовки и описания страниц, расставление тегов H1-H3 по страницам, выпуск ssl-сертификата, настройка редиректов www и https, создание страницы 404)
У этого сайта структура позволяла создавать из каждой работы в портфолио отдельный адрес страницы, т.к. мы использовали модуль каталога, это также будет способствовать SEO-продвижению сайта.
А клиентка сможет самостоятельно дополнять сайт новыми работами по записанной видео-инструкции.
Посмотреть результат полностью можно здесь.
Если вам нужен сайт, я могу помочь составить ТЗ или ответить на вопросы о платформе, процессах разработке. Контакты для связи оставляю ниже.
Группа ВК: https://vk.com/designresource
Связь в телеграм: https://t.me/alena_v_s_i
Сайты-визитки
Made on
Tilda