Шаблон Noire: тёмное портфолио фотографа с архивом

Noire это готовый шаблон тёмного портфолио фотографа из галереи Zugo. Внутри публичная часть с подборкой работ, статементом, списком выставок и контактами, а за отдельным входом лежит панель управления архивом. Клон в ваш проект бесплатный, кредиты за него не списываются, а дальше правки идут текстом в чате по 300 кредитов.

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

Что внутри шаблона Noire?

Шаблон состоит из двух частей: витрины, которую видят посетители, и служебного экрана, где работы заводятся и публикуются. Такая пара встречается в галерее не у всех шаблонов, и именно она делает Noire интересным для практики: видно не только результат, но и способ его поддерживать.

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

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

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

Что здесь работает по-настоящему, а что оформление?

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

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

Это не дефект, а честная граница демонстрации. Настоящий архив с логином и сохранением делается поверх, коннектором Supabase: он даёт базу, вход и хранение файлов. Как выглядит такое подключение по шагам, разобрано в статье приложение с Supabase.

Практический вывод простой. Если вам нужна витрина, шаблон закрывает задачу сразу. Если нужен архив, который вы наполняете годами, закладывайте отдельный этап на базу и вход, и не рассчитывайте, что он появится сам собой из одной правки. Проверить границу можно за минуту: добавьте работу через панель и обновите страницу.

Кому подходит Noire?

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

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

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

Если вы не уверены, что тёмная схема ваша, попробуйте её на настоящих снимках, а не в воображении. Светлая версия делается одной правкой, и сравнить два опубликованных варианта дешевле, чем спорить об этом заранее. Решает здесь материал: пейзаж и предметная съёмка на тёмном фоне выигрывают чаще, чем светлые студийные портреты.

Чем шаблон выгоднее сборки портфолио с нуля?

Вопрос возникает у всех, и ответ зависит от того, насколько ваша задача близка к готовому каркасу. Разница считается в кредитах и в предсказуемости. Сборка по описанию стоит 600 кредитов и даёт результат, собранный ровно по вашему тексту, включая то, что вы забыли упомянуть. Клон шаблона бесплатный и даёт страницу, которую вы уже видели работающей в превью до клонирования.

Дальше вы платите только за отличия. Если задача звучит как «портфолио с крупной типографикой и разделом о подходе», отличий немного, и Noire выигрывает. Если задача звучит как «портфолио с расписанием съёмок и оплатой брони», каркас начнёт мешать, и разумнее описать проект с нуля. Граница проходит примерно там, где отличий набирается больше чем на две правки.

Есть и третий, менее очевидный аргумент. Шаблон показывает состав разделов, до которого с чистого листа доходят не сразу: статемент отдельно от биографии, список участий отдельно от контактов. Такой набор блоков сам по себе подсказка о том, как устроено убедительное портфолио. Разбор этой структуры без привязки к шаблону есть в статье сайт-портфолио нейросетью.

Как переделать Noire под себя?

Порядок тот же, что и с любым шаблоном: сначала смысл, потом внешний вид. Иначе вы дважды оплачиваете правку одного и того же блока.

1. Замените имя и статемент. Одна правка меняет имя автора по всей странице и переписывает текст о подходе на ваш.
2. Загрузите свои работы. Свои изображения подставляются вместо демонстрационных, а подписи и названия правятся тем же запросом.
3. Перепишите выставки. Если участий нет, замените блок на «клиенты», «публикации» или «награды»: структура списка останется, изменится смысл.
4. Настройте контакт. Почта, мессенджер, форма заявки. Письма с формы отправляет коннектор Resend.
5. Опубликуйте. Проект живёт на адресе вида имя.zugo.run, свой домен подключается поверх на платных тарифах.

Порядок здесь не формальность: имя и статемент задают тон, под который потом подбираются шрифт и плотность вёрстки.

Про изображения стоит сказать отдельно. Портфолио целиком держится на качестве снимков, и никакая правка вёрстки не спасёт слабую подборку. Пятнадцать сильных работ убеждают лучше сорока средних, и это единственное решение в проекте, которое инструмент за вас не примет.

Сколько стоит довести шаблон до публикации?

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

Тарифы: Free даёт 2 400 кредитов, Pro стоит $25 в месяц и включает 20 000 кредитов, Business стоит $50 в месяц. Каждая сборка перед выдачей запускается в песочнице, и вариант, который не открылся, вам не отдаётся.

Отдельно про бесплатный тариф, потому что арифметика там неочевидная. Стартовых 2 400 кредитов не хватит на сборку с нуля: она стоит 600. А шаблон в эти рамки укладывается, потому что клон ничего не стоит, и на первую правку запаса хватает. Для портфолио это удобный способ увидеть свои снимки в готовой вёрстке, ничего не заплатив.

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

Какие правки просят чаще всего?

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

«Сделай сетку работ в две колонки вместо трёх и увеличь снимки». «Добавь к каждой работе год и технику съёмки под названием». «Замени раздел выставок на список клиентов с логотипами». «Переведи весь интерфейс на русский, включая подписи в панели архива и пустые состояния».

Отдельно стоит просить про поведение на телефоне: «на узком экране показывай снимки в одну колонку и увеличь отступы между ними». Портфолио чаще всего открывают с телефона по присланной ссылке, и проверять результат надо там же, а не в уменьшенном окне браузера.

И ещё одна частая правка, про которую забывают чаще прочих: заголовок вкладки и превью ссылки. «Поставь в заголовок страницы моё имя и жанр съёмки» стоит столько же, сколько любая другая правка, но именно этот текст видят первым, когда ссылку пересылают в мессенджере.

Где границы шаблона?

Витрина не заменяет систему хранения. Без базы шаблон показывает работы, но не ведёт их учёт между сессиями. Это разные задачи и разный объём работы, и путать их дороже всего на этапе, когда снимков уже накопилось много.

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

Сложная логика доводится правками. Клиентские галереи с доступом по ссылке, водяные знаки, отбор снимков заказчиком: всё это описывается по шагам и проверяется по одному, а не появляется из единственного промпта. На по-настоящему сложном продукте Zugo не заменяет команду разработки, и код всегда можно забрать экспортом в GitHub: проект принадлежит вам, а не платформе.

Начать проще всего с малого: откройте галерею на zugo.dev, клонируйте Noire и подставьте десяток своих снимков вместо демонстрационных. Уже на этом шаге станет понятно, работает ли тёмная схема на вашем материале.