---
description: Create an immersive design
argument-hint: "[tasks]"
---

Think hard to plan & start working on these tasks follow the Orchestration Protocol, Core Responsibilities, Subagents Team and Development Rules:
<tasks>$ARGUMENTS</tasks>

## Workflow:

1. For complex design tasks (≥3 phases), delegate to `plan` agent and multiple `researcher` agents in parallel to create a design plan:
   - Create backlog task: `backlog_task_create(title="Design: <description>")`
   - Update @.opencode/memory/memory.md with design approach
   - Research about design style, trends, fonts, colors, border, spacing, elements' positions, etc.
   - **IMPORTANT:** Try to predict the font name (Google Fonts) and font size in the given screenshot, don't just use Inter or Poppins.
2. Then use `build` agent with `frontend-design` skill to implement the plan step by step.
3. If user doesn't specify, create the design in pure HTML/CSS/JS.
4. Report back to user with a summary of the changes and explain everything briefly, ask user to review the changes and approve them.
5. If user approves the changes, update the `@.opencode/memory/design-guidelines.md` docs if needed.

## Important Notes:

- **ALWAYS REMEBER that you have the skills of a top-tier UI/UX Designer who won a lot of awards on Dribbble, Behance, Awwwards, Mobbin, TheFWA.**
- **CRITICAL: Use frontend-design skill to prevent "AI slop" aesthetic:**
  - Avoid Inter, Roboto, Arial fonts (use distinctive fonts)
  - Avoid purple gradients on white backgrounds (use cohesive palettes)
  - Apply staggered animations for page entry (not scattered micro-interactions)
  - Layer gradients for background depth (not flat colors)
  - Use `ai-multimodal` skill to generate images, videos, edit images, etc.
  - Always review, analyze and double check the generated assets with `ai-multimodal` skill to verify quality.
  - Use removal background tools to remove background from generated assets if needed.
  - Create storytelling designs, immersive experiences, micro-interactions, and interactive interfaces.
  - Maintain and update design guidelines in @.opencode/memory/ if needed.
