Как мы провели рестайлинг и разработали корпоративный сайт для группы «Иннотех»
Рассказываем о том, как мы обновили бренд и сделали новый корпоративный сайт для «Иннотеха».
О компании
Группа «Иннотех» — современная быстроразвивающаяся ИТ-компания, разрабатывающая инновационные решения по цифровизации банковского бизнеса. Команда помогает компаниям финансового сектора на пути цифровой трансформации, предлагая им комплексные решения для фронт- и бэк-офисов, современные финтех-продукты и системы работы с big data.
Энергичная молодая команда начала свою работу в 2020 году и всего за два года выросла до уровня большой высокотехнологичной компании со штатом более 10000 сотрудников. Это потребовало от бренда изменений в собственном позиционировании.
К нам «Иннотех» обратился за обновлением айдентики и разработкой корпоративного сайта.
Какая была задача, и как мы ее решали
У команды «Иннотеха» уже было сформировано представление о собственном бренде. Образ компании строился на идеях инновационности, гибкости и эффективности. Их, к примеру, выражает фирменный знак. Две точки и тире — отсылка к телеграфу и азбуке Морзе, символам технологического прогресса, в котором теперь активно участвует и сам «Иннотех». Кроме того, за все время своей работы компания успела определить собственный визуальный стиль и не хотела сильно от него отдаляться. Наша задача состояла в рестайлинге бренда.
Обновленная айдентика должна была отразить несколько вещей. С одной стороны, хотелось, чтобы она помогла «Иннотеху» заявить о себе как о крупном бизнес-партнере и показать серьезность компании, ее намерений, подходов и взглядов на будущее финтеха. Вместе с этим, для нас было важно сохранить характер энергичной молодой компании и подчеркнуть адаптивность и инновационность нашей работы.
Для того, чтобы определить сильные и слабые стороны существующей айдентики и понять, в каких доработках нуждается бренд, мы вместе с командой «Иннотеха» провели подробный дизайн-аудит.
К каким выводам мы пришли, и что нужно было сделать:
Сохранив преемственность с предыдущим стилем, скорректировать образ компании: из молодого hr-бренда в серьезного b2b-игрока;
- Систематизировать все элементы визуального языка, чтобы сделать его более консистентным и упорядоченным;
- Одного образа из логотипа было недостаточно для того, чтобы сформировать визуальный язык. Была нужна четко сформулированная идея стиля, которая помогла бы объединить вокруг себя все элементы айдентики и сохранить при этом то, что команда хотела оставить без изменений;
- Для создания современной айдентики требовалась детальная проработка типографики и 3D-иллюстраций;
- Разработать моушен-язык, органично вписав его в общую концепцию бренда;
- Чтобы сократить объемы арт-дирекшна, нужно было подготовить систему гайдов, которая решила бы проблему генерации фирменной графики и дала бы дизайнерам больше рабочих шаблонов.
Что мы изменили
Основной образ, на котором основывался фирменный стиль компании, — ее логотип. Команда «Иннотеха» попросила оставить его нетронутым, но вместе с этим знак нуждался в реконцептуализации.
После исследований рынка и обсуждений с командой ONY стало понятно, что не стоит делать такой большой акцент на азбуке Морзе и нужна дополнительная идея. Требовалась метафора, которая, с одной стороны, помогла бы нам сохранить логотип и при этом не несла бы образность азбуки Морзе в элементы фирменного стиля.
Мы разработали фирменную 3D-графику, визуально развивающую философию компании, в основе которой лежит идея скорости. Это метафоричный образ импульса и светящегося энергетического потока. Он органично поддерживает мотив ускорения, который также можно обнаружить и в логотипе. Это помогло прийти к новому прочтению фирменного знака и отойти от темы кодировки. Теперь знак «Иннотеха» — это не только язык азбуки Морзе, но и метафора движения, точка, переходящая в стремительный поток энергии. Этот переход мы показали в промо-ролике компании. Новая графика придала айдентике недостающего движения и динамики, помогла оживить стиль бренда и лучше вписать его в диджитал-среду.
Помимо основной 3D-иллюстрации мы создали несколько наборов иконок, предназначенных для внешних коммуникаций компании. Они так же поддерживают идею движения и помогают сформировать фирменную материальность бренда, что делает айдентику более целостной, чистой и технологичной.
Крупная типографика — один из центральных элементов фирменного стиля «Иннотеха». Базовый, расслабленный, с большими отступами — для такого типа акцидентного шрифта требовалась более плотная сборка. Выбранный нами шрифт Cofo Kak Black — более собранный, сбалансированный и напряженный, чем предыдущий — придал большей смелости и дерзости поведению типографики. В контраст такому жирному и широкому начертанию стоит тонкая линейная графика объектов и шрифт Inter, который остался в наследство от старой айдентики компании.
Цветовая палитра была еще одной важной частью визуального языка, требующей доработки. Она уже была удачно подобрана, но в ее применении не хватало порядка. Мы подкорректировали и сузили цветовой набор. Синий так и остался в центре стиля, но частично ушел белый цвет, а полностью — черный и некоторые дополнительные. Теперь на их месте серый, темно-синий, светло-голубой и акцентный салатовый. Благодаря этому решению удалось прийти к большей консистентности и системности палитры и передать новый серьезный бизнес-тон бренда.
Носители и гайдлайн
Обновленная айдентика должна была работать в большом числе коммуникационных сценариев. Под визуальный язык нужно было адаптировать множество разных носителей, которые «Иннотех» использует как в диджитале, так и в оффлайне на различных конференциях и мероприятиях.
Было важно, чтобы стиль был достаточно гибким, чтобы закрывать различные задачи, с которыми мы встречаемся, а также иметь возможность малыми средствами создавать фирменный материал, поддерживать узнаваемость бренда и делать это применительно к совершенно разным ситуациям.
Также мы проработали подробный гайдлайн, который, учитывая все возможные форматы и сценарии коммуникаций, объясняет, как работать со стилем и какими дизайн-решениями пользоваться.
Эта систематизация дала четкое понимание всего рабочего процесса и, вместе с этим, оставила пространство для развития и поиска новых решений.
Так, сохранив преемственность с первоначальной айдентикой, мы предложили гибкую дизайн-систему, которая отвечает потребностям компании и способна развиваться вместе с ней.
Корпоративный сайт: как работает стиль
Основной диджитал-носитель фирменного стиля «Иннотеха» — корпоративный сайт компании, разработкой которого мы занимались. Его задача так же состояла в поддержании образа бренда, сочетающего в себе серьезность высокотехнологичной компании и энергичность стартапа.
- Тонкие строки, верстка по левому краю, педантичная расстановка всех дизайн-элементов, унифицированные цвета — все эти решения передают ощущение строгости и упорядоченности;
- Вместе с этим, в дизайне используются мощные заголовки с крупной типографикой, активная фирменная графика на фоне, а также редкие композиционные решения, которые идут вразрез строгой верстке. Некоторые элементы выглядят нарочито интерфейсными — к примеру, мы использовали поп-ап блоки, смещающие основной контент сайта и придающие иммерсивности пользовательскому опыту. Это помогло сделать акцент на энергичном и инновационном характере бренда.
Поскольку сайт включает в себя множество разделов со своей индивидуальной структурой и элементами, мы уделили особое внимание разработке UI-кита и дизайн-системы в целом. Так, благодаря продуманной библиотеке компонентов, мы смогли сэкономить время на сборке типовых страниц и детальнее погрузиться в поиск наиболее оптимальных решений
Технические решения
Сайт компании должен был стать одним из основных каналов взаимодействия с клиентами, партнерами и индустрией в целом. Через сайт компания планировала рассказывать о своих продуктах и решениях, отражать стратегию и планы дальнейшего развития. С этими задачами успешно справляются главная страница сайта, разделы «Продукты» и «О компании».
Предполагалось также, что сайт станет продающим инструментом, средством привлечения новых клиентов и партнеров. Для этого была разработана система лидогенерирующих форм, с помощью которой пользователь может оставить свои контакты в любой удобный момент.
«Иннотех» не только размещает на сайте информацию о своих продуктах и решениях, но и делится информацией о деятельности компании через новости и пресс-релизы. Поэтому отдельное внимание мы уделили систематизации информационного контента компании и создали раздел «Ресурсы», поделенный на группы контента: «Новости», «Признание отрасли», куда вошла информация о наградах, упоминаниях в СМИ и аналитических отчетах. Также в этот раздел входит большой блок «Мероприятия», направленный на поддержку участия компании в выставках, форумах и конференциях. Нам удалось разработать гибкую модульную структуру, которая позволила закрыть разные потребности и задачи этих групп. В админ-панели был добавлен блочный конструктор для этих материалов, благодаря чему команда «Иннотеха» может делать страницы контента более разнообразными.
В результате вместе с командой «Иннотеха» мы разработали корпоративный сайт, который успешно решает задачи как бизнеса, так и пользователя.
В работе участвовали:
Команда «Иннотеха»
Дизайн:
Алексей Голованов – арт-директор
- Дарья Шкрунина – руководитель отдела графического дизайна
- Данила Городилов – руководитель отдела дизайна презентаций
- Павел Моисеенко – ведущий диджитал-дизайнер
Маркетинг:
Юля Пославская – директор по маркетингу
- Кирилл Дердерчук – руководитель отдела цифрового маркетинга
- Оксана Кикоть – руководитель отдела по связям с общественностью
Команда ONY
Брендинг:
Линда Косичкина – арт-директор
- Макс Сойфер – арт-директор
- Андрей Иляскин – арт-директор
Карина Язылян – дизайнер
- Саша Шмелев – дизайнер
Костя Симонов – CG-дизайнер
- Степа Картышов – CG-дизайнер
- Аня Шульгина - продюсер
Диджитал:
Миша Питерский – арт-директор
- Денис Моисеев – арт-директор
- Саша Бойченко – UX/UI дизайнер
- Оля Моисеева – продюсер
- Оля Ибрагимова – продюсер
Комментарий недоступен
как вариант, они занимаются гаданием кого первого уволят на фоне увольнения с крупных мировых фирм
а потом люди удивляются почему так много сокращений