Дизайн-студия юно
От смарт-ТВ до IT-экосистемы: история айдентики и сайта, которые выросли вместе с рынком
Дизайн-студия юно
#Дизайн сайта#Фирменный стиль#Иллюстрации

От смарт-ТВ до IT-экосистемы: история айдентики и сайта, которые выросли вместе с рынком

77 
Дизайн-студия юно Россия, Москва
Поделиться: 0 2 0
От смарт-ТВ до IT-экосистемы: история айдентики и сайта, которые выросли вместе с рынком
Клиент

getads

Бюджет

850 000

Сфера

Маркетинг, дизайн, реклама

Регион

Россия, Москва

Сдано

Ноябрь 2024

Задача

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

На рынке они давно: стартовали в 2015 с бренда GetShopTV — сервиса, который запускал рекламу прямо на Smart TV. Для того времени это был чистый прорыв, никто такого не делал, и ребята даже собрали награды за технологию.

Дальше — больше. Один продукт вырос в полноценную экосистему: несколько сервисов для разных сегментов и задач. Сегодня getads — это уже целая платформа, которая дает маркетологам и компаниям готовые решения для продвижения и аналитики.

Решение

Многостраничный сайт стал инструментом инструментом знакомства, разъяснения, коммуникации, облегчая работу с клиентами и партнёрами.

Персонализированные точки входа для разных ролей увеличили конверсию и ускорили принятие решений.

Интеграция мини-инструментов позволила пользователям сразу оценивать возможности продукта, повышая лояльность и интерес к сервисам.

1Нащупываем концепт

Обычно на старте мы собираем мудборд — подбираем образы и приемы, чтобы поймать нужное настроение. Но в этом проекте все было чуть иначе. Мы не просто «накидывали картинки», а, можно сказать, искали конкретную «точку на карте».

Много размышляли о передаче смысла не в лоб. Что если транслировать идею через звук, ритм, повторяемость, движения, визуальные плашки? Постепенно из этих экспериментов и собиралась будущая система, где каждый элемент работает на общее ощущение от бренда.

Мы зафиксировали, что название отныне пишется с маленькой буквы — getads. Чтобы было ощущение технологичности и современной простоты, без пафоса и официоза. Для рекламщиков бренд теперь во всех смыслах «свой».

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

Цветовая палитра — теплая, с переходом от оранжевого к красному. Мы сознательно добавили немного «остроты» в лого, чтобы подчеркнуть уверенность бренда: теперь это не просто стартап, а продукт, который заявляет о себе наравне с большими игроками.

Отдельное внимание — направлению знака. Мы долго обсуждали, в какую сторону он должен смотреть. В итоге выбрали движение вправо — как знак роста, развития, и просто как метафора «больше, чем».

2Про формы

Они отсылают к экрану — символу всей индустрии видеорекламы. Мы сознательно сделали их живыми и динамичными, с легкой асимметрией. 

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

Иллюстрации мы собираем из плотных заливок и полупрозрачных градиентов. Благодаря этому они легко подстраиваются под задачу: где-то выглядят строго и технически, а где-то — легче и чуть игривее.

В одном контексте она выглядит строго и технично, в другом — становится легкой и почти игровой.

3Мерч как продолжение айдентики

Здесь все стартовало с простого запроса — придумать идеи для новогодних подарков. Так появилась серия решений на игре со словом get: get present, get wine, get happy new year, get creative. 

Надписи отсылают к жаргону внутри рекламной тусовки — и при этом остается понятной, ироничной и человечной за ее пределами.

Мы знали, что говорим с открытыми, классными людьми, у которых внутри уже существовал свой язык. Поэтому просто вплели в дизайн их сленг.  

4Прототип сайта: сначала смысл, потом форма

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

По сути, это визуальный конспект: мы берем текстовый драфт, делим его по смыслу и сразу находим решения — где будет карточка, где визуальный триггер, где кнопка, а где метафора.

Такой подход вырос из нашего опыта в UX/UI-дизайне. В приложениях важно не столько красиво оформить экраны, сколько продумать, как человек будет ими пользоваться: куда нажмет, как будет двигаться, какой сценарий пройдет. Этот же принцип мы применили и здесь.

5Важные акценты

Структура продумана до деталей: плавный переход от белого к темному, «дыхание» между блоками, графика, которая будто соединяет смыслы в единую систему. Мы внедрили мотив гравитации — линии и точки, притягивающие фокус и создающие ощущение технологичности и связности.

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

6Где мы дали себе (и пользователю) пошалить

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

Например, в блоке с калькулятором доходности мы добавили скрытую пасхалку — если кликнуть на иконку биткоина, стоимость пересчитывается в криптовалюте. А если ты нажимаешь туда, где пустая страница — появляется ¯\_(ツ)_/¯. 

7Универсальное меню под разные роли

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

При этом есть и вкладка «Всем», где показаны все решения разом — для тех, кто хочет охватить все сразу или работает на стыке ролей.

8Каждому продукту — своя точка вход

Продуктам нужна не одна общая точка входа, а несколько — ведь у каждого направления в компании есть свой руководитель и своя логика продвижения. Например, для продукта Network мы взаимодействовали с конкретным специалистом — Арминэ. Она не кидает клиенту весь сайт, ей важно направить его сразу на нужную посадочную.

Поэтому мы выстроили сайт как систему отдельных, но связанных страниц. Такой формат удобнее для аналитики и работы: можно отслеживать трафик по каждому продукту, легко использовать страницы в конференциях, QR-кодах или на стендах. Главное — это соответствует реальному сценарию: клиент сразу попадает не на общую «главную со всем подряд», а на конкретное решение под свою задачу.

Кстати, таких страниц у нас получилось аж 22.

9С визуалом, как у стриминга. И с маркетинговой воронкой

Первой мы сделали посадочную страницу для продукта getads network. Здесь мы взяли за референс визуал стриминговых платформ — Netflix, Apple TV, «Кинопоиска». Темные фоны, вспышки цвета, микроанимашки — все это связало картинку с логикой продукта и метафорой логотипа.

Главный экран работает как обложка: задает настроение и сразу показывает, что пользователь попал в нужное место. Дальше — последовательный UX: каждый блок ведет к следующему действию. Анимацию использовали только там, где она усиливает смысл, а в остальном сделали ставку на читабельность и удобство.

10Рифмуем приемы от страницы к странице

На лендинге getads monetize мы зашили в интерфейс крутую метафору — рост NPS в виде анимированной шкалы, которая заполняется до 100%. Эта строчка буквально визуализирует рост лояльности клиентов.

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

При этом мы не копируем блоки целиком. Мы повторяем приемы и ритмику — так сайт остается цельным, но его отдельные элементы не шаблонные.

11Умная генеративка вместо шаблонных кадров

Мы использовали AI-графику только там, где это реально работает на смысл. Например, фото в блоке про динамическую вставку рекламы — не стоп-кадр из чужого фильма, а созданное нейросетью изображение. Оно выглядит как сцена из жизни, вызывает нужные ассоциации и (!) не нарушает авторских прав.

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

12Минимум анимации — максимум вовлечения

Иногда достаточно одного микроэффекта, чтобы пользователь захотел взаимодействовать с блоком. Мы сознательно избегали чрезмерной анимации, но в нужных точках включали минималистичные приемы, которые «подсвечивают» нужные смыслы.

В блоке с форматами рекламы мы могли бы просто вывести список в виде баблов. Но решили адаптировать это под фирменную графическую метафору и сделать из них динамичные кнопки с формой «плашек» из логотипа.

13Красиво, полезно (а еще бесплатно): встроенные инструменты на сайте

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

Проверка громкости ролика: пользователь загружает видео и тут же получает фидбек по звуковым параметрам.

Редактор маркировки: удобный онлайн-инструмент для генерации нужных надписей к рекламным роликам.    

Такие элементы — не столь презентация, сколько точка входа в экосистему. Даже если пользователь не готов к покупке, он может что-то попробовать и остаться в поле бренда. А вот, как мы это оформили:

14Как мы встроили Telegram в воронку

Задача сайта — не сбор регистраций, а плавное перенаправление аудитории в Telegram-канал или бот. Так вот, такая подписка — не мелочь, а ключевой элемент для укрепления лояльности. Вдохновившись элегантным решением Carrot Quest, мы превратили подписку из назойливого баннера в естественную часть интерфейса.

Для этого мы разместили призыв к действию в логичных точках сайта, связав его с обсуждением проекта в боте, и деликатно повторили упоминания Telegram в других местах. Вот, посмотрите, как это выглядит в разных частях сайта:

15Работа с историей компании и микро-деталями

Одним из самых деликатных этапов стала страница «О нас». getads хотели рассказать свою историю, но не знали, как упаковать это без пафоса и воды. Мы провели ресерч, изучили, как с этим работают крупные IT-игроки. Таймлайн-структура, например, родилась под впечатлением от лаконичного решения Яндекса.

Мы предложили формат лонгрида — с фото, вехами развития, историей команды. Запросили у клиента материалы, помогли выстроить структуру и расставить смысловые акценты. 

Результат

Новый визуальный язык, логотип и фирменная система выделили getads среди конкурентов, укрепили позиционирование как технологичного B2B-игрока и подготовили платформу к масштабированию.

Комментарий агентства

Анастасия Страхова
Анастасия Страхова

Самое кайфовое в этом проекте — айдентика получилась гибкой: ее можно бесконечно масштабировать, дорабатывать и переносить на любые носители. А сайт легко обновлять и переосмысливать, оставаясь в рамках общей системы и не изобретая велосипед.

Отзыв клиента

Андрей Григорьев
Андрей Григорьев

СEО (генеральный директор)

Посещаемость сайта выросла в разы: +120 000% к просмотрам — это привлекло новых клиентов.

В 2024 году мы с Юно провели полный ребрендинг компании. Этот шаг стал фундаментом для наших дальнейших проектов. В начале 2025 мы вместе запустили новый многостаночный сайт. По результатам с февраля по июнь его посещаемость выросла в разы: +120 000% к просмотрам, +258 000% к визитам и почти +200 000% к количеству уникальных посетителей. Этот рост напрямую повлиял на узнаваемость и привлёк новых клиентов.

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

https://getads.ru/

Стек технологий


Над проектом работали:


Оцените кейс
Спасибо за оценку
Выскажите мнение
Авторизуйтесь, чтобы добавить свой комментарий.
оставить заявку

Хотите заказать похожий проект?

Дизайн-студия юно с удовольствием обсудит вашу задачу

Оставить заявку