skills.rest
KhaledMKhaled
KhaledMKhaledCOMMUNITY
Explore all skills by this author →
GitHub

design

Delegate frontend UI design to a specialized DESIGN subagent.

Updated Dec 10, 2025
Search Tags:#ui/ux#frontend design#creative brief#subagent delegation#mockup sandbox#fullstack integration#design system guidance
One-click install
npx skills add https://github.com/KhaledMKhaled/FodaStore --skill design-khaledmkhaled
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design
Source: https://github.com/KhaledMKhaled/FodaStore/tree/main/.local/skills/design
Command: npx skills add https://github.com/KhaledMKhaled/FodaStore --skill design-khaledmkhaled

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It helps you offload frontend UI and visual decision-making to a specialized DESIGN subagent so you can focus on product planning while still getting a cohesive, build-ready interface.

Core Features & Use Cases

  • Frontend design delegation: Create a rich creative brief describing what to build and who it’s for, then let the DESIGN subagent handle all presentation decisions.
  • Fullstack or mockup flows: Use it for real fullstack apps (where it wires UI to provided hooks and data) or for mockup sandboxes (where it explores standalone visual concepts without backend).
  • Trust-first initial builds: In fullstack mode, prioritize working navigation and real data CRUD flows, including “wow” views you planned.

Quick Start

Launch the design subagent with specialization set to "DESIGN" and provide a task that includes the product identity, target users, required pages/routes, data types, available API hook signatures, and relevant files to integrate.

Frequently Asked Questions about design

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I delegate frontend UI design to a subagent for fullstack apps?▼

You can delegate frontend UI design by launching a subagent with specialization set to "DESIGN" and providing a creative brief that includes product identity, target users, required routes, available API hook signatures, and relevant files for integration.

What is a creative brief-driven approach for frontend design delegation?▼

A creative brief-driven approach provides the DESIGN subagent with product identity, target users, required pages, data types, and API hooks, allowing it to take full creative freedom over presentation and visual decision-making.

Can I use this design delegation approach for mockup sandboxes without a backend?▼

Yes, you can use this approach for mockup sandboxes to explore standalone visual concepts without a backend, or for real fullstack apps where the subagent wires UI components to provided API hooks and real data flows.

What do I need to include in my task description for the DESIGN subagent?▼

Your task description needs to include product identity, target users, required pages or routes, data types, available API hook signatures, and relevant files to integrate so the DESIGN subagent can generate a cohesive, build-ready interface.

How does trust-first initial build work for frontend design?▼

A trust-first initial build prioritizes working navigation and real data CRUD flows, including any planned "wow" views, by wiring the UI directly to provided API hooks and real-data behavior for the first build.

Related Skills

Explore More Design & Creative Skills→
GroundMountCompanyGroundMountCompany

ai-creative-strategist

Produce research-driven creative briefs with visual direction previews and production prompts.

Community
Advanced
TheBushidoCollectiveTheBushidoCollective
187

sentry-alerts-issues

Manage Sentry alert rules, issue triage, and notification routing across projects.

Official
Advanced
csim-sgcsim-sg

frontend-design

Design and implement frontend interfaces with cohesive aesthetic direction.

Community
Intermediate
Exocore-OrganizationExocore-Organization
5

react-vite

Orchestrate React + Vite frontend builds in a pnpm monorepo with a design subagent.

Official
Advanced