Четыре вызова дизайна для БВШД: дедлайн, структура, второй подрядчик и креатив
Меня зовут Миша Розов, я основатель и Chief Design Officer дизайн-лаборатории интерфейсов Pinkman. Год назад к нам пришла Британская Высшая Школа Дизайна с задачей — сделать редизайн сайта. Для любой дизайн-студии реализовать подобный проект — стратегически важная и крутая история, тем более, что я сам выпускник БВШД.
У нас было несколько вызовов и сложностей, связанных с проектом, о которых я расскажу ниже.
БВШД – флагманская школа университета креативных индустрий Universal University в России. Основана в 2003 году. Специализируется на обучении в сферах дизайна, визуальных искусств, моды, бизнеса и маркетинга. Школа предлагает формат высшего образования, дополнительного профессионального образования, интенсивные курсы. Особенности обучения в БВШД – творческая среда, большое количество практики, международный преподавательский состав.
Задача
Сделать новый дизайн, сохранив фирменный стиль, структурировать объемы информации и предоставить ее в удобном виде, чтобы повысить посещаемость сайта.
Челлендж №1: структура сайта
Клиент сделал подробную аналитику по всему сайту, из которой выяснилось, что ⅔ сайта – мертвые страницы.
Главная проблема старой версии – отсутствие понятной внутренней структуры. Новые страницы добавлялись бессистемно, поэтому информацию невозможно было найти без прямой ссылки, что сильно влияло на конверсию. На каких-то страницах вообще была нулевая посещаемость, плюс, было сложно сориентироваться среди большого объема информации и подобрать себе курс.
Мы начали с того, что перелопатили всю структуру. В этом нам помогли две вещи. Во-первых, мы очень часто встречались с заказчиком: тесные коммуникации позволяют понять, какие есть боли и как их решить. Во-вторых, наш дизайнер пообщался с выпускниками и студентами и узнал, как они видят все со стороны.Структуру мы собирали от общего к частному, а потом уже накладывали на нее сайт.
Челлендж №2: сам дизайн
БВШД знаменита своими студентами. Когда человек говорит «Я учился в Британке» – тебе сразу понятно, чего стоит от него ожидать. Клиент хотел дизайн, который бы показывал, что они не просто академическое учебное заведение, но еще и про людей.
Нам нужно было учитывать фирменный стиль БВШД, который придумала студия Ильи Рудермана в 2015 году. Это отражения, яркая градиентная заливка и шрифт Graphik. Мы решили развить эту тему дальше – так родился динамический градиент на главной и в некоторых заголовках. Наша команда вынесла на первый план функциональность. Мы обновили систему навигации, сделали простой тест, который упрощает выбор и автоматически выводит подходящие программы.
При создании дизайна мы взяли в основу два принципа: атомарность и швейцарский стиль.
Атомарный дизайн – это система небольших элементов, атомов, которые можно использовать повторно и комбинировать друг с другом. В данном случае атомы – это самые маленькие составные интерфейса: кнопки, поля ввода, флажки, шрифт. Соединяя атомы вы получаете молекулу – более крупный объект на сайте, например, кнопку и поле ввода. Соединяя несколько молекул вы получаете крупный объект на сайте. А уже из них можно создать каркас страницы. Атомарный подход мы использовали для работы над внутренней структурой сайта: аккуратно сверстали блоки в Figma и составили из них страницы.
Швейцарский стиль пришел в веб из графики. Его основные черты – простота восприятия, контрастные цвета, шрифты без засечек, подчеркивание модульной сетки, читабельность, асимметрия, свободное пространство, абстрактные и геометрические формы без декоративных элементов. От швейцарского стиля мы взяли простоту и функциональность, шрифт как основной элемент графики, свободное пространство – «воздух» в верстке и подчеркнули модульную сетку.
Челлендж №3: время
На старте мы неверно оценили масштаб работы: ее оказалось больше, чем мы планировали. Студия не могла сделать дизайн плохо – прессинг от индустрии мотивировал выкладываться еще больше.
Да, нам удалось создать дизайн за три месяца, но команда работала на надрыве. Сейчас я понимаю, что нужно было предложить более медленный темп, который был бы комфортнее для команды.
Челлендж №4: второй подрядчик
У заказчика есть подрядчик по бэкенду, с которым он сотрудничает с 2015 года – Группа МАХАОН. На этом проекте мы работали вместе. Несмотря на плотную коммуникацию с коллегами, у нас случился фейл: МАХАОН не подключили на раннем этапе разработки сайта, поэтому мы не были в курсе некоторых нюансов. Когда наша команда показала готовый вариант, оказалось, что интегрировать его в бэкэнд нельзя. Пришлось вылезать за рамки бюджета и переделывать все в срочном режиме. Да, мы все справились и получилась отличная работа, но не скажу, что такой формат сотрудничества эффективен. Чаще всего это – головная боль для разработчиков и дизайнеров, которая чревата дополнительной оплатой.
Я сам очень горжусь сайтом, который получился. За него мы получили несколько наград: первое место в категории «Лучший сайт образовательного учреждения» на премии «Золотой сайт» в 2020 году и второе место в схожей номинации «Тэглайн».