Все проекты
AI Community · 2025

Promty

Библиотека промптов для AI-генерации изображений: сообщество делится готовыми рецептами вместо метода проб и ошибок.

Full-Cycle DevCommunityDesign System
Promty
01

Проблема

Я сам тратил много времени на подбор формулировки промпта: генерируешь картинку, результат не тот, меняешь пару слов, генерируешь снова — и так по кругу, пока не нащупаешь то, что нужно. Хороший, точно работающий промпт — на деле маленький продукт сам по себе, но каждый изобретает его заново вместо того, чтобы взять готовый и проверенный.

02

Ресёрч

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

03

Гипотеза

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

04

Дизайн

Дизайн-систему собирал вокруг ощущения дружелюбности вместо строгого SaaS-интерфейса: карточка-превью 2×2 с примерами результата (чтобы решение купить или скопировать промпт принималось визуально, а не по описанию), тёплая бежево-персиковая палитра вместо холодного tech-синего, мягкие скругления и Plus Jakarta Sans для текста. Главным решением стал маскот — овечка Promty. Идея выросла из иллюстрации одного художника, который рисовал овец забавно вытянутыми — тело каплей и торчащие чёрные ножки; мне понравилась эта форма, и я сделал свою векторную версию, а затем прогнал через AI-генерацию, чтобы увидеть её в объёме и разных сценах. Имя пришло раньше самого персонажа — от слова «prompt» с уменьшительным «-y», получилось «Promty»; когда стал придумывать, кем может быть маскот, вспомнил про эту овечку и понял, что имя ей подходит идеально. Она живёт в интерфейсе: встречает на пустых состояниях и в поиске без результатов («БэЭэ... Promty ничего не нашёл»), делая механические экраны-заглушки на самом деле приятными.

05

Вёрстка

Собрал интерфейс на Next.js 15 (App Router) и CSS Modules — без Tailwind, чтобы полностью контролировать компонентные стили и не тащить лишнее в бандл. Архитектура по Feature-Sliced Design (entities/features/shared/widgets) держит UI-кит переиспользуемым: один компонент кнопки на все случаи (default/outline/ghost × sm/md/lg), общие модалки для авторизации, создания и модерации промптов. Отдельно реализовал переключение темы (светлая/тёмная/системная) и адаптивную сетку карточек.

Как рождался маскот

От референса до персонажа

Promty — этап 1
Promty — этап 2
Promty — этап 3
Что внутри

Ключевые механики

Модерация и роли

Публикация промпта проходит проверку модератора с возможностью отклонить и указать причину. Роли USER/ADMIN/SUPER_ADMIN разграничивают доступ к панели администратора.

Личный кабинет автора

Вкладки «Готовые / На проверке / Отклонённые» показывают статус каждого промпта, с полным редактированием изображений и текста.

Поиск, фильтры, авторитет

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

Дизайн-система с характером

Единый компонент кнопок и модалок на CSS Modules, светлая/тёмная/системная тема, и маскот-овечка, оживляющий пустые состояния и ошибки.

Интерфейс

Скриншоты

Promty — скриншот 1
Promty — скриншот 2
Promty — скриншот 3
Promty — скриншот 4
Promty — скриншот 5
Promty — скриншот 6
Promty — скриншот 7
Promty — скриншот 8
Promty — скриншот 9
Технологии
Next.js 15 (App Router)TypeScriptPrisma + PostgreSQLNextAuth.jsCSS Modules
Следующий проект

Mestum