ВСЕ КЕЙСЫ2025
ЛЕНДИНГ SAAS-ПРОДУКТАPRODUCT LANDINGMOTIONDARK UI

REFLECT

Лендинг приложения для заметок: интерфейс показан в движении прямо под заголовком

КЛИЕНТ
Reflect — приложение для заметок
СРОК
4 недели
ГОД
2025
УСЛУГИ
Дизайн-концепция · Motion-дизайн · Frontend · Оптимизация
[ 01 ]ЗАДАЧА

С чем пришёл клиент

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

Вторая сложность — плотность продукта. Скорость, граф обратных ссылок, приложение для iOS, сквозное шифрование, календарь, публикация, AI на GPT-4 и Whisper. Перечислить всё на первом экране — значит не сказать ничего.

[ 02 ]РЕШЕНИЕ

Что сделала студия

Первый экран показывает продукт в работе. Под заголовком «Think better with Reflect» сразу играет зацикленное видео интерфейса на пять секунд: заметка пишется, обратные ссылки подхватываются, граф достраивается сам. Объяснять уже не нужно — видно.

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

[ 03 ]СОСТАВ РАБОТ

Из чего сложился результат

01

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

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

02

Тёмная сцена под интерфейс

Почти чёрный фиолетовый фон гасит окружение, и светится только окно продукта. Никаких декоративных блоков, спорящих с ним за внимание.

03

Плотность, разложенная на ритм

Восемь возможностей поданы короткими карточками, а сложное — AI, граф, интеграции — вынесено в отдельные секции с собственной демонстрацией.

04

Вес первого экрана

Видео вместо тяжёлого JavaScript: петля грузится вместе с постером и не блокирует показ заголовка.

[ 04 ]ИНТЕРФЕЙС · DESKTOP / MOBILE
DESKTOP · 1440ЖИВОЙ ИНТЕРФЕЙС, А НЕ КАРТИНКА
MOBILE-FIRST · 390
[ 05 ]РЕЗУЛЬТАТ
5 с
петля видео интерфейса вместо статичного скриншота
E2EE
сквозное шифрование — отдельный блок доверия
GPT-4
AI-ассистент на GPT-4 и Whisper в своей секции
СТЕК:Next.jsTypeScriptMotionWebM videoTailwind CSS

Нужен похожий результат для вашего бизнеса?

Разберём вашу задачу так же, как этот кейс: структура, визуальное направление и смета — за один день.