S7 Space работает на относительно новом рынке, в котором не так много конкурирующих компаний. Если раньше космическая отрасль на 100% принадлежала государству, то сегодня запусками ракет занимаются и частные компании. Космос становится ближе, понятнее и доступнее.

S7 Space доверили разработку своего корпоративного сайта специалистам Digital Agency CASTCOM. Основная функция ресурса — презентация компании потенциальным клиентам. Сайт должен показывать, что S7 Space — открытый, честный и активный бизнес, который серьезно и ответственно подходит к делу.

Digital Agency CASTCOM занимались полным циклом разработки сайта. Специалисты компании:

• нашли визуальную концепцию сайта;
• разработали и согласовали дизайн страниц;
• подобрали и сконфигурировали технические решения;
• протестировали и запустили сайт.

---

Концепция

Скорость загрузки и удобство сайта — важное требование заказчика. Также необходима была поддержка большого количества мобильных устройств. Именно поэтому, при проектировании пользовательского опыта, за основу была взята концепция MobileFirst. Это значит, что изначально мы разработали визуальное представление для мобильных устройств, а затем масштабировали его для удобного доступа с полноценных компьютеров.

Визуальное оформление основано на другом простом принципе: все декоративные элементы — простые геометрические формы. Фотографии и другие сложные графические элементы используются только как часть наполнения.

Особое внимание уделили проектированию навигации. Чтобы снизить количество действий, которые пользователю необходимо предпринять для перехода на другую страницу, блоки меню разместили в верхней и нижней частях страницы. Также дополнительно было реализовано выпадающее гамбургер-меню, которое и является основным при доступе с мобильных устройств.

Блоки навигации отличаются структурой. Верхний блок содержит сокращенную версию меню для доступа к ключевым разделам сайта. Нижний и выпадающий блоки отражают полную структуру страниц.

Также большую работу UX-проектировщики, менеджер проекта и сотрудники заказчика провели над страницей «О компании». В итоге выбрана модульная концепция. Каждый блок страницы — отдельный модуль со своей задачей, который можно просматривать и редактировать отдельно. На странице «О компании» нам удалось отразить масштаб деятельности компании S7 Space, отразив структуру группы компаний, в которую она входит. Об открытости бизнеса свидетельствует размещенная на этой странице бухгалтерская отчетность, лицензии и другие документы.

---

Дизайн

Выбранная дизайн-концепция нашла следующую реализацию. Цветовая гамма состоит из трёх основных цветов: графитового, белого и фирменного салатового. Последний цвет выбран в качестве акцентного. Им отмечаются активные ссылки, заголовки, важные блоки, цифры и факты. Это и образует основу визуального языка страниц, который упрощает взаимодействие пользователей с сайтом.

Страницы условно разделены на основные и второстепенные. Для второстепенных выбран стандартный дизайн: светлый фон, темный шрифт.

Для основных страниц дизайн инвертирован. Это позволит наиболее важным страницам сайта визуально выделяться и лучше запоминаться пользователям и потенциальным клиентам. Такой выбор цветов для основных разделов, к тому же, снижает нагрузку на глаза во время чтения.

Главная страница представляет собой подобие лендинга. Он содержит всю ключевую информацию о компании и её деятельности. Однако основным решением здесь является минималистичный первый экран. Он представляет собой своеобразную визитку, на которой представлены название, логотип компании её слоган, набор эффектных изображений в слайдере и основные пункты меню. Как показало A/B-тестирование, первый экран отлично справляется с задачей создания у пользователя интереса к деятельности компании и дальнейшему изучению сайта.

 

---

 Технические решения

На момент разработки не было понимания, кто и как будет поддерживать и развивать ресурс. Именно поэтому вопрос о поиске системы управления контентом был актуален. Основные требования, которые предъявлялись к ней — безопасность, простота использования, возможность расширения. Всем этим параметрам отвечала коммерческая CMS 1С-Битрикс, которую в итоге и выбрали для создания сайта S7 Space. Ещё одним преимуществом этого решения, которого было актуально для нас, стала высокая скорость работы и оптимизация доступных компонентов.

По завершении разработки было проведено масштабное тестирование готового сайта. Нужно было проверять работу ресурса на устройствах с разными браузерами и разрешениями экрана. Чтобы систематизировать работу, была составлена матрица тестирования. По горизонтали мы расположили названия и версии поддерживаемых браузеров, по вертикали — разрешения, на которых нужно протестировать сайт. В итоге получился набор из более чем 50 сред тестирования. Эта работа была проведена не зря, так как были обнаружены баги разной степени важности, которые наши разработчики устранили ещё до запуска сайта.

---

 Что получилось в итоге:

• Главная страница. Полноценный лендинг, который даёт представление о том, чем занимается и каких успехов уже достиг заказчик. Богатое графическое наполнение создаёт интерес к деятельности компании. Три способа представления меню позволяют каждому пользователю удобно перемещаться по сайту.
• О компании. Раздел демонстрирует масштаб деятельности компании и её открытость. При помощи меню, пользователь может открыть либо полную версию этой страницы, либо отдельно ознакомиться с любым её разделом, который был бы ему интересен. Это сделано для увеличения скорости загрузки сайта.
• Пусковые услуги. Страницы этой категории сочетают в себе эффектное графическое наполнение, текстовый контент и техническую информацию. Так как это одна из ключевых страниц, её дизайн инвертирован: цвет фона стал цветом шрифта, а цвет шрифта — цветом фона. Акцентный цвет сохранён для поддержания графического единообразия.
• Миссии. Страницы этого раздела также содержат ключевую для бизнеса информацию. Это своего рода портфолио компании и её планы. Именно поэтому дизайн здесь такой же, как и раздела «Пусковые услуги». Страница с описанием конкретной завершенной миссии делится на две части. Первая — описание используемого космического аппарата. По умолчанию эта часть скрыта, но её можно открыть в 1 клик мыши. Вторая часть — описание миссии и фотографии с места запуска.
• Галерея. Этот довольно редко используемый в современном мире элемент оказался в данном случае необходим. Каждая миссия космической компании — это большое количество графического контента, который не должен пропадать в архивах. Им нужно делиться с потенциальными клиентами. Чтобы избежать беспорядка в фотографиях, для каждого события создаётся отдельная страница, на которую уже и добавляются снимки. Страница «Галерея» как раз и выводит список существующих страниц или, если угодно, папок.

В итоге получился быстрый и удобный сайт, где основное внимание притягивает оформление страниц и их содержание — графический и текстовый контент. Интернет-проект работает во всех современных браузерах. Сайтом управляет 1С-Битрикс — быстрая, масштабируемая и безопасная коммерческая CMS.

Разработка корпоративного сайта в CASTCOM (www.castcom.ru) полностью оправдала ожидания клиентов, что позволило реализовать все идеи и со стороны заказчика и со стороны исполнителя.

Авторы: Богданов Александр (Chief Development & Marketing), Кривоносов Дмитрий (ART Director), Малий Артем (Web designer & frontend developer), Каневский Игорь (Illustrator), Матущяк Валерий (Frontend developer), Еркаев Сергей (Backend developer).

Перейти на сайт