Аудит сайта заказчика
В формате скринкаста разобрали сайт заказчика, и выявили основные проблемы
Первый этап | 1 день
Если коротко, мы пришли к следующим выводам: сайт визуально устарел, не отражал уровень и профессионализм компании, имел запутанную навигацию и не давал понятного представления о продуктах, обучении, клиентах и реализованных проектах.
Разработка прототипа сайта
Второй этап | 10 дней
Мы разработали новую структуру сайта и каждой страницы. Главной задачей было чётко и понятно донести информацию об услугах, чтобы посетители с первого взгляда понимали направления работы компании, легко ориентировались в навигации и могли оставить заявку на консультацию. Старый сайт недостаточно ясно раскрывал ключевые направления деятельности — консалтинг и обучение, и эту проблему нужно было устранить.
Разработка дизайн-концептов
третий этап | 4 дня
Философия бренда «Деловая Инициатива» строится на образе часового механизма — метафоре бизнеса, который после внедрения системы управления работает точно и слаженно. Этот визуальный образ сильно выражался через шестерёнки на старом сайте, и нам было важно сохранить его, но не делать главной идеей сайта: упростить ассоциацию, использовать аккуратно и добавить ощущение лёгкости. Одновременно мы обновили фирменную цветовую палитру, сделав её более приветливой и дружелюбной.
Первые варианты
Мы искали оптимальное решение и проработали несколько направлений дизайн-концептов:
• Использование видеофона на главном экране, показывающих масштабность компании.
• Лёгкий и лаконичный образ взаимосвязанных шестерёнок как метафору командной работы и движения вперёд.
• Графику, ассоциирующиеся с ростом и развитием бизнеса, выполненную в виде простых векторных иллюстраций.
• Визуальный образ поддержки бизнеса — в виде стилизованной, технологичной и современной «руки помощи».
Планёрка. Всё хорошо, но чего-то не хватает.
При обсуждении первых вариантов, пришли к выводу, что сами по себе концепты вышли хорошими, они сохраняют в себе философию бренда и визуально передают деятельность в сфере консалтинга и обучения. Но всё слишком просто и прямолинейно на первом уровне и не отражают голос и лицо компании. При этом мы осознанно не рассматривали вариант с выносом основателя центра и руководителя Макроносовой О. М. на главный экран. Для нас было важно показать, что за центром стоит не один человек, а целая команда и профессиональное сообщество.
Финальные варианты
Мы начали переосмысливать саму суть компании. «Деловая Инициатива» — это не абстрактная структура, а реальные люди и реальная работа. Это не пустые обещания, а серьёзный центр, который помогает предпринимателям выходить из сложных ситуаций и выстраивать устойчивый бизнес. За всем стоят предприниматели, проходящие непростой путь восстановления и развития, они же формируют сильное профессиональное сообщество люди, которые знакомы между собой, общаются, обмениваются опытом и остаются частью комьюнити надолго. Это узнаваемые лица города.
Так родилась идея показать этих людей. На основе этого подхода появились ещё два дизайн-концепта.
Дизайн-концепт 1
В первом варианте мы предложили показать не только логотипы компаний, но и их руководителей. За счёт эффекта быстрой смены визуалов мы хотели подчеркнуть масштаб сообщества и показать, что таких компаний и предпринимателей много, а сам центр объединяет сильных и действующих участников рынка.
Дизайн-концепт 2
В этом варианте мы сохранили идею с видеороликом юбилея компании, через который показали людей и масштаб бизнеса в формате торжественного события. Видео-контент позволял наглядно передать атмосферу, деятельность компании и её реальный масштаб.
Дизайн главной
Четвертый этап | 3 дня
Заказчик выбрал второй вариант, однако от идеи первого мы не отказались — мы доработали её, немного трансформировали и перенесли в другой блок сайта. В дизайне использовали bento-стиль и большое количество контрпространства, что добавило ощущение лёгкости. Плавные линии в виде восходящих графиков усилили ассоциацию роста бизнеса вместе с «Деловой инициативой», а образы шестерёнок отошли на второй план, оставшись фоновыми элементами в отдельных блоках.
Дизайн всех страниц
Пятый этап | 10 дней
Далее процесс шёл как по маслу. Когда есть дизайн Главной, остатется дело за малым — дизайн остальных страниц выстраивается сам по себе.
Адаптивы и подготовка к верстке
Шестой этап | 3 дня
Адаптировали дизайн всех страниц под мобильные устройства, продумали анимации и эффекты. Подготовили все материалы и техническое задание, после чего передали проект на верстку.
Верстка и оптимизация
Седьмой этап | 23 дня
Сверстали сайт. Провели работу по оптимизации изображений для быстрой загрузки и SEO-оптимизации для правильной индексации поисковиками. Реализовали анимацию и эффекты для интерактивных элементов. Ускорили загрузку страниц сайта.
Добились идеальных показателей загрузки страниц и технической оптимизации, что положительно повлияет в дальнейшем на "оценку" сайта поисковыми системами.
Данные с pagespeed.web.dev:
Тестирование. Проверка. Передача
Заключительный этап | 1 день
Тестирование сайта
Провели тестирование функциональности сайта, проверяя корректность отображения в различных браузерах, а также на мобильных платформах Android и iOS.
Проверка дизайна
Проверили итоговую верстку на предмет визуальных ошибок, сравнив десктопную и мобильную версии сайта с дизайн-макетами.
Проверка текста
Провели тщательную вычитку текста, проверили на орфографические и пунктуационные ошибки. Внесли корректировки чтобы сделать текст более продающим.
Итог
Передача заказчику
Полностью готовый сайт, выгрузили на хостинг заказчика, подключили необходимый домен, подготовили документацию по работе с админ-панелью и передали проект заказчику.
На выходе заказчик получил не просто редизайн корпоративного сайта, а новое лицо в интернет-пространстве, в понятной форме отражающее масштаб и деятельность компании, ее экспертизы и успешных проектов. Сайт сохранил в себе философию бренда, при этом стал более современным, технологичным и дружелюбным для пользователей.
Seo-продвижение сайта
после запуска
...
Работа продолжается
После запуска сайта работа над проектом не закончилась. Мы перешли к этапу SEO-продвижения: оптимизировали контент под поисковые запросы, проработали техническую часть, улучшили индексацию страниц и начали планомерную работу по росту органического трафика. Это позволило повысить видимость сайта в поисковых системах и привлечь целевую аудиторию, заинтересованную в услугах компании.
