Initials CX Prototype

Master Design → Retail Touchpoints

A working dashboard concept for agent-led adaptation: ingest a master creative, detect pink marked areas, generate flat visuals, apply them to in-situ store visuals, QA, and export a human-editable handoff pack.

{activeTab === "dashboard" && (

Project Setup

Upload the source material required by the agents.

Workflow Progress

Current MVP run status.

{progress}% complete

{workflowSteps.map((step, index) => (

0{index + 1} {index === 0 ? : index === 1 ? : }

{step}

))}

Touchpoint Queue

Files waiting for detection, flat generation, mockup application, and approval.

{touchpoints.map((tp) => ( ))}

Touchpoint	Type	Mask	Ratio	Risk	State
{tp.name}	{tp.type}		{tp.ratio}		{tp.state}

Agent Control Room

Select an agent to view its responsibilities.

{agents.map((agent) => ( setSelectedAgent(agent)} /> ))}

{selectedAgent.name}

{selectedAgent.purpose}

Inputs

{selectedAgent.inputs.map((item) => {item})}

Outputs

{selectedAgent.outputs.map((item) => {item})}

{selectedAgent.checkpoint}

)} {activeTab === "workflow" && ( {agents.map((agent, index) => { const Icon = agent.icon; return (

Agent {index + 1}

{agent.name}

{agent.purpose}

Inputs

• {x}

Outputs

• {x}

Human checkpoint: {agent.checkpoint}

); })} )} {activeTab === "schema" && (

Core Data Contract

This JSON structure is the backbone of the workflow. It lets every agent know what assets exist, what the creative hierarchy is, where the touchpoint adaptation area sits, and what outputs are required.

{["Project metadata", "Master design rules", "Touchpoint mask geometry", "Adaptation rules", "Output requirements"].map((item) => (

{item}

))}

Example Project JSON

{sampleSchema}

)} {activeTab === "mvp" && ( {mvpPlan.map((mvp, index) => (

0{index + 1}

{mvp.title}

Scope: {mvp.scope}

Output: {mvp.output}

Value: {mvp.value}

))}

Recommended next build step

Build MVP 1 as a local or web-based prototype that accepts one master visual, one rules JSON, and three to five JPEG touchpoints. The first measurable success criterion is reliable pink-mask detection plus credible flat artwork placement into the in-situ visual.

)}