Готовые шаблоны страниц под разные задачи
Тестовая выборка из коллекции Open Design — каждый пример это самостоятельная HTML-страница, написанная LLM-агентом по заданию дизайн-системы. Кликай карточку чтобы открыть пример.
Сайты / UI
14 примеровAirbnb — Host Dashboard
Дашборд арендодателя в стиле Airbnb: Rausch coral акцент, KPI-плитки, line + donut диаграммы, таблица бронирований. Inter как замена Cereal VF.
Growth Squad — Sprint 38
Канбан-доска с колонками статусов и плотными карточками задач. Тёмная палитра, акценты teal+purple — рабочий инструмент для трекинга спринта.
Filebase — Tweaks demo
Витрина мелких UI-улучшений: тогглы, инпуты, кнопки, состояния. Тёмная палитра с холодным синим акцентом — удобно для design-system gallery.
SPORT TEST — Axis Pro
Продающее email-письмо в виде веб-страницы: hero с продуктом, преимущества, CTA. Тёплая палитра terracotta + кремовый.
mutuals — your dating life
Лендинг датинг-сервиса «знакомства через общих друзей»: эмоциональный hero, social proof, ясный value-prop. Свежая зелёно-красная палитра.
Tomato — focus timer (web)
Веб-вариант помодоро-таймера с расширенным desktop-лейаутом — список задач, статистика, настройки. Тот же warm-paper стиль что и mobile-версия.
Lull — onboarding flow
Серия экранов онбординга мобильного приложения: welcome, бенефиты, разрешения, signup. Контрастная зелёно-синяя палитра на тёмном.
Level — daily quests
Игровой UI ежедневных квестов: тёмная палитра, прогресс-бары, очки и стрик-счётчики. Контраст к остальным «спокойным» примерам.
Tomato — focus screen
Экран фокус-таймера в формате мобильного приложения: крупный таймер, нижний таб-бар, минимум интерфейса.
Pulse — аналитический обзор
Внутренняя админка с sidebar-навигацией, KPI-карточками и таблицами. Плотная сетка под рабочий интерфейс.
Filebase Docs — Quickstart
Страница документации с боковой навигацией, оглавлением справа и кодовыми блоками. Аккуратный «doc reader» паттерн.
Why we rewrote sync engine in Rust
Технический пост в формате «текст-первый»: длинная читабельная колонка, сдержанная типографика. Шаблон для инженерного блога.
Filebase — тарифные планы
Страница цен: четыре тарифа в плотной сетке, чек-листы фич, FAQ-блок. Чистая структура без агрессивных «выгодных» баннеров.
Filebase — облачная синхронизация
Маркетинговый лендинг продукта: hero с заголовком и CTA, блок преимуществ, прайсинг и финальный призыв.
Editorial / постеры
4 примераZentou AI — wireframe v0.1
Лоу-фай эскиз интерфейса в стиле «руками на бумаге»: тёплая бумажная палитра, наброски блоков и аннотации.
Three posts. One beat.
Три слайда для соцсетевой карусели в едином ритме — формат Instagram/LinkedIn-постов, типографика как главный визуал.
AI Enthusiast — manifesto
Постер-манифест в журнальном стиле: крупный издательский заголовок, multi-column layout. Один экран, который продаёт идею.
Creator's Style & Format Guide
Стилизованный e-гайд с тёплой бежево-коралловой палитрой, журнальной типографикой. Для лид-магнитов и premium-контента.
Презентации
6 примеровHolm — Series A Pre-Read
Pre-read для Series A инвесторов: рынок, traction, юнит-экономика, команда. Глубокий тёмный фон, спокойная подача.
Atlas Quarterly — Chapter 01
Квартальный отчёт в формате журнала: длинноформатные слайды-разделы, типографика как визуал, минимум графиков.
Bluehouse — Real Estate ROI
Питч-дек по проекту в недвижимости: модель ROI, локация, риски и выходы. Та же тёмная палитра, цифры как герой слайда.
Helix — Q1 '26 Board Update
Регулярный апдейт для совета директоров: метрики, риски, решения, ask. Сжатый деловой формат.
Critique — magazine-web-ppt
Гибрид журнальной вёрстки и презентации с разбором дизайна. Богатая палитра — синий, зелёный, красный — каждый раздел как отдельная статья.
Filebase — Q2 2026 deck
Инвесторская презентация в формате слайдов: проблема, метрики, traction, команда, ask. Сдержанный paper-стиль.
Документы / отчёты
8 примеровGrowth · Weekly W42
Недельный апдейт команды: метрики, прогресс по целям, блокеры, фокус на следующую неделю. Тёмная палитра с фиолетовым акцентом.
Northwind — Q4 FY25 OKRs
Квартальные цели команды в виде структурированной таблицы: objectives, key results, прогресс, owner. Деловой шаблон планирования.
Spec — Two-factor authentication
Продуктовая спецификация фичи: контекст, user stories, acceptance criteria, риски. Шаблон для PM-документа перед разработкой.
Growth squad — 14 Oct notes
Протокол еженедельной встречи: участники, обсуждаемое, решения, action items с ответственными. Удобный шаблон для регулярок.
Sable Studio — INV-2025-0142
Счёт-фактура в чистом editorial-стиле: реквизиты сверху, line items таблицей, итоги внизу. Спокойная зелёно-кремовая палитра.
Welcome to Northwind — Maya's plan
План онбординга нового сотрудника: schedule на первые недели, контакты команды, ресурсы для изучения. Тёплая HR-эстетика.
Northwind — Q3 Financial Report
Финансовый отчёт квартала: revenue, costs, GP, key metrics с графиками. Корпоративный сине-зелёный стиль.
Auth Service — Runbook
Инженерный регламент для дежурного: симптомы, диагностика, шаги фикса, эскалация. Тёмная palette с mint-акцентами для критичной инфы.
Анимация
2 примераNintendo, 1889 — sprite
Спрайт-анимация в стиле ретро-консолей: пиксельные кадры, ограниченная палитра, ручной таймлайн. Демонстрация frame-based motion.
Reach every country — Charlotte & Vine
Раскадровка анимационной сцены: ключевые фреймы, пометки переходов, тайминги. Тёплая редакторская palette, как в book design.