Медиа-сайт с фактами о средних показателях жизни — с цифрами, источниками и контекстом. 91 факт по 14 темам: от здоровья и денег до нейросетей и городов.
Цель
Клиент пришёл с идеей: сделать сайт, где каждая страница отвечает на вопрос «а сколько в среднем?». Нужен был быстрый запуск с нуля — дизайн, база данных, контент и деплой. Важно: сайт должен хорошо индексироваться в Яндексе, Google и попадать в ответы ИИ-ассистентов.
Решение
Собрали сайт с нуля за несколько итераций: — Архитектура на Next.js 14 (App Router) со статической генерацией страниц (SSG/ISR) — каждый факт рендерится заранее, отдаётся мгновенно без обращения к базе. — PostgreSQL + Prisma ORM, самописная CMS для управления фактами, комментариями и модерацией. — Наполнили базу: 91 факт по 14 категориям (тело человека, деньги, животные, природа, еда, транспорт, работа, беременность, города, спорт, разработка, нейросети, вредные привычки, хобби). — Дизайн: чёрно-белая палитра, шрифты Geist + Inter, адаптивный grid (2 колонки), карточки с полным описанием и кнопкой «Читать». — UX-детали: кнопка «Случайный факт» для быстрого браузинга, ротирующий тэглайн в hero («В среднем людям здесь нравится.»), анимация fade. — SEO: динамический sitemap.xml, schema.org (Article + WebSite), OpenGraph, robots.txt с доступом для ИИ-краулеров. — Деплой на VPS (Ubuntu): rsync → npm build на сервере → PM2 + Nginx с gzip и кэшем статики.
Результат
— 91 страница проиндексирована, sitemap подан в Яндекс.Вебмастер и Google Search Console — Время загрузки страницы < 1 с (Lighthouse Performance ~95) — Сайт корректно парсится ИИ-ассистентами: страницы попадают в ответы ChatGPT, Perplexity — Полностью рабочая CMS для самостоятельного добавления новых фактов
Какие интеграции и подключения были сделаны
В этом проекте важен был не только визуал, но и реальная рабочая связка сайта с сервисами, оплатой, аналитикой и операционными сценариями бизнеса.
Стек и инструменты
Разбор проекта
Ниже идёт фиксированная структура презентации: сначала впечатление и карточки, затем визуальная система, типографика и финальный кадр проекта.
01
Первое впечатление о проекте: композиция, акценты и то, как сайт выглядит в реальном сценарии использования.
Следующий кейс
Магазин премиальной одежды для животных
Дизайн, который работает
noremo — небольшая независимая дизайн-студия. Делаем редизайны, лендинги, фирменные стили и интерфейсы продуктов. Любим разбирать чужие сайты по косточкам и собирать их заново — современнее, тоньше, понятнее.
