Знаете, как наш планировщик SingularityApp называют пользователи в отзывах? «Нафаршированный». Причем одни пишут это с восторгом: «Апп закрывает двести тысяч моих планировочных хотелок!» (и еще миллион на подходе). Другие немножко обалдевают, мол, «что за космический комбайн такой». А мы и не против.
За пять лет приложение действительно обросло крутыми функциями: AI-ассистент, календарь, канбан, трекер привычек, командная работа. Поэтому когда пришло время делать новый сайт, возникла проблема: как показать все фичи, не превратив главную страницу в унылую простыню?
В итоге, решили сделать сайт, который захочется рассматривать, а не только читать. Вот как это у нас получилось.
Статья впервые опубликована на сайте vc.ru 14.11.2025 г.
«Чуи, мы дома!»: звездный промоблок
Обычно первый экран главной страницы — это промоблок: стоковая картинка, что-то на маркетинговом и кнопка «Слышь, купи». Пользователи привыкли к данному формату настолько, что уже автоматически скроллят дальше. Но для сложного продукта это проблема: нужно зацепить внимание сразу, иначе человек уйдет, так и не поняв, что вообще происходит.
Поэтому мы решили сделать ход конем и придумали промоблок с космическими анимациями:
- падающие звезды на фоне — двигаются по реально рассчитанным траекториям с учетом физики и ускорения;
- градиент, реагирующий на курсор — плавно перетекает при каждом движении мышки;
- «светлячки» — мягко подсвечивают контуры скриншотов при наведении и бегают за курсором.
Отдельно поработали над тем, как все должно двигаться: под каким углом отклоняется градиент, с какой скоростью бежит «светлячок», как звезды ускоряются. Получилось настолько залипательно-медитативно, что пользователи стали просить «завезти» такой фон и в само приложение.
Кстати, космическая тема у SingularityApp с самого начала — еще первый сайт 2019 года был с 3D-графикой и космосом. Название нашего планировщика тоже отсылает к технологической сингулярности, так что звезды и гиперпространство тут не случайны!
Впихнуть невпихуемое: как рассказать про все фичи
У приложения SingularityApp десятки функций — от ИИ до канбан-доски, заметок и таймера Помодоро. Про каждую важно не только рассказать, но и показать. Делать стандартный список со скриншотами, чтобы получилась «портянка» на несколько экранов? Точно не вариант.
Пришлось, конечно, поломать голову. В результате мы придумали два решения для компактной демонстрации всех-всех-всех (ну, почти) фич планировщика.
1. Анимация по скроллу с интерактивными описаниями.
Сделали блок, где скриншоты интерфейса разъезжаются при прокрутке страницы, а между ними появляются описания ключевых функций. Каждое можно развернуть и свернуть одним кликом.
При чтении про конкретную фичу контент на скриншотах меняется и показывает ту часть интерфейса, о которой идет речь. Получается эффект управляемого погружения: хочешь — быстро пробежался глазами по свернутым пунктам, хочешь — раскрыл и изучил подробно.
2. Бенто-сетка с иллюзией бесконечности.
Этот прием мы честно подсмотрели у японцев с их компактными коробочками для бенто-ланчей: влезает много, но все аккуратно разложено по секциям и не смешивается. В общем, сделали аналогичную сетку на сайте SingularityApp.
В каждой ячейке — своя фича: статичный скриншот, короткое видео, текст с иллюстрацией, вдохновляющая цитата. При этом все блоки разного размера, но уложены плотно, как кирпичики в стене.
Саму сетку можно развернуть по клику и поперетаскивать мышкой влево-вправо, чтобы появились новые блоки. Из-за этого возникает иллюзия бесконечного скролла, хотя на самом деле блоков конечное количество.
Пасхалки: трудоголики-мазохисты и Galaga в далеком-далеком Барнауле
Окей, юзер зашел, промоблок со звездами посмотрел, фичи в бенто-сетке изучил, триал скачал — дело сделано. Вроде всё? Нет, не все! Нам хотелось, чтобы человек не просто кликнул «Скачать приложение», а реально проникся, захотел покопаться в деталях и вернуться на сайт снова.
Для этого мы решили добавить элементы, которые не решают прямых бизнес-задач, но вовлекают эмоционально. Вот они:
- квиз «Кто ты в планировании?» — на главной странице разместили забавный тест с персонажами из книги Владимира Завертайлова «Тайм-менеджмент для тех, у кого лапки». Каждый человечек олицетворяет определенный тип поведения в планировании;
Кстати, с персонажем «Трудоголик-мазохист» вышла достаточно забавная история. Картинки к тесту рисовала нейросеть на основе детальных иллюстраций из книги. И ей почему-то очень не хотелось изображать человечка в латексе и с кляпом-шаром. Пришлось хитрить и просить «персонажа с яблоком», а потом уже самим допиливать его в графическом редакторе.
- мини-игра в стиле аркадного шутера Galaga из 80-х — в самой нижней части главной страницы припаркован небольшой космический корабль. По клику на него открывается полноценная игра: нужно сбивать вражеские корабли и уворачиваться от астероидов. Механика простая, но затягивает (сами попробуйте 😉);
Кстати, эта же игра встретит заблудившихся на странице 404. Самым лучшим игрокам отправим подарок за прохождение.
- страница «О нас» в стиле Star Wars — решили отойти от нестареющей классики про «молодую динамично развивающуюся компанию» и коротко и честно рассказали о себе. Оформили месседж, конечно же, в стиле легендарного интро из «Звездных войн».
Кстати, на заднем фоне страницы «О нас» можно заметить (и пошевелить мышкой) не только астероиды, но и падающие звезды. Загадывайте желание!
Зачем вообще было заморачиваться с этими «несерьезными» штуками? Да, мини-игры, квизы и оммажи на Star Wars практически не влияют на конверсию. Но они решают другую задачу — создают впечатление о продукте. Когда человек видит, что даже на странице 404 его ждет увлекательное путешествие, он понимает: команда делает приложение с душой, а не просто штампует очередной тудушник.
Вместо вывода
Когда у продукта много функций, очень хочется подробно рассказать про каждую. Но иногда эмоция работает лучше информации, а падающие звезды запоминаются сильнее, чем список из 50 пунктов.
Конечно, нестандартные решения работают не всегда. Но когда сработают, будут знаки: пользователи поделятся ссылкой на «смотри, как в Старварсе!», попросят добавить фон с сайта в приложение и начнут увлеченно гонять по веб-космосу на мини-кораблике.
P.S. Если интересно посмотреть вживую на сайт, приходите. Сингулярность ближе, чем вы думаете!