Color Grading LUT Broker
Lovable AI runs a marketplace agent negotiating custom LUT bundle prices via UCP so photographers sell presets automatically.
The kernel.
Photographers press one button and the full agentic-commerce stack runs end-to-end for digital asset licensing — AP2 intent → A2A negotiation → UCP checkout → AP2 payment — every artifact rendered for review.
Why this primitiveBuyers sign preset budget mandates, agents negotiate bundle prices with creators, and UCP checks out the digital asset instantly.
Required key.
Add this in your Lovable project under Settings → Secrets before pasting the prompt below.
The build prompt.
Paste into a fresh Lovable project. Make sure the key above is set first. read the build strategy →
Build "Color Grading LUT Broker" as a ONE-SHOT Lovable build. The participant has only
5 credits — this single message must produce a working demo with no follow-ups.
Single-page TanStack Start app. Cut scope ruthlessly.
CONCEPT
Lovable AI runs a marketplace agent negotiating custom LUT bundle prices via UCP so photographers sell presets automatically.
Discipline: Photography (digital asset licensing).
Recipe: Full Agentic Loop (UCP + A2A + AP2) as the single agentic surface.
Why this kernel: Buyers sign preset budget mandates, agents negotiate bundle prices with creators, and UCP checks out the digital asset instantly.
LOVABLE BUDGET (HARD CAP: ONE-SHOT, ~5 CREDITS TOTAL):
The participant has FIVE Lovable credits for the whole build. This prompt MUST
ship a working demo on the FIRST message with zero follow-ups. Engineer for that.
- ONE TanStack Start app, ONE route (`src/routes/index.tsx`). No extra pages, no auth, no nav.
- ONE TanStack server function in `src/lib/agent.functions.ts` that runs the protocol.
- ONE client surface (a textarea + button) that triggers the server fn and renders the result.
- NO database, NO Lovable Cloud, NO auth, NO file uploads, NO extra integrations.
- NO tests, NO docs pages, NO settings screens, NO theming toggles.
- Libraries: template defaults + `zod` + `ai` + `@ai-sdk/openai-compatible`. Nothing else.
- Demo-fallback contract: every code path must boot with NO secrets and return
realistic JSON flagged `simulated: true`. Real LLM calls activate only when
`LOVABLE_API_KEY` is present (auto in Lovable).
STACK
- TanStack Start app, the index route only.
- Agent brain: Lovable AI Gateway via the AI SDK, called from a `createServerFn` handler so the key stays server-side.
- Protocol surface: Full Agentic Loop as defined below.
- Client surface fits the kernel: a prompt box (and any minimal extra inputs) that returns the agent's output.
- Tailwind + shadcn. Editorial look: gold accent on a dark or warm-cream background,
generous type, one strong headline, one primary action.
- Footer renders: "Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14".
GATEWAY HELPER (src/lib/ai-gateway.server.ts) — Lovable AI Gateway provider:
```ts
import { createOpenAICompatible } from "@ai-sdk/openai-compatible";
/** Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14 */
export function lovableGateway(apiKey: string) {
return createOpenAICompatible({
name: "lovable",
baseURL: "https://ai.gateway.lovable.dev/v1",
headers: { "Lovable-API-Key": apiKey, "X-Lovable-AIG-SDK": "vercel-ai-sdk" },
});
}
```
Install once: `bun add ai @ai-sdk/openai-compatible zod`.
SERVER FUNCTION (src/lib/agent.functions.ts) — Full agentic loop (UCP + A2A + AP2):
```ts
import { createServerFn } from "@tanstack/react-start";
import { generateText } from "ai";
import { z } from "zod";
import { lovableGateway } from "@/lib/ai-gateway.server";
/** Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14 */
export const run = createServerFn({ method: "POST" })
.inputValidator((d) => z.object({ goal: z.string().min(1).max(500), cap_minor: z.number().int().positive().default(5000) }).parse(d))
.handler(async ({ data }) => {
const key = process.env.LOVABLE_API_KEY;
const speak = async (role: string, ctx: string) => {
if (!key) return `[demo ${role}] ${ctx.slice(0, 110)}`;
const { text } = await generateText({
model: lovableGateway(key)("google/gemini-2.5-flash"),
prompt: `You are the ${role} in an agentic-commerce loop for digital asset licensing. ${ctx} Reply with ONE sentence.`,
});
return text.trim();
};
// 1. AP2 IntentMandate — user grants bounded authority.
const intent = { type: "IntentMandate", goal: data.goal, max_minor: data.cap_minor, currency: "USD",
reasoning: await speak("buyer", `Open intent for ${data.goal} with cap ${data.cap_minor}.`) };
// 2. A2A negotiation — buyer asks seller for a quote.
const a2a_offer = { kind: "data", mimeType: "application/vnd.ap2.mandate.intent+json", data: intent };
const cart = { type: "CartMandate", items: [{ name: "digital asset licensing package", price_minor: Math.min(data.cap_minor, 4200) }],
total_minor: Math.min(data.cap_minor, 4200), currency: "USD",
reasoning: await speak("seller", `Quote cart for ${data.goal}.`) };
// 3. UCP collapse — price is fixed; emit a signed order envelope.
const ucp_order = { order_id: `ucp-${crypto.randomUUID()}`, items: cart.items, total_minor: cart.total_minor,
currency: "USD", signature: { alg: "hmac-sha256", sig: "stub", keyid: "demo" } };
// 4. AP2 PaymentMandate — settle inside the intent rails.
const payment = { type: "PaymentMandate", cart_ref: "demo-hash", tx: "0xsimulated",
reasoning: await speak("buyer", `Accept cart and settle within intent cap.`) };
return {
transcript: [
{ step: "intent", payload: intent },
{ step: "a2a-offer", payload: a2a_offer },
{ step: "cart", payload: cart },
{ step: "ucp", payload: ucp_order },
{ step: "payment", payload: payment },
],
meta: { simulated: !key, kernel: "agentic-loop" },
};
});
```
CLIENT (in `src/routes/index.tsx`): textarea for the goal + a number input for the
spend cap + "Run full loop" button. Render the transcript as a labelled timeline:
Intent → A2A Offer → Cart → UCP Order → Payment. Each card shows the JSON and any
`reasoning` line. Flag `simulated: true` clearly when no key.
USER FLOW (the entire app — nothing else exists)
1. Land on the page; the headline previews what the agent does for digital asset licensing.
2. The primary action (a single 'run negotiation' button that streams the full transcript — intent, A2A bubbles, UCP order, payment mandate — into one auditable feed) is one tap away; the rest of the layout supports it.
3. The server fn runs the protocol, the result lands on screen, the user can retry, copy, or audit.
KEYS (Lovable AI first, AIsa AI fallback):
1. `LOVABLE_API_KEY` — PRIMARY agent brain. Auto-provisioned by Lovable. Used
server-side to call Lovable AI Gateway (Gemini, Claude, GPT) for every
reasoning step. Never expose to the client; read only via
`process.env.LOVABLE_API_KEY`. This is the default code path.
2. `AISA_API_KEY` (OPTIONAL FALLBACK) — only set if Lovable credits are
exhausted or a specific frontier model from https://aisa.one is required.
The server fn should try Lovable first and fall back to AIsa only if
`LOVABLE_API_KEY` is missing.
The demo MUST still boot with zero secrets and return realistic `simulated:true`
envelopes — that demo-fallback contract is non-negotiable (see UCP × A2A × AP2 spec).
CREDIT (must appear in UI footer AND as JSDoc on the server function):
Built during the Creative AI & Quantum Hackathon organised by StreetKode Fam during Indian Krump Festival 14
Market sizing.
Indicative figures for hackathon pitches — refine with your own research before raising.