- Год
- 2025
- Отрасль
- Дизайн интерьера
- Роль
- Корпоративный сайт с портфолио
- Стек
- Next.js, PayloadCMS
Сможем ли мы сами обновлять портфолио и получать заявки с сайта?
Да. Мы сделали сайт с разделами «Проекты», «Услуги», «О нас», «Контакты», переключателем языков и формой связи. Восемь карточек портфолио на главной поданы единообразно, вёрстка адаптивная. Вы получили доступ к админ-панели PayloadCMS (система управления контентом) и инструкцию — сможете добавлять новые работы и менять информацию без разработчика.
Что было
Портфолио из восьми проектов нужно было показать системно
Клиент — студия дизайна интерьера Buroplaces — обратился с задачей сделать сайт-визитку для демонстрации работ и приёма заявок.
На главной странице нужно было разместить восемь карточек проектов с одинаковой подачей метража, локации и названий. Мы начали с разбора того, как эти данные будут выглядеть на экранах разных размеров.
Что сделали
Собрали структуру и сделали сайт на двух языках
Мы разработали главную страницу и разделы «Проекты», «Услуги», «О нас», «Контакты», добавили переключатель русского и английского языков.
Форму связи сделали с полями «Имя», «Email / Номер телефона» и «Сообщение», чтобы обращения приходили на указанный клиентом адрес.
- Главная страница с первым экраном и кнопками на проекты и услуги
- Раздел «Проекты» с восемью карточками: название, метраж, локация
- Разделы «Услуги», «О нас» и «Контакты» с телефоном и почтой
- Переключатель русского и английского языков
- Адаптивная вёрстка под разные экраны
Сложное место
Форма должна была отправлять данные и фиксировать согласие
Сложным местом стала интеграция формы с внешним сервисом приёма заявок или почтовым сервером: данные должны уходить на указанный клиентом адрес и при этом храниться согласие на обработку персональных данных.
Мы также адаптировали восемь карточек проектов на главной, чтобы метраж, локация и названия подавались единообразно и не разъезжались на разных экранах.
Отдельно проверили корректное отображение правовых разделов — политики конфиденциальности, пользовательского соглашения и правил обработки файлов cookie.
Как запускали
Проверили на мобильных устройствах и в основных браузерах
Перед запуском мы прогнали сайт на смартфонах и планшетах, проверили открытие в основных браузерах. Нашли и поправили места, где карточки проектов или форма могли отображаться некорректно.
После проверок передали клиенту доступ к админ-панели PayloadCMS (система управления контентом) и инструкцию по обновлению портфолио, чтобы он мог добавлять новые работы без нас.
Что осталось у клиента
Клиент сам управляет портфолио и получает заявки
Студия Buroplaces получила сайт с русской и английской версиями, адаптивной вёрсткой и формой связи, которая отправляет данные на нужный адрес.
Доступ к PayloadCMS (система управления контентом) позволяет менять карточки проектов без программиста: добавлять фото, метраж, локацию и описания.
- Доступ к админ-панели PayloadCMS (система управления контентом)
- Инструкция по обновлению портфолио
- Работающая форма с полями и согласием
- Двуязычная версия сайта
- Адаптивные страницы под разные устройства
Почему такой стек
Выбрали Next.js, так как он подходит для многостраничного сайта с портфолио и позволяет удобно собирать адаптивные страницы. Для студии дизайна важна быстрая загрузка изображений, а этот фреймворк помогает оптимизировать отдачу контента.
На PayloadCMS клиент сам управляет карточками проектов: меняет фото, метраж, локацию и описания без помощи разработчиков. Это закрывает потребность в постоянной поддержке после запуска.
Сверстали страницы так, чтобы карточки проектов и форма одинаково хорошо выглядели на смартфонах, планшетах и настольных экранах. Это особенно важно для портфолио, которое часто смотрят с телефона.
Услуги из этого проекта
Разработка сайтов под ключ
Разработка сайтов под ключ: лендинги, корпоративные сайты, магазины и веб-сервисы. Форматы, сроки и цены — фиксируются в договоре.
Корпоративные сайты
Разработка корпоративного сайта: до 15 разделов, каталог услуг, блог, интеграция с CRM. Срок 3–5 недель, от 120 000…
Читайте по теме
- Серверные компоненты React: что это меняет для сайтов клиентов — Статья объясняет, как серверные компоненты Next.js ускоряют сайты с большим количеством изображений портфолио.

