Что вы получите
- Один офлайн-HTML-файл или настоящие маршруты в вашем проекте на React, Vue, Svelte или Astro
- Главная, работы и кейсы, статьи, доклады, Uses, «Обо мне», резюме, контакты и 404
- Обложки проектов — HTML-панели продукта на фотографических фонах
- Палитра команд, вкладки опыта, сетка репозиториев, фильтры и формы с проверкой
- По желанию: фоны или фото от PopNow с ценой до оплаты
Подходит для
- Инженеры и инди-разработчики, которым нужен личный сайт
- Соискатели, которым нужна страница «Наймите меня» с кейсами
- Разработчики, которые пишут или выступают и хотят собрать всё в одном месте
Не подходит для
- Светлые или яркие бренды: дизайн только тёмный
- Дизайнеры, чьи работы — в основном изображения
- Сайты компаний и интернет-магазины
Как пользоваться
В Claude или ChatGPT
Используйте навык PopNow «Сайт-портфолио разработчика» (developer-portfolio-website) для этой задачи: Сделайте мой личный сайт. Я бэкенд-разработчик из Берлина; резюме, три проекта и две статьи для блога лежат в ./notes.
В агенте для кода
/popnow-developer-portfolio-website Сделайте мой личный сайт. Я бэкенд-разработчик из Берлина; резюме, три проекта и две статьи для блога лежат в ./notes.
Потом попробуйте
Сделайте фон для четвёртого проекта в том же тёмном каменном стиле, но сначала назовите цену.
Уберите раздел с докладами и переделайте Uses в «Процесс».
Что подготовить
- Места работы, даты и конкретные результаты
- От двух до шести проектов с задачей, ключевыми решениями и итогами
- Статьи, доклады, репозитории и инструменты, которые у вас действительно есть
- Ваш портрет и реальные фото с мероприятий
Похожие навыки
Смотреть все →3D-конструктор аватаров
+3Соберите милого плюшевого 3D-персонажа прямо в браузере и сохраните его как прозрачный PNG или 3D-страницу.
Календарная тепловая карта активности
+3Год ежедневной активности в виде календарной сетки с заливкой — с сериями, итогами и управлением с клавиатуры.
Лендинг SaaS с ИИ
+3Песочный фон, тонкие направляющие и штриховка вокруг живой канбан-доски, где ассистент планирует задачи.
Анимированный первый экран сайта
+3Первый экран лендинга с плавно сменяющимся словом в заголовке, двумя кнопками и широкой рамкой для изображения.
Сайт агентства с шейдерным героем
+3Живой оранжевый шейдерный герой под крупным заявлением, навигация-таблетка и сетка кейсов.
Тёмный лендинг для SaaS
+3Тёмный маркетинговый сайт с насыщенной анимацией для программного продукта — в одном автономном HTML-файле.
Сайт портфолио дизайнера
+3Шесть наклонённых карточек вокруг заголовка на сером фоне, красная карточка портрета и кейсы.
Редакционный сайт SaaS
+3Тёмно-синий разделённый герой, заголовок с засечками рядом с документальным кадром и кобальтовый акцент.
Шаблон сайта в стиле глассморфизма
+3Матовые стеклянные таблетки на почти чёрном фоне, крупный заголовок с засечками и подписка.
Сайт аппаратного продукта
+3Огромные тонкие названия моделей на студийных кадрах, матовые карточки характеристик и линейка в масштабе.
Интерактивная схема архитектуры
+3Офлайн-схема системы, по которой можно кликать: построена из проверенной JSON-модели, с обоснованием для каждого блока.
Интерактивный герой с сеткой
+3Тёмная сетка тонких нитей, которая гнётся к курсору, и светящееся кольцо от каждого клика.
Граф знаний из заметок
+3Превратите заметки проекта в офлайн-граф с поиском, где каждое утверждение ведёт к строке источника.
Шаблон KPI-дашборда
+3Четыре KPI-плитки с чипами изменений, линейный график, таблица разбивки и целевые полосы на тёплой бумаге.
Лендинг из ИИ-макетов
+3Сначала три полноэкранных макета на выбор, затем ваш агент собирает выбранный как чистый адаптивный код.
Шаблон сайта журнала
+3Сайт журнала с качеством печатного издания: статьи, рубрики, небольшой магазин и подписка — в одном HTML-файле.
Герой с анимацией частиц
+3Текст на тёплой бумаге рядом со сферой из чернильных и бирюзовых точек, меняющей форму под каждую идею.
Сайт личного бренда
+3Портрет, растворённый в тёплой бумаге под тонкой скобкой, с лёгким и жирным заявлением по бокам.
Кинематографичная страница запуска продукта
+3Почти чёрная страница в свете премьеры: заголовок с засечками, ночная сцена в letterbox и форма брони.
Шаблон админ-панели
+3Рабочая консоль бэк-офиса с графиками, таблицами, канбаном и календарём — в одном офлайн-HTML-файле.
Шаблон лендинга для SaaS
+3Спокойный светлый маркетинговый сайт для программного продукта с рабочей консолью продукта, ценами и регистрацией.
Сайт-портфолио в стиле скрапбукинга
+3Многостраничное онлайн-резюме из бумажных предметов, с кейсами и версией резюме для печати.
Шаблон сайта магазина кроссовок
+3Полноценный магазин обуви или одежды с каталогом, карточками товаров, корзиной и демо-оформлением заказа в одном HTML-файле.
Лендинг автоматизации процессов
+3Графитовая страница, небольшой заголовок слева и живой граф узлов: запускается, повторяет попытку, пишет логи.
Вопросы
Почему обложки проектов — не скриншоты?
Каждая обложка — это небольшой интерфейс продукта на HTML и CSS с данными из вашей предметной области. Она остаётся чёткой при любом размере, совпадает по цветам с сайтом и никогда не показывает приватные данные с реального экрана.
Нужен ли для этого PopNow?
Нет. Встроенные фоны в тонах камня и песка подходят для ваших проектов, а для докладов можно использовать нарисованные миниатюры. PopNow нужен по желанию — для новых фонов, фото рабочего места или портрета с цветокоррекцией, и цена каждого запуска называется заранее.
Что, если у меня нет докладов или открытых репозиториев?
Разделы без реального содержания удаляются вместе со ссылками на них. Навык никогда не придумывает доклады, репозитории, число звёзд или клиентов для реального человека.
Можно ли встроить сайт в моё приложение на Next.js?
Да. Навык определяет стек, не трогает посторонние файлы и пересобирает те же маршруты в виде настоящих страниц с теми же токенами и шрифтами.