Разработку начали с предпроектной аналитики и аудита старой версии сайта. Провели конкурентный анализ и предложили сделать на главной странице промо элемент и интерактив с возможностью для пользователя пройти тест, тем самым захватить его внимание. Для внутренних страниц разработали уникальные иллюстрации с анимацией. Информацию структурировали в блоки, вынесли важную в каждый раздел и подкрепили дополнительными страницами для более глубокого изучения.
1. Описание концепта
В основе главной странице - motion-дизайн. Пользователь видит лабораторию с 4-мя детально прорисованными планами, чтобы создавался эффект погружения. Проскролив, «пролетает» на второй план, где можно пройти тест или пропустить его, и попадает на страницу с шестью видами продукции.
Кроме основной промо-страницы на всех остальных размещены сквозные блоки, где есть возможность ознакомиться с полной информацией о компании и продуктах. Причем подвиды упорядочены, чтобы не возвращаться туда-обратно. И основной упор сделан на удобстве подачи информации.
Все страницы выполнены в едином стиле, разработаны иконки, инфографика, контент размещен по сетке. Каждый из разделов оформлен в своем оттенке цвета, чтобы юзер не потерялся.
2. Разработка прототипов
На основе предпроектной аналитики была разработана подробная структура сайта. Вся информация сгруппирована по разделам в соответствии c основными правилами юзабилити.
3. Адаптивная верстка
Сайт отлично ведет себя на мобильных устройствах благодаря адаптивной верстке и отрисованным макетам.
4. Программная разработка
В качестве системы управления был выбран 1с-Битрикс. Весь контент на сайте редактируется с помощью инфоблоков внутри админки или упрощенного текстового редактора в рамках каждой страницы.
В результате мы превзошли ожидания клиента, удивив созданной главной страницей. Сайт выигрышно смотрится на фоне конкурентов и отлично предоставляет структурированную информацию, интуитивен и понятен для пользователя.
Проведите конкурс среди участников CMS Magazine
Узнайте цены и сроки уже завтра. Это бесплатно и займет ≈5 минут.