Попали в ловушку трендов? Зачем команде суровых разработчиков сайт как из Pinterest
У команды RocketDev интересная судьба. Она начинала как подразделение SEO-агентства Rocket Business, специализировалась на техподдержке. Когда пошли запросы на разработку сложных сервисов, было принято решение сделать из RocketDev полноценное агентство web-продкшена.
Сегодня это большая команда амбициозных и талантливых разработчиков, тестировщиков, дизайнеров и проджектов, которая любит свою работу и делает ее хорошо. Разумеется, этим героям нужен крутой, конкурентноспособный сайт, отражающий их ценности.
Передаем слово RocketDev. В этой статье они расскажут, как своими силами создали сайт по последним трендам разработки и веб-дизайна.
Каким мы видели наш сайт? Турбоскоростным и космически красивым. Чтобы в каждой линии, иконке, блоке отражался наш профессионализм.
Перед разработкой дизайн-концепции мы выделили 3 ключевые функции сайта:
1. Знакомить клиента с полным спектром услуг и форматами работы. RocketDev специализируется на разработке, техподдержке и аутстаффинге.
2. Отражать наши корпоративные ценности. RocketDev — это про решение дизайнерских и технических проблем «под ключ», фокус на качестве и результате, общение на понятном для клиента языке. А еще про полную прозрачность — клиент всегда на связи с командой и может отслеживать эффективность работы с помощью нашего внутреннего сервиса «Монитор».
3. Оставлять положительное впечатление о RocketDev. Оформление и функционал сайта формируют имидж команды в глазах клиента — работает с анимационным дизайном, разрабатывает сайты на современных фреймворках, создает продукт под маркетинговые задачи клиентов.
В глазах клиентов мы выступаем надежным партнером, который может решить любую задачу — от создания сайта до его технического обслуживания, а также усиления действующей команды.
Мешает ли разработка собственного сайта рабочему процессу?
Нет, если грамотно распределить время и установить строгие дедлайны. Для разработки rocketdev.pro была выделена отдельная команда, в которую курировали руководители и ведущие специалисты. У нас был четкий порядок работы с каждой задачей:
- Составление технического задания.
- Отрисовка концепции страницы.
- Несколько этапов согласования и доработок.
- Верстка макета.
- Размещение готовой страницы на Dev.
- Тестирование.
- Правки кода и завершение задачи.
Такой алгоритм помог нам правильно распределить силы и творить без ущерба клиентским проектам. Уложились в три месяца, четвертый оставили на минимальные доработки.
Дизайн со смыслом
Команда состоит из специалистов разного возраста. Кто-то из них в сфере уже более 10 лет, а кто-то является представителем «новой волны». Поэтому решили, что внешний вид сайта должен быть сдержанным, но с долей креатива.
Главную страницу дополнили блоками, через которые пользователь может перейти в основные разделы. Курсор сопровождает дополнительный декоративный элемент, а блоки автоматически выделяются цветом или контуром — это хорошо работает на вовлечение аудитории.
Каждый элемент в блоке с технологическим стеком кликабельный. Нажимая на него, пользователь получает подробное описание фреймворка.
Разделы внутри сайта оформили более лаконично, чтобы пользователя ничего не отвлекало от выбора услуги.
Дизайн на rocketdev.pro создавался не только ради привлекательной картинки. Нашей целью было доступно показать специфику направления. На страницах мы сделали яркие Lottie-анимации, которые отражают главные принципы агентства — прозрачность, качество и адаптивность.
Раздел, от которого веет надежностью
Мы выступаем за полную прозрачность не только в нашей работе, но и в коммуникации с клиентом. И уверены, что клиенты быстрее принимают решение об услуге, если точно знают, кто ее будет оказывать.
Практика показывает, что галерея с качественными фото сотрудников — один из самых вовлекающих элементов интерфейса. Поэтому на RocketDev разработали свою версию этого блока, где также разместили характеристику на каждого члена команды.
Раздел «О нас» решает сразу несколько важных задач — от формирования доверия клиента к агентству до повышения вовлеченности пользователей. Время, проведенное на сайте, увеличивается в несколько раз.
Разработка и SEO
Сайт сверстали на последних версиях фреймворков Next.js 15 и React 19. Поправка: разработку мы начали на предыдущих версиях. Но, услышав новости о релизах, бросаем все, погружаемся в документацию и оперативно обновляемся. Параллельно подключаем более современный сборщик TurboPack. Пришлось внести изменения в код, но зато такой стек значительно ускорил процесс — теперь страницы в режиме разработки загружаются практически с той же скоростью, что и в продакшене.
Безумна ли наша затея? Ну да, безумна — ведь версии 100% будут дорабатываться. Но это был наш шанс первыми опробовать обновления, а когда мы их протестируем вдоль и поперек — сможем предлагать этот стек клиентам.
Что еще использовали?
● Headless CMS — Strapi;
● формат обмена данными — JSON;
● библиотека для создания форм — Formik;
● библиотеки для работы с анимациями — Framer Motion, Lenis;
● CSS Modules.
Чтобы контент легко распознавался поисковыми роботами, использовали React Server Components. Страницы быстро попадают в индекс, сайт хорошо ранжируется в поисковиках. Выбор фреймворка и внедрение обновлений позволили нам добиться быстрой загрузки сайта.
Щепотка маркетинга
Разработка и техподдержка — это всегда четко и по делу. Поэтому мы отошли от идеи развернутых и больших кейсов. Главный принцип: минимум текста — максимум пользы. По этому же принципу мы оформляли страницы. На сайте вы не встретите разделов с лишним контентом.
На сайт web-продакшена заходят люди с конкретными запросами. Чтобы максимально адаптировать под них страницы услуг, мы подключили маркетолога. На основе анализа конкурентов разработали оптимальную воронку: УТП —> знакомство со стеком —> изучение цен —> выбор формата работы —> чтение отзывов —> заполнение брифа.
Информация разделена на блоки, в каждом из которых прописаны преимущества для клиента — минимизируем количество возражений. Шаг за шагом пользователь идет по странице и получает положительное впечатление о команде. Если решение принято быстро — перейти к заполнению брифа можно практически из любой «точки» сайта.
Оцениваем результаты
У нас получился интуитивно понятный и функциональный сайт, который с первых касаний доносит до пользователя позиционирование агентства. Визуальные решения не отвлекают потенциальных клиентов от их цели — изучить портфолио и принять решение об отправке заявки.
За год работы сайта мы добились роста основных метрик. Трафик стабильно высокий, все услуги востребованы, в работе несколько проектов с известными компаниями-гигантами. Сегодня мы продолжаем совершенствовать функционал, добавлять новые кейсы и масштабировать наш технологический стек. Сайт не боится изменений — при необходимости можно быстро заменить действующие элементы или даже провести полный редизайн.
