Группа компаний Oilborn

Задачи и концепция

Сайт для группы компаний “OilBorn”, которая занимается разработкой и внедрением новых технологий в нефтегазовый сектор в сотрудничестве с корпорацией “Nissan Chemical” (Япония). Международная команда состоит из инженеров-нефтяников и специалистов в сфере коллоидной химии. Она занимается разработками, которые повышают эффективность нефтегазового сектора. Наша задача состояла в том, чтобы создать виртуальное представительство ГК, рассказав о её участниках и направлениях её деятельности.
Задача

Создание многостраничного сайта с описанием компаний-участников группы, их разработок, сферы их применения и их преимуществ (на русском и английском языках).

Решение

Проведя анализ ниши, в которой работает “OilBorn”, мы разработали сайт, на котором в лаконичной и доступной форме представлена вся необходимая информация о её участниках и её разработках. Для того, чтобы пользователям было проще воспринимать эту информацию, была разработана инфографика по теме разработки месторождений и максимально простое меню.

Этапы
  • UX-дизайн
  • Проектирование и дизайн
  • Desktop- & Mobile-версии
  • Анимация
  • Разработка конфигуратора
  • Работа с контентом
  • Тестирование и релиз

Дизайн

Дизайн сайта основан на направлении, в котором работает “OilBorn”. Он очень сдержан и не содержит в себе декоративных излишеств. Для оформления использовано три цвета: чёрный и серый – в качестве основных, и жёлтый – для расстановки акцентов и обозначения активных вкладок.

Минимальное количество графики делает сайт лёгким, и не только для восприятия. В то же время, благодаря ярким акцентам, пользователь знает, куда направить своё внимание в первую очередь, и быстро ориентируется на сайте.

22 уникальных блока
40 состояний и поп-апов
3 размера экрана

Типографика и цветовая схема

Montserrat
  • Ab
  • Black
  • Bold
  • Ab
  • Regular
  • Light
  • #020202
  • #D8D8D8
  • #FFE90C

Группы проектов

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

Другая версия сайта

Наши клиенты имеют возможности для выбора. Мы создаём сразу несколько вариантов оформления, из которых они выбирают тот, который будет реализован. В данном случае была выбрана версия, взглянув на которую пользователь бы сразу понял, что речь идёт не просто о разработке месторождений, а об инновациях в этой области.

Результат

Пользователь может переключаться между проектами легко и не путаясь, благодаря выделению жёлтым цветом.

На странице каждого проекта представлена ключевая информация о предлагаемом решении и преимуществах его использования.

Mobile версия

Конфигурация главной страницы несколько изменена, но выглядит не менее привлекательно. Функциональная и визуальная составляющие сохранены в полной мере.
Mobile first

Мы учли опыт взаимодействия пользователей с сайтом на мобильных устройствах и позаботились о том, чтобы он был положительным.

Планшет

Все идеи, реализованные в основной версии, были перенесены в мобильную без потерь. Наглядность и удобство использования доступны и в таком формате.

Прототипы

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

Компьютер

Прототипы страниц проекта Группа компаний Oilborn
Прототипы страниц проекта Группа компаний Oilborn

Планшет

Прототипы страниц проекта Группа компаний Oilborn
Прототипы страниц проекта Группа компаний Oilborn
Прототипы страниц проекта Группа компаний Oilborn

Мобильная версия

Прототипы страниц проекта Группа компаний Oilborn
Прототипы страниц проекта Группа компаний Oilborn
Прототипы страниц проекта Группа компаний Oilborn
Прототипы страниц проекта Группа компаний Oilborn

Нужна сильная команда?

Следующий проект

Смотреть проект
Facade Library