Mongoose Signs & Advertising

О проекте

Mongoose Signs & Advertising — это полноценный бизнес-сайт, созданный для Сергея Титова и его компании в сфере вывесок и рекламы. Цель проекта заключалась в том, чтобы превратить более 20 лет практического опыта в отрасли и большой архив выполненных работ в понятное современное онлайн-присутствие, которое объясняет услуги компании, показывает реальные проекты и направляет потенциального клиента к запросу расчёта стоимости. Сайт представляет бизнес через отдельные разделы Home, About, Services, Portfolio, Reviews, Blog и Contact. Структура услуг охватывает установку вывесок, монтаж билбордов, LED-вывески, ремонт и техническое обслуживание, брендинг автомобилей, помощь с разрешениями и другие рекламные решения. Раздел About рассказывает о профессиональном пути Сергея — от собственного бизнеса в Украине и международного опыта до нынешней работы в штате Вашингтон. На сайте также описана территория обслуживания и процесс работы от консультации до установки. Важной частью проекта является визуальное портфолио. Выполненные работы организованы по отдельным категориям: световая реклама, фасады, стелы, билборды, интерьеры, маркизы, металлические конструкции, брендинг автомобилей, баннеры, тонировка, дорожные знаки, алюминиевая реклама и покрасочные работы. Я построил портфолио так, чтобы страницы категорий загружали изображения из организованных папок проекта и постепенно показывали дополнительные работы, а не выводили весь большой архив одновременно. Это делает портфолио удобнее для просмотра и дальнейшего обслуживания. Frontend разработан на Next.js 16, React 19 и TypeScript с использованием App Router и собственного глобального CSS. Я создал повторно используемые компоненты, адаптивные desktop- и mobile-layouts, мобильное burger-меню, редактируемые SVG-элементы интерфейса и оптимизированные WebP-изображения. Дизайн адаптирован к разным размерам экрана так, чтобы фирменный стиль, основные CTA и контактная информация оставались понятными и легко доступными. Также я разработал сценарии взаимодействия для обращений клиентов. Ссылки с услуг могут передавать выбранную услугу непосредственно в форму запроса, нажатие на телефон даёт подтверждение копирования, а работа с email адаптирована отдельно для desktop и mobile. Формы контакта и отзывов подготовлены с валидацией и API-адаптерами для будущего backend, включая проверку origin, honeypot-защиту, ограничения запросов и файлов и логику rate limiting. Приложение также содержит security headers и Content Security Policy. Постоянное хранение данных форм намеренно оставлено для следующего этапа подключения backend, поэтому оно не представлено как уже завершённая функция базы данных. В проект также входят практические production-элементы: собственная страница 404, sitemap, robots-конфигурация, оптимизация изображений и подготовка к deployment. В результате получился адаптивный бизнес-сайт, который объединяет презентацию компании, информацию об услугах, большое категоризированное портфолио, сценарии отзывов и запросов на расчёт и техническую основу для дальнейшего расширения backend по мере развития бизнеса.

Моя роль

Я выполнил полный дизайн и frontend-разработку сайта: информационную архитектуру, адаптивный UI, повторно используемые компоненты Next.js, структуру услуг и портфолио, оптимизацию изображений, дизайн взаимодействия, валидацию форм и API-ready логику безопасности, технические SEO-страницы, тестирование и deployment на Vercel.

Что я сделал

• ✓Спланировал информационную архитектуру и бизнес-ориентированный путь пользователя
• ✓Разработал сайт на Next.js 16, React 19 и TypeScript с использованием App Router
• ✓Создал адаптивные desktop- и mobile-layouts с собственным глобальным CSS и burger-навигацией
• ✓Разработал страницы Home, About, Services, Portfolio, Reviews, Blog, Contact, категорий, 404, sitemap и robots
• ✓Построил портфолио на основе папок с категориями и постепенной загрузкой изображений для большого архива работ
• ✓Оптимизировал материалы портфолио в WebP и создал повторно используемые и редактируемые SVG-элементы интерфейса
• ✓Реализовал передачу выбранной услуги в контактную форму, подтверждение копирования телефона и отдельное поведение email для desktop и mobile
• ✓Подготовил формы контакта и отзывов с валидацией, проверкой origin, honeypot-защитой, лимитами запросов, ограничениями файлов и логикой rate limiting
• ✓Добавил security headers и Content Security Policy и подготовил API-адаптеры для дальнейшего backend-хранения
• ✓Протестировал проект и развернул production-ready frontend на Vercel