Storyland — конструктор мобильных сайтов, которые рассказывают истории

Лендинги в формате «Сторис», позволяющие завладеть вниманием читателя и «продать» ему целевое действие без лишних усилий.

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

Как «МойГород» помог придумать сторилендинги

Привет! Меня зовут Дмитрий и я хочу рассказать вам про несколько важных открытий и идей, а также про сервис «Сториленд», в котором они обрели физическую форму.

Моя бизнес-история началась в 2015 году, когда я придумал и начал успешно развивать «Мой Город» — конструктор мобильных приложений для городских порталов. Было много перипетий, взлетов, падений, и спустя 4 года наступило эмоциональное выгорание. Появилось желание продать этот проект и заняться чем-то другим.

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

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

Следующий момент озарения наступил после просмотра «Богемской рапсодии», когда я полез гуглить лирику песен Queen и нашёл страничку на которой был веб-сторис. Меня удивила реализация: сторис не в приложении, а в вебе? В голове зажглась крохотная искорка.

Она сыграла уже в начале 2019 года, занимаясь оптимизацией рекламных материалов, мы снова переверстали PDF-презентацию, но теперь в мобильный сайт в формате «Истории». Этот сайт заменил адаптивную версию нашей старой посадочной и был очень успешен: вовлечение подпрыгнуло вверх, как и процент конверсий в заявку (8,2% против прежних 4,8%).

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

Теория и механики сторилендингов

С появлением iPhone мир изменился. Десктопы проиграли смартфонам еще 4 года назад, интерфейсы и контент начали подстраиваться под вертикальную ориентацию экрана. Одним из главных локомотивов этой революции стал Instagram. Не хочу углубляться в детали, рассуждать о Snapchat и так далее. Задача у нас сейчас другая.

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

  • Есть вертикальные слайды. Разного качества, с разным информационным наполнением.
  • Если они собраны в «хайлайты» в профиле (коллекции), значит там что-то интересное и цельное.
  • Слайды переписываются по тапу по экрану или автоматически.
  • Иногда на них появляется кнопка-свайп с каким-то заманчивым предложением.

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

Это стандартная формула почти для любого рекламного материала, но у нас есть одно большое преимущество. Формат.

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

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

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

Одна проблема — все это можно провернуть только внутри Instagram, «ВКонтакте» или другой площадки, которая внедрила себе «Истории». Так было раньше, пока не появился «Сториленд».

Истории в любой точке интернета

Изначально прототип Storyland'a был сделан на технологии AMP Stories. Google придумал этот формат в 2018 году , чтобы переманить часть контент-мейкеров в свою выдачу.

По сути это картинка с наложенным поверх нее текстом и простенький слайдер.

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

При этом AMP Stories обладает очень важной возможностью — как и обычные AMP (быстро-загружаемые страницы), «Сторисы» от Google могут попадать в поисковую выдачу, причем даже отдельным блоком, занимающим достаточно большую площадь в топе.

К сожалению для нас, в российском сегменте поисковика такая возможность пока отсутствует.

Несмотря на удобство и фичи AMP Stories, было решено сделать своё собственно решение. Сейчас оно представляет из себя личный кабинет и редактор, через который создается набор слайдов внутри домена третьего уровня вида domen.storyland.mobi.

Наведите камеру телефона на QR-код, чтобы перейти на сайт.
Наведите камеру телефона на QR-код, чтобы перейти на сайт.

Редактор очень простой. Он позволяет создавать набор слайдов с автопрокруткой, а так же добавлять кликабельные кнопки, формы и текст.

Storyland — конструктор мобильных сайтов, которые рассказывают истории

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

Для кого-то это Instagram, для кого-то Google Slides, а для кого-то Microsoft PowerPoint, который благодаря функции Smart Design удивительно хорош для этой цели. Также нет никаких проблем создавать яркие и интересные сторис в специальных приложениях, прямо на мобильном телефоне. Например, в Unfold или Canva.

Редактор для слайдов можно подобрать на свой вкус
Редактор для слайдов можно подобрать на свой вкус

Кажется, что это лишнее действие и ненужная возня, но на деле это 100% win-win: автор лендинга работает в привычной ему среде, а потом в один клик загружает в Storyland, получая готовый сайт-хайлайт.

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

Кейсы

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

Запуск нового продукта или проверка гипотезы

Наведите камеру телефона на QR-код, чтобы перейти на сайт.
Наведите камеру телефона на QR-код, чтобы перейти на сайт.

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

В примере c Nimble прекрасно всё, потому что, потратив всего 30 долларов рекламного бюджета в таргете Instagram, основатели собственного автомобильного бренда Kami Motors получили предзаказов на 5,5 млн рублей на первую партию своих городских грузовиков Nimble.

При том, что команда Kami Motors это инженеры далёкие от веб-технологий и интернет-маркетинга, им потребовалось всего пара дней на создание сторилендинга и запуск на него рекламы.

Преимущества сторилендинга для запуска нового проекта:

  • Максимальная конверсия в mobile: формат Stories специально разработан для смартфонов и используется ВСЕМИ современными соцсетями. А ещё банками, службами доставки, такси, ресторанами, e-commerce и, конечно, СМИ.
  • Простейший процесс создания лендинга: сделать сайт так же просто, как сделать пост в Instagram.
  • Знакомый «с детства

    » формат: презентация (пусть и вертикальная) – это самый используемый и понятный для любого стартапера формат упаковки своего проекта.

Сбор лидов для действующего бизнеса

Наведите камеру телефона на QR-код, чтобы перейти на сайт.
Наведите камеру телефона на QR-код, чтобы перейти на сайт.

Если у вас уже есть бизнес, то вы постоянно боретесь с рынком за маржу, а значит в том числе и за стоимость привлечённого клиента. Как её снизить? Использовать самые передовые инструменты для сбора лидов. В современных соцсетях есть свои встроенные конструкторы форм захвата контактов. Но они не всегда справляются так как надо, имею ряд ограничений и замыкают на себе все данные и аналитику.

Получите в распоряжение новый инструмент для прогрева аудитории и продаж – сторилендинг.

Преимущества сторилендинга для сбора лидов:

  • Идеально для продвижения в Инстаграм: мимикрируем под соцсеть и получаем большую конверсию.
  • Недорогой дизайн уникальных слайдов: сторис-мейкеров которые сделают недорогие и красивые слайды на рынке уже пруд пруди.
  • Специально для маркетологов, агентств и фрилансеров: спецаккаунт и скидки на опт, сквозная аналитика, настройка целей и интеграция любых виджетов CRM или платформ типа GetCourse.

Резюме

Наведите камеру телефона на QR-код, чтобы перейти на сайт.
Наведите камеру телефона на QR-код, чтобы перейти на сайт.

Увидели крутую вакансию в компании, о работе в которой давно мечтали? Расскажите свою историю, которая скрывается за сухими строчками резюме. В этом как нельзя лучше поможет сторителлинговый формат наших слайдов с красочными видео и фото. Можно сделать персональный тизер-резюме для конкретной компании или общую визитку, которую будете рассылать эйчарам в сопроводительном письме. А ещё любопытнее выглядит вариант настроить таргет на такой сайт и получить входящие обращения от заинтересованных работодателей.

С резюме в формате сторилендинга вы будете:

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

И как следствие получите больше предложений о работе там, где вам интересно.

Благодаря сайту из примера я попал на собеседование к ТОПам 2х2 вообще без общения с эйчаром. Просто скинул сайт в личные сообщения директору канала в Facebook.

Онлайн-буклет для Демо дня ВТБ

Наведите камеру телефона на QR-код, чтобы перейти на сайт.
Наведите камеру телефона на QR-код, чтобы перейти на сайт.

90% посетителей конференций, выставок и других массовых мероприятий постоянно смотрят в свой смартфон, даже во время выступлений спикеров на сцене. Так почему бы не дать им контент, который будет удобно потреблять с телефона?

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

Плюсы использования сторилендинга на мероприятии:

  • Экономия денег: на печати тиража раздаточной продукции.
  • Экономия нервов: забудьте про утомительные исправления в макетах печатной продукции. Всё решается мгновенно онлайн.
  • Виральный эффект: посетителям легко делиться вашим буклетом в соцсетях и мессенджерах.
  • Интерактивность: переход по ссылкам на сайты ваших спикеров и партнёров.
  • Отслеживание действий: поддержка ретаргетинга и аналитики для дальнейшей коммуникации с аудиторией через рекламу.
  • Экологичность!

Видеовизитка для личного бренда

Наведите камеру телефона на QR-код, чтобы перейти на сайт.
Наведите камеру телефона на QR-код, чтобы перейти на сайт.

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

Мой знакомый Эдгар Давтян рассказывал мне историю своего первого приезда в США. Тогда, несмотря на его большой опыт и участие в крупных проектах в России, к нему не проявляли большого интереса в США. И когда его попросили представиться, то он решил сделать это необычным способом – за 12 часов он создал свой сайт. Сайт привлек много внимания и интереса к личности Эдгара, и он начал получать предложения о работе, сотрудничестве, партнерстве и так далее.

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

  • Вы тратите меньше времени на создание своего образа в голове у вашего нового знакомого
  • Эксклюзивность
  • Можете вставить в подпись почты, шапку профиля в соцсетях, отправлять при знакомстве с новыми людьми в чате

Инвестиционная презентация стартапа

Наведите камеру телефона на QR-код, чтобы перейти на сайт.
Наведите камеру телефона на QR-код, чтобы перейти на сайт.

Мы как elevator pitch, только на смартфоне. Чтобы выделиться из сотен и тысяч других проектов, когда всё-таки удаётся привлечь внимание инвестора, вам просто необходимо чётко бить в цель и показывать всё, на что вы способны.

  • Идеально для

    «презентации в лифте»

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

  • Идеально для мессенджеров: просмотр контента на бегу, все контакты основателей в один клик.
  • Отслеживание действий: смотрите какой слайд убивает ваши шансы на привлечения денег. Хотите, настройте ретаргетинг на своего инвестора.

Планы на будущее

На данный момент конструктор полностью боеспособен: все основные системы протестированы, отточены и работают как часы. Можно создавать сайт хоть с компьютера, хоть с телефона. Есть база шаблонов слайдов в Google Slides, так что начать можно быстро. У всех доменов автоматически подключаются SSL-сертификаты, так что требования безопасности предусмотрены. Доступно два тарифа: бесплатный FREE с ограничением в 7 слайдов и премиум BRO, который расширяет функционал. Техподдержка постоянно на связи.

В дальнейшем приоритеты такие:

  • Апгрейд редактора: драг н дроп, слои и прочая красота.
  • Квизы (интерактивные опросы).
  • Встроенный раздел аналитики со счётчиками заходов, нажатий на кнопки, заполнений форм.
  • «Визард» в 1-й сессии. Внутренние шаблоны под разные тематики с местом под текст и картинки, стили оформления шаблонов (цвета, шрифты).
  • Мобильное приложение.

Кроме этого, мы запустили англоязычную версию конструктора – Slide.page – под западные рынки, в которых пока есть свободная ниша. Для накопления и структурирования опыта зарубежного запуска мы создали Телеграм-канал, где рассказываем о своих и дружеских наблюдениях о западных рынках. Подписывайтесь, если вам тоже близка эта тема! В ближайшее время будем обсуждать вопросы организации юрлица в штате Делавэр, локализацию сервиса и техподдержки, а ещё, конечно, первые шаги для обеспечения продаж.

Как вам идея сторилендингов? Насколько перспективным видите Storyland в качестве посадочных страниц для собственного бизнеса или проекта? Поделитесь в комментариях.

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

Основные особенности можно проверить на бесплатном тарифе, но если у вас появилось желание протестировать полную версию, то мы приготовили специальный промокод «VC333», который снизит стоимость премиума с 750 до 333 рублей на первый месяц.

107107
78 комментариев

Очень интересный формат. Пойду тестить.
Реально аудитория очень хорошо реагирует на истории.

15
Ответить

Привет ExtremeCode✊🏻

8
Ответить

А при чём ExtremeCode? Они где-то упоминали об этом?

1
Ответить

Сама тема сторис отличный формат и аудитория действительно хорошо на него реагирует. Ключевой вопрос в каком контексте. Исследуя Инстаграм, или ожидая Яндекс.такси (они тоже используют сторис) это один контекст. Но вы же перекладываете развлекательный формат коротких историй на другой контекст ещё и перегружая слайды информацией (судя по вашим же примерам). Показывая сразу сторис при попадании на сайт, вы разрушаете сложившийся паттерн горизонтальной прокрутки и провоцируете стресс от необходимости ухватить представленную информацию на слайде до того, как он прокрутится. Вы лишаете пользователя чувства контроля, предлагая строго линейное взаимодействие в строго заданном порядке. Все это не мотивирует к высокой конверсии.


В то же время, обеспечив осознанный переход к формату сторис (например через «прокладку») и снизив информационную нагрузку каждого слайда, ваш продукт имеет место быть. 👍

5
Ответить

Пока тесты говорят об обратном даже на возрастной аудитории 45+, да и по статистике 74% пользователей смартфонов листают сторис хотя бы раз в неделю, так что стресса уже нет. Но про нагрузку всё верно, чем меньше текста и больше визуала – тем лучше!)

3
Ответить

Как услуга сервиса bulder - это оценят ТХ и ТП из b2b. Стартап на 5+
____
Надобность такого слайдера - хз..
1. Многие будут тупить и закроют сайт. Можно слить рекламный бюджет
2. В нишевой тематике, может и есть конверсия. Смотря откуда трафик. Надо тестить
____
Технически - это просто слайдер с активными элементами. На html 15 минут работы.

4
Ответить

Тс-с-с... не надо Диме этого знать... мы ему сказали, что полгода делали. Не палите контору, коллега.)))))

8
Ответить