Trend Surfers — агентство интерактивного маркетинга, суть которого — создание проектов на стыке креатива и новых технологий.
Контекст и задача
К нам обратилось агентство Trend Surfers с запросом обновить текущий сайт. Компания очень сильно выросла и вышла за рамки прошлого позиционирования: команда стала больше, проекты амбициознее, а заказчики масштабнее. Сейчас агентство работает с топами рынка, такими как: Яндекс, Авито, Сбер и VK и др.
Нам необходимо было через обновленный сайт отразить прогрессивный подход и опыт реализации больших проектов, которыми обзавелось агентство. Важно было продемонстрировать кейсы, сделать акценты на профессионализме и экспертности, а также прорывных решениях, что являются движущей силой агентства. Новый сайт должен был привлекать внимание таких же современных заказчиков.
Что не устраивало в старом сайте:
- транслирует ценности, которые уже устарели
- не отражает экспертность и инструменты для реализации сложных задач
Что мы сделали:
- Проанализировали задачу и погрузились в ДНК компании
- Сформулировали новое позиционирование
- Придумали креативные концепции
- Написали атмосферные трендовые тексты
- Отразили идеи концепции в дизайне
- Сделали адаптивную вёрстку на Тильде
Тренды начинаются с глубинного интервью
На этапе глубинного интервью мы обсудили с заказчиком более подробно цели и задачи будущего сайта, а также выявили определенные пожелания, как бы агентству хотелось «считываться» для аудитории.
Время креативных концепций
Основу для креативных концепций мы выстраивали на амбициях и прорывных идеях компании. Нельзя было не показать прогрессивные инструменты, которые определяют агентство как топовых специалистов в индустрии.
Trend Surfers первые придумывают различные механики в области интерактивного маркетинга и внедряют их на рынок, задавая планку для конкурентов в нише. К тому же, весь процесс генерируется исключительно силами инхаус команды. Собственно, каждая концепция нацелена отражать индивидуальность и инновационность агентства.
1. Большая игра
Компания выросла, и те смыслы, которые она транслировала ранее, уже стали неактуальны.
В концепции «Большая игра» мы позиционируем агентство как лидера в индустрии. Теперь компания выглядит внушительно превосходит своих конкурентов благодаря прорывным решениям и технологиям. Это дает им право громко говорить о себе.
В этой концепции мы показываем серьезность за счет отсылок к реализованным кейсам — это маркер опыта. Мы демонстрируем, как компания решает нестандартные задачи бизнеса, подчеркивая, что основная специализация — сложные проекты.
Со стороны текстов мы не закладываем большое количество информации: всё сбалансировано, как в коммуникации так и в UX-дизайне. Оформление минималистичное и светлое, внимание привлекают только необычные ховеры и анимации.
2. Трендсерферы
Изюминка этой концепции в том, что она раскрывается от спокойной презентации бренда к кульминации.
В ней мы представляем агентство как трендсеттера в своей нише — команда всегда первыми чувствуют тренды и задают их. Развитие сайта теперь напоминает саундтрек: оно начинается с интро и ведет к развязке.
Мы рассказываем эту историю с помощью визуальных решений, которые лишь слегка намекают на взрыв эмоций в конце. Как в текстах повествования, так и в дизайне, мы повышаем градус по мере того, как пользователь изучает сайт.
К тому моменту, как он спускается к презентации кейсов, сайт «разогревается» и меняет свои цвета, а также тон повествования на более смелый и дерзкий. Эта концепция является золотой серединой и балансом приёмов. Здесь каждая аудитория найдет для себя определяющие факторы принятия решений: кому-то важны ценности агентства и подход, а кому-то реализованные проекты и наличие прогрессивных инструментов.
3. Великие комбинаторы
В основу этой концепции мы заложили идею геймификации. Концепция представит сайт как фабрику, где рождаются игровые проекты. И пользователя мы тоже с первых секунд погружаем в игру, благодаря различным элементам фиксации внимания: анимациям, UX-навигации и игровым элементам.
В дизайне у нас будет «герой», который проведёт аудиторию по всему сайту — это может быть как «персонаж», так и предмет, который будет двигаться из блока в блок. Цветовая палитра будет выдержана в цветах гайдбука бренда, а анимации мы тоже настроим по фирменным элементам. И добавим всяких отсылок, как в самых настоящих играх: кубик Рубика, «крестики-нолики», игральные кости и т.д
Что выбрал клиент
«Очень жаль, что невозможно выбрать всё» — так, наверное, думает каждый, кто видит три абсолютно разных подхода к стилистике будущего сайта. Но вторая концепция вобрала в себя лучшее из двух других, поэтому была выбрана заказчиком как направление развития нового позиционирования.
Прототип и тексты
При разработке прототипа будущего сайта важно учитывать путь пользователя. Если мы можем сделать процесс изучения ресурса проще, то всегда предлагаем заказчику наилучшее решение. Так у нас появилась удобная навигация по сайту в виде отдельных страниц для кейсов, услуг, презентации компании и, конечно, блога.
Основная задача при работе с текстами для сайта заключалась в поиске баланса между дотошным ультра-профессионализмом и сумасшедшими креативными идеями. Не то чтобы это как-то противоречит друг другу, но как отразить это ёмко и стильно — вопрос. Не стоит забывать, что клиенты нашего заказчика — крупные компании. Уйдем в неформальность — потеряем серьезность, а дадим излишнюю экспертность — заскучают последователи инновационных идей.
В работе над текстами прототипа мы вдохновлялись метафорами будущего и решениями, которые меняют игру, а также нарочитой дерзостью. Получилось трендовое и яркое описание сайта, которое вобрало в себя все ключевые смыслы и идеи образа прогрессивной компании. Ну и, конечно, в процессе родился будущий слоган агентства: «В будущее — играючи».
Этап разработки дизайн-концепции и идеи
Итак, концепция «Трендсерферы», которую выбрал заказчик, подразумевала развитие от спокойной презентации к кульминации. Это означало, что мы могли себе позволить немного провокации.
Проведя с нашей креативной командой мощный мозговой штурм, мы собрали аж пять идей, в направлении которых будем развивать дизайн будущего сайта.
Идея 1: «Путешествие по 3D-мирам»
Пользователи будут перемещаться по 3D-пространству: на посетителей сайта «наезжают стены», и они проваливаются из одного блока в другой. Одним словом, это должно быть путешествие по сайту в стиле приключенческих игр, где нужно пройти сюжет до конца.
Идея 2: «Проводник по сайту»
В дизайне пользователя будет вести «проводник» — элемент, который будет взаимодействовать с блоками сайта, прыгать по плашкам и иллюстрировать путь. В кульминационный момент он проваливается в дыру, где попадает в одну из «комнат» — блоков сайта. Таким образом, пользователи перемещаются в другую часть, где меняется градус повествования и настроение.
Идея 3: «Преимущества компании как игра»
Блок преимуществ компании мы решили представить в виде четырех суперсил, которые, как в популярной игре «крестики-нолики», с помощью анимации выстраиваются в одну линию и образуют мощное победное комбо.
Идея 4: «Комната с проектами»
Блок с кейсами мы тоже решили подать нестандартно — в виде 3D-комнаты, в которой пол и стены выложены лучшими проектами агентства. Проваливаясь в эту комнату, пользователи получают возможность поизучать кейсы и заказчиков, с которыми компания работала.
Идея 5: «Прячем игровые пасхалки по сайту»
Для самых заядлых любителей игр мы хотели разместить в необычных местах еле заметные отсылки к популярным сюжетам.
«Вау, круто! Но как мы это реализуем на Тильде?»
Но даже самые амбициозные идеи разбиваются о Тильду реальность, и недовольство нашего верстальщика мы в какой-то момент поняли, что разогнали свои идеи в космос. Сайт должен быть оптимизирован под все браузеры, и подобные решения могут внести нюансы в стабильность работы. Допустить, конечно, этого было нельзя.
Было принято решение упрощать интерактивные заходы, некоторые механики и анимации, но мы боролись за каждую идею до конца, и самые оптимальные варианты в итоге вошли в финальный дизайн. Некоторые претерпели значительные изменения, а какие-то трансформировались в локальные решения.
Например, комната с кейсами всё же осталась, но перешла в 2D-реальность.
Наш «проводник» по сайту появляется в виде анимированного паттерна на некоторых блоках и подсвечивает важные смыслы. А, например, на главном экране курсор сопровождает шоурил компании.
По скроллу экрана анимированы фирменные паттерны из брендбука. Они прослеживаются где-то ярче, где-то менее заметно, но присутствуют почти в каждом блоке сайта.
Путешествие по 3D-вселенной мы также реализовали, но лишь частично. Ощущение перехода в другую реальность создается с помощью последнего элемента, который поглощает собой пространство и меняет светлую тему на темную.
Итоговая версия сайта стала значительно короче изначальной, а некоторые цветовые акценты мы чуть успокоили после фидбека заказчика.
В итоге нам удалось сохранить градус повышения настроения как в текстах повествования, так и в стилистике дизайна.
И что в итоге?
Мы получили очень крутой фидбек от заказчика: ребятам из агентства сайт очень понравился. Теперь это яркая визитная карточка компании, которая обязательно привлечет новых клиентов и пополнит копилку кейсов агентства. После запуска проект попал в подборку лучших проектов на Тильде.
Команда проекта:
Арт-директор — Мария Ищенко
Креативный директор — Елена Бобина
Руководитель проекта — Стас Гринин
Бренд-шеф — Егор Митькин
Лид-редактор — Анастасия Бобровская
Веб-дизайнер — Алёна Ильина, Полина Кондратьева
Лид-верстальщик — Илья Потапенко
