Сайт писателя
Личный сайт писателя «Вера Холодова» — читалка с переключателем день / ночь на весь сайт, антиква Cormorant Garamond и PT Serif, тишина и типографика: первый экран с именем из-под маски и строкой дня, которую пишет перо, 3D-книга, которая открывается на первую страницу и меняет цену по формату, архив текстов с превью за курсором и раскрытием фрагментов, чтение по прокрутке с закладкой и сносками на полях, о себе в bento с цифрами, отзывы заметками на полях, встречи от текущей даты, письма читателям с конвертом, контакты для издателей и подвал-колофон. Cormorant Garamond и PT Serif.
Сайт автора, где главное — текст: страница переключается между дневным и ночным режимом, книга открывается в 3D, эссе набраны так, чтобы их было удобно читать. Писательница в демо вымышленная.
Из чего собрано
11 блоков из каталога, в порядке появления на странице. Каждый ставится своей командой; ничего не пересоздаётся.
1. Шапка
Шапка писателя: имя антиквой, солнце/луна и линия прочитанногоnavbar-045
Имя антиквой, разделы, солнце / луна, чернильная линия прогресса чтения, бургер.
2. Первый экран
Хиро писателя: имя из-под маски, цитата пером, солнце/лунаhero-045
Имя из-под маски, строка дня пишется пером и стирается, переключатель ночь / бумага.
3. Книга
Книга: 3D-обложка, которая открывается, форматы и счётчик страницwriter-001
3D-обложка открывается на первую страницу, бумага / электронная / аудио меняют цену.
4. Тексты
Архив текстов: крупный список, превью у курсора и раскрытие в спискеwriter-002
Архив с крупными заголовками, превью за курсором, фильтр, раскрытие фрагмента.
5. Чтение
Чтение по прокрутке: закладка-прогресс, сноски на полях, чернильные подчёркиванияwriter-003
Колонка 65 знаков, закладка-прогресс, сноски на полях, чернильные подчёркивания.
6. О себе
О себе как bento: портрет, докручивающиеся цифры, города и черновикbento-014
Портрет, цифры докручиваются, города, «сейчас пишу».
7. Читатели
Отзывы читателей как заметки на полях страницы с ротациейwriter-004
Отзывы как заметки на полях с ротацией.
8. Встречи
Встречи как лента дат от сегодня: «до ближайшей — N дней»event-026
Лента дат от сегодня, «до ближайшей — N дней», прошедшие вычеркнуты.
9. Письма
Письма читателям: частота, одно поле и конверт прошлого письмаsubscribe-020
Частота неделя / месяц, одно поле, конверт с прошлым письмом.
10. Издателям
Контакты для издателей: права со статусами и наклоняющаяся визитка агентаcontact-033
Права со статусами, визитка агента с 3D-наклоном.
11. Подвал
Подвал-колофон писателя с виньеткой и «наверх»footer-044
Колофон с виньеткой и «наверх».
Pro
Точный состав, код страницы и ссылка для агента — в PRO
Демо и список блоков открыты всем. Подписчику показываются пропсы каждого блока как в демо, общие правила темы, промпты картинок и одна ссылка, по которой ИИ-агент собирает такую же страницу.
Открыть PROЧастые вопросы
- Из чего собрана страница «Сайт писателя»?
- Из 11 секций каталога по порядку: Шапка писателя, Хиро писателя, Книга, Архив текстов, Чтение по прокрутке, О себе как bento, Отзывы читателей как заметки на полях страницы с ротацией, Встречи как лента дат от сегодня, Письма читателям, Контакты для издателей, Подвал-колофон писателя с виньеткой и «наверх». Каждая — отдельный item VibeUI.
- Как собрать такую страницу через ИИ-агента?
- Нажмите «Копировать сценарий для ИИ» и вставьте в Cursor или Claude Code: агент получит исходник страницы, общие правила темы и промпты картинок и поставит каждую секцию из реестра через shadcn CLI.
- Сценарий бесплатный?
- Живое демо и список секций открыты всем. Исходник страницы и инструкция для агента — в подписке PRO.