Как попасть в #madeontilda. Рассказываем на примере 6 лендов от Рыбы

Лендинги Рыбы получают премии и регулярно попадают в галерею лучших проектов #madeontilda . Хотим показать красоту и рассказать, что в наших лендингах такого прикольного. Вдохновляйтесь и воплощайте идеи в своих проектах.

Чтобы сайт попал в подборку #madeontilda , у него должна быть четкая структура, аккуратный интерфейс и интересный визуал. А еще дизайнеры Тильды любят сайты с необычной версткой и удачным использованием Zero Block. Это всё у нас есть. Вот сами посмотрите.

Сайт нашей редакции «Рыба». Здесь мы продаем услуги по контент-маркетингу и курсы по копирайтингу. На сайте четкая структура — клиенты могут быстро найти то, что их интересует, и закрыть основные возражения. А еще крышесносный визуал, который очень хорошо привлекает внимание и запоминается.

За сайт редакции мы получили серебро в «Рейтинге Рунета».

Визитная карточка — яркие иллюстрации. Смотрите, какие прикольные лягуха и улитка

На странице «Карьера» рыбы куда-то тащат тираннозавра с бокалом мартини. Эту анимацию делали через Zero Block Тильды

А анимацию со злым котенком делали через код с помощью разработчика. Заходите, чтобы выпустить пар

Еще у нас есть свое «радио» РЫБА.FM — туда регулярно постим разные интересности из жизни редакции. Чтобы долго не искать страничку, добавили кликабельный радиоприемник

Сайт для компании MPCARGO, которая помогает селлерам с доставкой товаров из Китая. Здесь сразу цепляет яркий ассоциативный дизайн. Мы не побоялись использовать вырвиглазный красный цвет и иллюстрации утрированно узнаваемых образов. А еще там много интерактивных штук, которые двигаются по скроллу.

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

<p>Сделали акцент на безопасности — селлер в любой момент может отследить свой груз по номеру заказа. Вынесли эту инфу на карточку со штрихкодом </p>

<p>Придумали прикольную штуку со скидкой — при клике на лапку кота клиент получает промокод на скидку 5%</p>

Дракон вылетает на экран, чтобы рассказать про компенсацию за задержку

Лендинг-лонгрид для спецпроекта ко Дню бортпроводников. Лонгрид делали совместно с Уральскими авиалиниями. Чтобы собрать фактуру, даже встречались с представителями авиакомпании в Екатеринбурге. Наши дизайнеры придумали прикольный визуал в супергеройском стиле и отрисовали все иллюстрации. На лендинге летают самолеты, открываются и закрываются шторки иллюминаторов, багаж едет по ленте.

За этот лонгрид мы получили премию Digital Communications AWARDS 2024.

На ленде есть интерактивные элементы, которые мы делали через Zero Block. Например, стюардесса, которая по скроллу превращается в Чудо-женщину

Или иллюминаторы со шторками

Есть и более сложная анимация, которую делали через код. Например, интерактив с чемоданом, из которого можно вытягивать разные вещи

А в подвале сайта — багажная лента, по которой непрерывно едут сумки пассажиров

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

За этот конкурс получили серебро на Tagline Awards.

На первом экране сделали анимацию по скроллу. Сначала вращается и улетает астронавт, потом вылетает бутылка, а в конце ее разбивает Брюс Ли

В блоке с призами придумали, как интересно показать все ништяки. Сделали горизонтальный скролл с примеркой призов на астронавта

Правила обычно читать скучно, поэтому мы решили сделать вот такую интересную анимацию. Карточки с условиями конкурса вылетают из космического принтера

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

Лендинг для студии презентаций Presentsimple. Рассказали про новую услугу бренда — создание презентаций с помощью ИИ. На лендинге необычная структура — услуга еще не запущена, поэтому мы добавили блоки с этапами разработки продукта и СТА с листом ожидания. В дизайне ориентировались на тематику, связанную с искусственным интеллектом и фирменными цветами бренда. Получилось современно и стильно.

Когда услуга новая, не всегда понятно, чем она полезна. Именно поэтому на втором экране мы разместили ролик с презентацией продукта

Добавили блок с интерактивной демонстрацией услуги — показали, как можно будет заказать презентацию через бота

<p>Чтобы пользователи охотнее оставляли контакты для листа ожиданий, на отдельный блок вынесли этапы подготовки продукта</p>

Сделали блок с бегущей строкой — показали готовые слайды из разных презентаций. Клиенты могут оценить качество продукта

Лендинг для нашего курса «Как работать с нейросетями». Собрали на нем всю важную информацию про курс — рассказали, что будет в уроках и кому он будет полезен. Спойлер: всем, кто работает с текстами. После курса можно спокойно делегировать ИИ часть задач и не тратить время на рутину. Для лендинга выбрали яркий, но при этом легкий дизайн, который подсвечивает мысль: учиться работать с нейросетями не так уж и сложно и даже весело.

Лендинг сразу попал в #madeontilda.

Для иллюстраций сгенерировали в нейросети клевых ярких рыб. Вот таких