Театр души
Портал поэта и художника: стихи, проза, живопись и живой голос в одной сцене — книги читаются онлайн в оригинальной вёрстке.
Портал автора: стихи, проза, живопись, музыка и живой голос в одной сцене. Роль студии — концепция, арт-дирекшн, копирайт, дизайн-система, живописные фоны, читалка книг и звук.
Видео-прогулка по экранам: вход, главы-дисциплины, магазин и хранилище.
- Клиент
- Юлия Юрчевская — поэт, прозаик, художник
- Актив
- Два изданных сборника, живопись и графика, песни, записи стихов голосом автора, NFT-галереи
- Задача
- Собрать разрозненное творчество в одну сцену и сделать из него инструмент
- Аудитория
- Преимущественно мобильная
- Поддержка
- Автор обновляет сайт сам, без команды
- Разделы
- Стихи · Проза · Музыка
«Меня много, а показать нечего — всё по кусочкам». Творчество жило на пяти площадках сразу: соцсети, галереи, файлы «в столе». Аудитория приходила на один формат и не узнавала о трёх остальных. Не было точки, куда не стыдно привести издателя, куратора или заказчика: единственная витрина — лента, где вчерашний пост навсегда закрывает позавчерашний.
Цели- 01Собрать стихи, прозу, живопись, музыку и голос в одну вселенную вместо пяти вкладок
- 02Сделать творчество потребляемым здесь и сейчас: без скачиваний, регистраций и сторонних сервисов
- 03Поднять статус — портал должен читаться как «издание», а не как «страничка»
- 04Дать инструмент переговоров: одна ссылка для издателя, куратора, партнёра, покупателя картины
- 05Сохранить авторскую руку: сайт как продолжение живописи, а не шаблон
Ограничения — не оправдание, а аргумент: они объясняют, почему решение выглядит именно так.
- Контент разного качества и формата — сканы, PDF, живые аудиозаписи, видео: нужна система «рам», уравнивающая материалы по достоинству.
- Книги обязаны сохранить оригинальную вёрстку издания — читалка показывает исходный разворот, а не пересобранный текст.
- Аудио — живой голос автора, а не синтез: сведение и музыкальная подложка становятся частью дизайн-системы.
- Аудитория преимущественно мобильная: телефон проектируется как основной сценарий, не как «уменьшенная» версия.
- Обновления вносит сам автор, без команды: структура из повторяемых блоков.
- Ни рекламных бюджетов, ни SMM-команды: сайт должен продавать сам собой.
Сайт — не портфолио, а театр: занавес, зал, ложи, сцена. Посетитель не «просматривает разделы», он входит в зал. Метафора не украшение — она принимает решения за нас: каждый спор «как сделать» решался вопросом «как это было бы в театре».
Главный экран: сцена с живописным задником и вход в зал
Живописный задник вместо фотофона
- Задача
- Сохранить авторскую руку и поднять статус портала.
- Ограничение
- Ни фотосъёмки, ни логотипа, ни бюджета на продакшн.
- Решение
- Все фоны — авторская пастозная живопись. Интерфейс написан той же кистью, что и картины: кнопки — мазки маслом, а не прямоугольники.
- Эффект
- Сайт нельзя перепутать ни с одним шаблоном; узнаваемость бренда достигнута без логотипа.
Палитра бумаги и занавеса в движении
Кремовая бумага, тушь и золото
- Задача
- Дать ощущение издания, а не экрана.
- Ограничение
- Тёмная тема делала живопись «музейно-холодной» и снижала читабельность стихов.
- Решение
- Кремовый фон вместо белого, винно-бордовый акцент — цвет театрального занавеса, золото только на деталях, как тиснение на переплёте.
- Эффект
- Тёмный вариант отклонили совместно: бумага победила галерею.
Читальня на мобильном: одна колонка, крупные тач-зоны
Две гарнитуры: статус и воздух
- Задача
- Совместить достоинство издания и лёгкость чтения с телефона.
- Ограничение
- Один шрифт на всё выглядел бы либо тяжело, либо дёшево.
- Решение
- Cormorant Garamond — высококонтрастная антиква для заголовков; Karla — гротеск для текстов стихов и интерфейса.
- Эффект
- Заголовок держит статус, стих читается с экрана без усилия.
«99 дыханий любви» — оригинальный разворот на странице
Читалка с оригинальной вёрсткой
- Задача
- Дать читать книгу прямо на сайте.
- Ограничение
- Пересобрать текст в html было бы проще и адаптивнее — но вёрстка издания часть произведения.
- Решение
- Книга открывается разворот за разворотом, с прогрессом чтения и листанием стрелками. Ноль скачиваний — ноль потерянных читателей.
- Эффект
- Выбрали не удобство разработки, а ценность продукта: издание сохранено как есть.
Стихотворение с голосом автора и видео-фоном
Голос автора и изящный плеер
- Задача
- Дать слушать стихи, не уходя на сторонние сервисы.
- Ограничение
- Синтезированный голос дешевле и масштабируемее, но не даёт доверия.
- Решение
- Живой голос сведён с инструментальной музыкой, подложка приглушается под речь. Плеер оформлен вензелями; каждое стихотворение сопровождает зациклённый видео-фон.
- Эффект
- Экран «дышит», время прослушивания и глубина визита растут.
Разворот в читальне: акт за актом
Скролл-драматургия и деловой подвал
- Задача
- Довести эмоцию до действия.
- Ограничение
- Ни рекламных бюджетов, ни поп-апов — удерживать надо самим повествованием.
- Решение
- Главная построена как последовательность актов: заголовок проявляется из тумана, уходит влево, из-за него выплывают книги. В конце любого маршрута — контакты, соцсети и галереи автора.
- Эффект
- Прокрутка стала повествованием, а финал маршрута — точкой переговоров.
- ×Не делали тёмный «галерейный» вариант: красиво, но убивало ощущение бумаги и читаемость стихов.
- ×Не строили классическую сетку-портфолио карточками — она уравняла бы автора с сотней таких же страниц.
- ×Не брали синтезированный голос: живой голос даёт то доверие, ради которого приходят.
- ×Не делали меню из шести разделов — оставили три «ложи»: меньше выбор, выше первый контакт с контентом.
- ×Не пересобирали книги в html: оригинальная вёрстка издания важнее простоты реализации.
#F5EFE6
Кремовая бумага — база экрана
#7A1B2E
Винно-бордовый — театральный занавес
#1F1B18
Тушь — основной текст
#C9A227
Золото — тиснение на деталях
#E8D8CC
Пудровая тень — рамы и паспарту
- Заголовки
- Cormorant Garamond — высококонтрастная антиква
- Разряжённые капсы
- Karla / letter-spacing 0.28em
- Текст и стихи
- Karla — гротеск с воздухом
- Пять площадок сложились в одну ссылку — коммерческое предложение для издателя, куратора, галереи, партнёра.
- Аудио и видео-петли превращают визит в сеанс: посетитель не сканирует, а остаётся.
- Логика издания и театра поднимает воспринимаемую стоимость картин, книг и заказов без изменения продукта.
- Сцены и клипы нарезаются в вертикальные ролики — сайт сам производит рекламные материалы.
- Чтение и прослушивание живут на своей территории: аудитория и продажи остаются у автора.
- Новый стих, книга или альбом добавляются в существующую систему блоков — сопровождение почти бесплатно.
Проект живёт в сети — можно посмотреть вживую
Смотреть сайт ↗