Мы с вами свяжемся, зададим вопросы, расскажем всё о наших процессах и дадим предварительную оценку вашего проекта
Версия сайта
2.
0.
1
Мельком о себе
Команда #enter.media входит в топ-62 агентств по разработке сайтов на платформе Tilda в России за 2024 год по версии Рейтингов Рунета. За 2024 года команда сдала 17 сайтов, из них 3 медицинских многостраничных сайта, 2 корпоративных сайта,.1 личный кабинет, 2 сайта мероприятия, 10 лендингов.
Разработка сайта-портфолио для дизайнера интерьеров
January 24, 2025
enter.media
Точка А
В апреле 2024 года к нам обратилась Анастасия Гаврюшенкова — дизайнер интерьеров жилых помещений, с задачей разработать сайт-портфолио для описания и демонстрации своих услуг и кейсов. Сайт должен быть интуитивно понятный для пользователей в стиле минимализма, чтобы подчеркнуть направление и стиль работы дизайнера. Ещё одним из пожеланий было использование ахроматических цветов в черно-белом исполнении всего сайта.
Реализация по шагам
Общая работа над проектом состояла из трёх больших этапов. Бриф, прототип и дизайн, вёрстка и настройка сайта.
Бриф
Работу над сайтом мы начали с проведения предварительного брифинга. Клиент заполнил небольшую анкету, в которой ответил на базовые вопросы, чтобы мы могли наиболее точно получить первичные пожелания. После изучения брифа мы согласовали созвон и обсудили все нюансы и этапы работы над проектом. Затем провели анализ конкурентов и выделили основные преимущества конкурентов.
Прототип и дизайн
Создание прототипа с текстовым и блочным наполнением сайта, в рамках которого мы подготовили логическую структуру блоков, добавили тексты и заглушки под фото-контент, чтобы было понятно как будет выглядеть каждый блок.
Согласовали структуру и приступили непосредственно к дизайну. В рамках дизайна подготовили несколько концептов первого экрана на выбор. После выбора клиентом понравившегося варианта, начали «преображать» прототип в полноценный дизайн-макет. В соответствии с концептом мы решили отталкиваться от логотипа, который имел прямоугольные формы. В целом направление работы Анастасии — дизайн помещений, преображающий квадратное или прямоугольное пространство во что‑то уютное и удобное. Именно поэтому мы делали все в квадратных и прямоугольных формах. В связи с этим была выбрана именно 12-колоночная сетка с симметричной композицией, в рамках которой контент занимает большую часть правой стороны экрана, а левая отводится под заголовки и разделительную направляющую.
Вёрстка и настройка.
Услуги решили вынести в поп-апы, чтобы не перегружать блок и выдавать только основную и самую важную информацию для пользователя. Проекты также увели в поп-апы. Одним из главных пожеланий клиента была возможность самостоятельно редактировать и добавлять проекты или услуги, поэтому превью кейсов мы оставили в рамках зеро-блока, а их наполнение увели в поп-ап готового блока, чтобы Анастасия могла самостоятельно добавлять и редактировать эти блоки.
Чтобы вёрстка получилась точно такой же как в макете на различных разрешениях, верстали сайт с использованием автоскейла. Это уменьшает количество брекпоинтов десктопных разрешений, что в свою очередь меньше нагружает сайт и убирает большое количество свободного места по бокам на широкоформатных разрешениях. И самое главное — нет никаких отличий от макета. Добавили ховеры на кнопки, немного лёгкой и ненавязчивой анимации блоков и заголовков, чтобы не сильно отвлекать пользователя от изучения контента, но при этом слегка «оживив» сайт и придав ему некой динамичности.
После вёрстки и согласования приступили к настройке сайта. Привязали домен, настроили формы и уведомления из них в необходимые клиенту каналы (почта, телеграм, crm тильды). Провели тесты отображения сайта на различных устройствах, разрешениях и основных браузерах — ноутбук, широкоформатный монитор, планшет, телефон на andriod и apple. Затем провели для Анастасии обучение по внесению корректировок на сайт, подготовили презентацию со скринкастом всего, что объясняли.
Итог
В конце сотрудничества получили положительный отзыв от клиента и до сих пор оказываем консультационные услуги и сопровождаем сайт.
Срок разработки: 2 недели.
Использованные инструменты: анализ конкурентов, autoscale, базовая анимация, ховеры кнопок.