Совы не то, чем кажутся: как мы превратили лендинг «Итоги года» в аллюзию на фильмы Дэвида Линча
20 января исполнилось бы 80 лет Дэвиду Линчу. Если вы когда-нибудь «бывали» в Твин Пиксе, то помните это тревожное ощущение, смешанное с любопытством. Оно возникает с первых нот саундтрека. Мистический, загадочный, местами непонятный сюжет, на грани яви и сна. Там у всего есть обратная сторона. А что, если создать лендинг в духе Дэвида Линча? Каким бы он получился? Мы это сделали, и приглашаем на показ.
Пролог. Особенный декабрь
В декабре у времени проявляется особое свойство, будто кто-то перематывает пленку назад. Мы подводим итоги. Но дело не в цифрах и не в сводках, хотя они, конечно, нужны, а в странном, почти физическом желании оглянуться и понять: когда, в какой день или месяц все изменилось, в какое утро ты проснулся другим?
2024-й у нас прошел под знаком трансформации. Мы провели ребрендинг, обновили логотип, пересобрали визуальную систему и коммуникацию. Звучит, как набор закрытых задач, но любой, кто хоть раз проходил через подобные изменения, знает, на самом деле это история про внутренние перемены, про взросление и становление, и про то, что форма перестает отражать содержание, и надо с этим что-то делать.
Поэтому не хотелось превращать год в сухой отчет. Появилась идея создать историю, похожую на киноленту: один кадр сменяется другим, здесь есть паузы и ускорения, а у рассказа появляется смысл, который рождается между строк.
Как итоги года стали похожи на фильм Дэвида Линча
Линч — уникальный режиссер. Он обладал талантом брать знакомое — кофе, дорогу, разговор, привычный городок — и слегка подкручивать реальность, чтобы она обрела второй слой. Линч не создает загадки, они рождаются в голове у зрителя. У этого режиссера детали — не декорации, а намеки и подсказки; паузы — не обычные, а напряженные; а незначительная, казалось бы, проходная сцена вдруг становится важнее, чем любая кульминация или плот твист.
Оказалось, это очень похоже на ребрендинг. Внешне это выглядит как смена графики, но изнутри это смена оптики: ты переизобретаешь смыслы и вместе с ними меняешь форму, в которой эти смыслы живут.
Мы хотели рассказать про наш год именно так: не «мы сделали вот это и вот это, получили столько-то наград и заняли такие-то места», а показать изнанку перемен. Ты перестал быть прежним, не испугался изменить привычное, знакомое и нашел форму, которая соответствует новому содержанию.
Поэтому наши итоги года мы представили, как маленький фильм, неспешный, атмосферный, нуарный, с игрой света и тени. Представьте ночное кафе с картины "Полуночники" художника Эдварда Хоппера, туда заходит Дейл Купер, берет кофе и вишневый пирог. История начинается.
Сюжет, спецэффекты и «съемки»
Исследование
Мы начали, как начинаем многие проекты, с ресерча. Нас интересовали не референсы сами по себе, мы хотели понять, как коллеги подводят итоги года, как много в этом реальных фактов и сколько безликого корпоративного шума. Сразу заметили одну вещь: чаще всего итоги года — просто набор фактов, о сторителлинге никто не думает, это отчет для галочки. Так мы поняли, что нужно найти баланс: в нашей истории должны быть достижения и факты, но они — не главное, важно показать рост, который произошел.
У нас смешанная аудитория: клиенты, коллеги по индустрии, люди, которым нравится наше творчество. Поэтому мы решили: да, факты нужны. Но они будут вплетены в повествование, как удачные реплики или та самая музыка в момент саспенса — точечно и в нужный момент. Мы хотели, чтобы текст и визуал работали вместе, как сюжет и музыка в кино: один элемент отвечает за смысл происходящего на экране, второй создает эмоции.
Горизонтальная прокрутка как пленка времени
Стандартные варианты изложения нам не подходили. То, что мы хотели передать, было в сфере эмоций, а не окошек и кнопочек: наш внутренний темп перемен, моменты сомнений, паузы. И тогда родилось решение — показать год с помощью горизонтального скролла. Не сверху вниз, а слева направо, словно просматриваешь кадры старой пленки. Этот формат ближе к монтажу: ты не скроллишь страницу, а движешься по коридору времени, и в этом движении есть ритм, есть ускорения, есть замедления, есть те самые склейки, после которых вдруг замечаешь, что находишься внутри новой сцены.
Иллюстрации-символы
Когда мы нащупали стиль, стало ясно, что одной эстетики ретровейва недостаточно. Хотелось не просто «красиво», а так, чтобы внутри этой красоты рождалась вторая реальность, проглядывал второй слой, тот самый, линчевский. Было важно создать ощущение, что у каждой детали есть смысл, даже если он угадывался не сразу.
Поэтому в каких-то иллюстрациях есть прямые намеки. Например, молодой человек с узким галстуком и в белой рубашке — прямой намек на агента Купера. А мечтательная девушка, которая смотрит в окно, — собирательный образ всех женщин, окружающих персонажа в сериале «Твин Пикс».
Но обратите внимание на детали. Рукава рубашки закатаны, и под ними проступают татуировки, герой не тот, кем кажется (как те самые совы). Он не офисный клерк, он творческий человек, мечтатель. В окне, куда смотрит девушка, и обычный город, и пальмы. Сложно понять, где на самом деле она живет, где реальность, а где мечты. Силуэт мужчины имеет необычную тень — он играет на гитаре. Кто знает, в душе, в мечтах, или это его второе Я. А финальная иллюстрация — силуэт человека, идущего к солнцу, напрямую показывает разделение реальностей, переход от тени к свету, шаг навстречу неизвестному, там впереди будущее и оно точно несет что-то хорошее.
В этих иллюстрациях мы хотели показать себя. Наша команда — это люди, которые могут казаться простыми и непринужденными, но у каждого богатый внутренний мир. Именно это позволяет нам конструировать удивительные миры, находить новые ассоциации для привычных образов, создавать яркие эмоции. Это наш второй слой.
Дизайн как история
В какой-то момент мы сформулировали для себя простую ось, вокруг которой и построили весь сценарий: мы стали другими, но сохранили незаурядный взгляд, внутри у нас по-прежнему творческая душа. Придумать легко, а сделать так, чтобы это прочувствовал пользователь, намного сложнее.
Поэтому мы выбрали интерфейсное решение, в которое вплели иллюстрации. На некоторых страницах прописали новые смыслы, на других показали обновленную айдентику. Это история, и она построена так, чтобы зритель проживал изменения как последовательность сцен.
Иллюстрации стали одним из ключевых выразительных средств: простые формы, плавные линии, но внутри намек, напряжение, диалог со зрителем, приглашение увидеть больше, чем видно. Мы вдохновлялись атмосферой городка Твин Пикс. За его красотой и умиротворенностью чувствуется что-то еще, необъяснимое, скрытое, как будто мир слегка смещен.
Шрифты выбрали разные по характеру, в поддержку этой двойственности. Один — современный, рациональный; другой — кинематографичный, похожий на те, что используют в титрах. Вместе они создают нужный контраст: разум и интуиция, структура и эмоция, реальность и сон.
Палитра подчеркнула трансформацию. Черный и белый остались как база. Clair Obscur, свет и тень, тот скелет, без которого все развалилось бы. Но акцентные цвета стали глубже: меньше резких неоновых вспышек, больше благородных ночных тонов — сине-фиолетовый, розово-оранжевый, цвета заката и наступающей ночи, а может, цвета угасающей ночи и зарождающегося рассвета?...
Плавные анимации
Нам хотелось, чтобы история была живой, но мы сразу договорились о сдержанных анимациях. В линчевской интонации вообще нет места демонстративным и пафосным спецэффектам, всему свое место и время. Важно, чтобы страница ощущалась легкой, а движения работали как монтажные склейки: чуть сдвинулась форма, чуть поменялась диагональ, чуть изменился темп, и вот ты уже в другой сцене, даже если не заметил, как именно произошло переключение.
Движение фигур по горизонтали и по диагонали мы задумывали почти как бессознательные переходы. Вместо «смотрите, какой вау-эффект», хотелось добавить — «вы чувствуете, что история сместилась». Нам важно было погрузить зрителя внутрь. Как в кино, где сначала ты наблюдаешь, а потом начинаешь думать и действовать вместе с героями.
Техническая сторона
Мы поставили перед собой простую задачу: сделать быстрое, легкое решение без избыточной нагрузки. Фронтенд собрали на HTML/CSS/JS, чтобы обеспечить плавные микроанимации, привязанные к горизонтальному скроллу. Для анимации иллюстраций использовали SVG-подход и инструменты, которые позволяют оживлять элементы без тяжелых моушн-редакторов, нам нужна была тонкая режиссура движения. Разработка заняла две недели, а весь процесс создания проекта (от идеи до реализации) около двух месяцев, потому что ритм и тональность в таких историях настраиваются дольше, чем пишется код.
Результат: когда финал становится началом
Пока мы делали сайт для итогов года, неожиданно сами прошли еще один круг саморефлексии: спорили, смеялись, обсуждали, возвращались к формулировкам, пересобирали смыслы и заново понимали, что именно было самым важным в уходящем году. Это тот редкий проект, где мы не боялись быть собой: уязвимыми, чуть странными, слишком внимательными к деталям.
Мы добавили ссылку на «Итоги года» в шапку основного сайта и во время праздничных каникул зафиксировали 2000+ посещений. Но важнее была реакция. Люди говорили, что им понравилась наша история, живая, с внутренним ритмом, такая история, в которой каждый узнает что-то свое: магию творчества, выход на новый уровень, внутреннее взросление, тягу к тому, что находится за рамкой рационального.
Пожалуй, это и была наша цель: поймать баланс между бизнесом и творчеством, не изменяя нашему кредо — дизайн как искусство.
Итоги года — это всегда подведение черты. Мы смотрим назад, чтобы понять, что получилось, что нет, что требует работы и трансформации. Но для нас важно не просто зафиксировать события — мы создаем историю, визуально и эмоционально совершенную.
Это тот редкий проект, в котором можно не бояться быть настоящими, открытыми, немного безумными, немного творческими. Что же касается референсов для дизайна, то Дэвид Линч — мой личный источник вдохновения. В детстве его фильмы и сериалы, включая «Твин Пикс», потрясли меня. Они были загадочны, полны смыслов, но главное — они были невероятно красивыми.
При этом я люблю эстетику западной культуры 70–80-х и нуарные фильмы, где эмоции настоящие и герои не прячутся за словами, а действуют. Дизайн «Итогов года» — это отражение нас самих. Честный, искренний, полный визуальных и смысловых отсылок к тому, что нас вдохновляет.