Как быстро и без страданий сделать главную страницу сайта — MVP-подход
MVP в разработке позиционирования стартапа — на примере Serpstat Три года назад я стал CEO стартапа Serpstat и у меня оказалось всего две недели, чтобы качественно переделать главную сервиса и на время закрыть этот вопрос. Тогда я придумал метод, о котором сейчас хочу рассказать. Это бoмж-подход — фирменная разработка внутри Netpeak Group, эдакое MVP в мире дизайна сайтов: как все сделать «быстро, дешево, эффективно». Такие MVP важны не только в дизайне — первую статью о бoмж-подходе я посвятил
Призываю ли я делать именно так? Нет, конечно. Делайте правильно, как положено. Размещение блоков на главной — важное дело, но я считаю, что если CEO стартапа тратит на это уйму времени вместо работы над самим продуктом и его качеством, SaaS не будет работать в плюс. При этом в зрелых проектах, таких как агентство Netpeak, мы можем выделить время на длительные митинги и обсуждения для формирования техзадания по обновлению страниц сайта компании.
Вскоре после того как Prodvigator стал Serpstat, появилась проблема, с которой сталкиваются многие молодые проекты: сайт требовал существенных доработок, визуальных и функциональных. Сейчас, конечно, наша главная страница разработана профессиональными дизайнерами, но тогда мы столкнулись с необходимостью все сделать оперативно и качественно, чтоб спокойно сконцентрироваться на работе над продуктом.
Я в деле уже почти 15 лет и по опыту знаю: единственный метод все сделать быстро и без потерь месяцев на коммуникацию с дизайнером и программистом — составить одно большое, внятное техзадание, включающее в себя и дизайн, и контент сайта. Надо полностью продумать посадочную страницу в техзадании, тогда дизайнеру не придется ничего изобретать — нужно будет просто все качественно отрисовать.Наверное, вы замечали, что все страницы сервисов чем-то похожи, на них присутствуют аналогичные блоки с приблизительно идентичной информацией. Идентичной по структуре, не по содержанию. Кому-то удается подавать свои идеи лучше, кому-то хуже. Мир не стоит на месте и всегда можно улучшить подачу «блюда».
Я постоянно анализирую сайты коллег и их опыт вдохновляет на изменения. Так сформировалась привычка сохранять интересные фишки. Для чего?
Заимствовать творчески
У комaнды Serpstat была уйма своих идей, но я решил все же посмотреть, как с задачами по дизайну главной страницы сайта справляются коллеги из SaaS-продуктов. По-настоящему работающих идей не так много, поэтому не стоит бояться творчески заимствовать лучшие наработки и адаптировать их. Конечно, речь не о сайтах прямых конкурентов.
В Serpstat я завел структурированную «папочку» с примерами нормальных решений. Со временем открыл доступ всем — сейчас каждый сотрудник может поделиться интересными элементами.На первом этапе я не сохранял какие-то экстраординарные фишки. Наоборот, здесь как раз нужно искать эффективные кейсы: максимально простые, но тем не менее наиболее функциональные примеры. Благодаря подходу «понравилось — сохрани», нам существенно удается упростить себе жизнь. Особенно в моменты, которые требуют быстрых и качественных решений (к ним относится и процесс редизайна — он требует немало времени и средств, поэтому мы использовали на пpaктике бoмж-подход).
Наш небольшой мануал.
1. Заводим общий Google Docs для комaнды
Это простой и быстрый способ сохранять идеи. Я ежедневно просматриваю множество страниц SaaS-сервисов и сохранял элементы дизайна, месседжи и даже фразы. Теперь, когда какая-то идея нравится, каждый сотрудник может сохранить ее в общем документе:
2. Структурируем документ по тематическим блокам
Исходя из своих потребностей, я структурировали документ так: добавил блоки «первый экран», «экран фич», «экран информации о продукте», «ссылки на блог», «блок для сравнения с конкурентами» и так далее.
Как быстро написать текст — девять хитростей На что нажимать, чтобы увидеть структуру докса, читайте в пятом пункте статьи
3. Сохраняем блоки
Информацию добавляю в формате: ссылки, скриншоты, объяснения.
4. Добавляем блоки из докса в техзадание
В необходимый момент сдуваем пыль с этого документа и работаем с содержанием.
Я смотрел, что используют популярные в мире SaaS-сервисы, набросал для главной Serpstat все, что мне нравилось, а потом многое убирал. Убирать лишнее проще.
Например, для главной Serpstat я выделил такие блоки:
- хедер;
- первый экран;
- блок с видео (плавающая кнопка видео) ;
- блок фич — вопросы, на которые даются ответы картинкой;
- блок «Why Serpstat?»;
- блок с видеоотзывами;
- блок с клиентами;
- блок с White Papers;
- блок с фото юзеров с отзывами;
- блок с последним экшеном;
- блок с информацией о популярности в соцсетях и мотивацией подписаться;
- футер.
5. Убираем лишнее и выбираем доступные идеи
Какой блок соответствует цели сервиса и поможет в ее достижении, а какой нет — вот о чем я думал на данном этапе. После этого отобрал наиболее доступные по реализации идеи.
Например, взял отличную фишку на сайте mixrank: если вся соль в интерфейсе, показывать взаимодействие с интерфейсом, а для этого идеально подходят гифки.
Визуально понравился подход Wistia к блоку о преимуществах продукта:
Аналогичный блок на сайте Serpstat:
Блок с отзывами подсмотрели у Preact:
Реализация на главной Serpstat:
6. Оформляем техзадание
Важнее всего продумать все детали подачи информации — это не просто ТЗ по дизайну, а и ТЗ по контенту.
От контента и его подачи зависит восприятие информации, контент диктует целесообразность того или иного блока на странице. От этого зависит, каким будет ее формат и стиль.
Необходимо максимально детально все прописать: где будет находиться какая деталь блока, каким будет его наполнение, что за чем лучше размещать.
В итоге я получил структурированный документ со скриншотами «как надо» и с описанием «как будет у нас» — расписал все максимально детально с учетом особенностей продукта и целевой аудитории.
Подобную методику я использую и для других проектов. Например, вот техзадание по созданию сайта конференции SaaS-nation:
7. Наслаждаемся результатами
Так выглядел сайт сервиса до ребрендинга:
А этот, первый после ребрендинга сайт мы создали за 14 дней и он работал еще полгода, пока профессиональные дизайнеры рисовали современный вид главной Serpstat:
8. Продолжаем дополнять документ новыми идеями
После написания техзадания мы продолжили пополнять созданный Google Docs новыми идеями, которые могут пригодиться в следующий раз. Так как доступ к нему есть у всех в комaнде, это делается быстро и легко.
Вместо выводов
Мы быстро проапгрейдили визуальную составляющую сайта Serpstat в минимальные сроки и с минимальными затратами. При этом не бездумно копировали какой-то сайт, а компилировали удачные решения зарубежных сайтов.
После внедрения обновленной главной я начал получать обратную связь. Многие отмечали классный американский стиль новой главной Serpstat.
Почему бoмж-подход стал для нас оптимальным решением?
Существенную роль играла скорость. Обычно разработка какой-то концепции занимает много времени, а количество времени прямо пропорционально количеству людей, которые задействованы в проекте. Все начинают предлагать свои креативные идеи, обсуждать и критиковать других, а времени на реализацию остается очень мало.
Когда мы говорим о стартапе, нужно осознавать, что работать приходится в сжатые сроки и нет лишнего времени на возню. Бoмж-подход в этом плане оптимален: смотрим на простые и уже работающие идеи и адаптируем их под свои нужды. В Serpstat нам удалось добиться желаемой цели — создать интуитивно понятный и удобный дизайн сайта для наших клиентов. Заодно многому научились от крутых коллег.
Если вы будете делать подборки интересных кейсов, систематизируя их «на бумаге», а не в голове, то сможете в любой момент воспользоваться накопленным багажом для совершенствования своего проекта.
Мы перезапустили сайт Serpstat 10 мая 2016 года. За месяц при трехкратном увеличении количества поисковых запросов коэффициент конверсии также вырос на 5,63%. Увеличилось и количество вовлеченных клиентов. В дальнейшем коэффициент конверсии в регистрации немного снизился (на 0,75%) из-за роста трафика, который мы привлекли на новую главную.Наш метод вы можете смело применять как для лендингов, так и для сайтов — просто представьте, что вы разбили сайт на несколько страниц, среди которых посадочная — главная.
Бoмж-подход будет полезен тем, кто находится на ранних стадиях развития проекта, когда нет денег и времени заморачиваться над дизайном, а все силы хочется сосредоточить на качестве сервиса. Не копируйте — заимствуйте творчески.
Комментарии:
Руководитель отдела HR, Ольга Пачесная, написала пост о главном — людях, которые выбрали работу в Netpeak....
22 01 2025 4:42:48
Если ваш сайт не приносит желаемых продаж, задумайтесь о смене формата. Этот кейс о том, как с качественным лендингом можно достигнуть желаемой цены за конверсию....
21 01 2025 10:16:37
Результаты грамотного внедрения технического SEO-аудита...
20 01 2025 17:36:25
Определение и настройка главного зеркала сайта в поисковых системах — первое, что нужно сделать перед раскруткой сайта...
19 01 2025 10:34:14
20 сервисов для прокачки контента под SEO. Штуки, которые будут полезны новичкам и экспертам....
18 01 2025 11:52:57
Грабберы — программы, позволяющие автоматизировать процесс сбора и публикации контента. С помощью грабберов, помимо парсинга контента, осуществляют перевод и уникализацию текстов....
17 01 2025 2:34:53
Как составить список, работа с которым займет меньше времени, чем обычно. На примере обработки запросов в ювелирной тематике....
16 01 2025 0:56:19
Как мы недооценили уровень конкуренции в нише, и как пришлось с этим бороться, чтобы принести пользу клиенту....
15 01 2025 9:37:36
Образ гармонии, почерк и потребности — рецензия на книгу Яна Чихольда «Облик книги»....
14 01 2025 13:19:34
Недавно у нас появился свой генератор мемов :) Во многих компаниях смешные слова и фразы стараются запомнить и передать следующим поколениям сотрудников. В Netpeak же долго работали над секретным проектом и... Читайте!...
13 01 2025 2:46:29
Домен — это адрес (имя) сайта в сети интернет, по которому его находят пользователи. Он состоит из букв, символов и цифр, должен быть уникальным, чтобы владельцу ресурса удалось добиться качественного продвижения. Как подобрать лучший? Читайте!...
12 01 2025 11:20:19
Интересный и важный документ, не пропустите. Для ранжирования используется сумма коммерческой и тематической релевантности. Уходя с головой в SEO, многие вебмастера забывают о пользовательских факторах. Узнайте больше об этом!...
11 01 2025 23:43:45
Как получить больше конверсионного трафика из поиска и не выйти за рамки KPI? Запустите SNDS-кампании...
10 01 2025 15:38:25
Тест, который проходят все соискатели. Никому не показывайте!...
09 01 2025 15:37:45
Дайджест-путеводитель по серии постов о работе с редакторами электронных таблиц для PPC-специалистов....
08 01 2025 2:22:34
Эти данные пригодятся в составлении медиапланов по продвижению в интернете. Понимания стоимость конверсии и необходимое количество конверсий, вы можете прогнозировать, сколько денег на рекламу нужно выделить. Читать!...
07 01 2025 11:46:21
Устанавливаем тег конверсий: самостоятельно и с помощью Google Tag Manager....
06 01 2025 6:13:19
Много 404-страниц и ссылок на них негативно сказывается на ранжировании сайта в поисковых системах....
05 01 2025 18:35:51
Как найти тему для поста, который и в онлайн поиске будет хорошо ранжироваться, и по социалкам разойдется, и комментарии в треде обеспечит...
04 01 2025 17:15:35
Баннерная реклама в фейсбуке. Обзор семи новых рекламных инструментов...
03 01 2025 6:26:50
Мы предложили фанам бренда прокатиться на автомобиле SEAT Altea Freetrack!...
02 01 2025 13:52:24
О возможностях нестандартного использования поисковых систем для решения важных бизнес-задач...
01 01 2025 6:49:20
Правила преобразования фидов в Google Merchant Center помогут сегментировать товары и сделать вашу рекламу более эффективной...
31 12 2024 17:20:33
Находим пользователей, которые не знали, что им нужен ваш товар или услуга....
30 12 2024 23:25:27
Начинаем серию постов в режиме реалити-шоу о подробностях продвижения крупного игрока бизнеса email- и sms-рассылок — компании UniSender....
29 12 2024 3:33:45
И зачем топ-менеджерам разбираться в настройках кампаний, повышать свою техническую грамотность? Показываем на примерах и раскладываем по полочкам....
28 12 2024 23:14:50
Нужно ли начинать работу с Google Marketing Platform, и если да, то на каком этапе развития бизнеса?...
27 12 2024 22:15:17
Комaнда Serpstat провела исследование среди интернет-маркетологов и создала виджет, который рассчитывает среднюю зарплату на основе опыта, навыков и знаний специалистов. Что из этого получилось, читаем в статье....
26 12 2024 21:45:47
Правильное распределение кодов ответов сервера позволяет поисковым системам экономить ресурсы на работу с сайтом. Поисковые роботы будут получать только необходимую информацию...
25 12 2024 15:24:44
Как помешать фейковым 404 страницам испортить статистику вашего сайта?...
24 12 2024 1:45:44
Посмотреть релевантность сайта для победы над конкурентами. Как использовать Serpstat....
23 12 2024 13:40:31
Актуальный обзор особенностей работы онлайн-проектов в Казахстане...
22 12 2024 20:17:55
Как и кто создает новые услуги в Netpeak и что нужно знать, уметь, чтобы это делать? Рассказывает Елена Воскобойник, специалист, которая иногда разpaбатывает их почти с нуля. Читать!...
21 12 2024 0:54:36
Лучшие маркетинговые и бизнес-фишки от Давида Брауна (Weblium), Владислава Флакса (OWOX), Александра Галкина (Competera), Люси Литерадо (Reply.io), Вадима Нехая (Depositphotos), Валерия Грабко (PromoRepublic), Игоря Дебатура (Uploadcare), Руслана Савчишин...
20 12 2024 2:43:44
Как снизить стоимость лидов путём использования новых технологий...
19 12 2024 7:58:38
Подборка для застройщиков, маркетологов и менеджеров по продажам...
18 12 2024 11:34:45
Хотите раскрутить свои соцсети в 2022 году? Тогда уже сейчас нужно задуматься, что будете публиковать. В статье расскажем, какой контент будет в тренде в будущем году....
17 12 2024 11:45:12
Исправление ошибок в тексте возможно с помощью онлайн-инструментов и стационарных программ...
16 12 2024 10:42:54
Сбор ключевых запросов с помощью программы Кей Коллектор: показываем и рассказываем пошагово с демонстрацией процесса настройки с сервисом Яндекс.Вордстат. Читать дальше!...
15 12 2024 6:36:24
Как улучшить конверсию сайта: идеи для маркетологов...
14 12 2024 11:26:51
Заработок в четверть миллиона. Как многофункциональная SEO-платформа Serpstat из Netpeak Group стала самым продаваемым продуктом на AppSumo — пошаговая история-инструкция...
13 12 2024 4:31:54
Понятные людям и роботам URL. Это уникальный набор символов, который дает возможность идентифицировать всевозможные ресурсы в интернете (страницы сайтов, файлы, изображения, видео и так далее). Чтобы узнать больше, читайте далее!...
12 12 2024 20:53:51
И научиться делать свою рекламу прибыльной. Читайте про типы автостратегий и способы их оптимизации....
11 12 2024 9:57:13
Расширения, горячие клавиши и мгновенный перевод слов на другой язык — минимум лайфаков, которые можно использовать для удобства пользователей Google Chrome...
10 12 2024 15:28:12
Опыт контент студии WordFactory и 14 экспертов интернет-маркетинга....
09 12 2024 13:49:36
Комaнда Serpstat проанализировала стратегии продвижения лидеров ниши онлайн-образования. Читайте о главных инсайтах в посте....
08 12 2024 6:34:41
Сделать «на вчера», «внезапно», протестировать все варианты. Стоп! Остановитесь и выдохните. Be slow...
07 12 2024 19:53:46
SMM от Netpeak — это разработки стратегий продвижения, механики конкурсов, медиапланирование и постоянная интеpaктивная связь с клиентом с помощью «Личного кабинета»....
06 12 2024 18:38:48
Денис Бигус, Bihus.info: с 13 до 457 000 подписчиков на YouTube за четыре года....
05 12 2024 8:16:31
Понятная инструкция для SMM-специалистов для тех, кто экспериментирует с настройками аудиторий в рекламных кампаниях. Вы увидите, как настраивать ремаркетинг на примере Facebook. Существует 10 типов индивидуализированных аудиторий в Facebook, разберем три...
04 12 2024 9:12:16
Еще:
понять и запомнить -1 :: понять и запомнить -2 :: понять и запомнить -3 :: понять и запомнить -4 :: понять и запомнить -5 :: понять и запомнить -6 :: понять и запомнить -7 ::
