# Design (/use-cases/design)



Design teams use Helio to get from a positioning line or a feature brief to reviewed, shippable output: naming and brand guidelines, a UI prototype with interaction notes spelled out, or a same-day fix for UI feedback that would otherwise die in a chat thread. A human always reviews before anything ships.

<LivePreview
  component="AssistantChat"
  scenario="{ assistantName: &#x22;Designer&#x22;, messages: [
{ author: &#x22;user&#x22;, text: &#x22;We need a UI for saved searches: users can save a filtered view and get notified on new matches. Start with structure, not visuals, I want to review that first.&#x22; },
{ author: &#x22;assistant&#x22;, text: &#x22;Starting with information architecture, not visuals, like you said. I'll map the save-search → notify → review-matches flow first and hand that back before touching anything visual.&#x22; },
] }"
/>

## What an AI teammate can do here [#what-an-ai-teammate-can-do-here]

* **Brand basics**: naming candidates with reasoning, a slogan, visual keywords, and a color direction
* **Information architecture**: screen and flow structure, before any visual design starts
* **Prototypes**: low-fidelity for structure review, raised to high fidelity once confirmed
* **Interaction notes**: click/tap behavior, loading/empty/error states, and edge cases spelled out
* **Usability review**: checks a design against a checklist and flags gaps, on request or on a schedule
* **UI feedback triage**: pulls feedback out of chat every morning, routes small fixes straight to an engineer for a same-day PR, and sends anything ambiguous to a human designer instead of a guess

## A typical workflow [#a-typical-workflow]

**You're launching something new and need a name.** Give your Content Creator the positioning line, and they propose naming directions with reasoning, a slogan, and a color direction. Once you pick one, it becomes the standing guideline every future asset gets checked against.

**You have a feature brief.** Your Designer starts with information architecture, not visuals, so you review the structure before anything gets polished. Once you confirm it, they raise it to high fidelity and document what happens on click, hover, and every edge-case state engineering will need.

**UI feedback keeps dying in a chat thread.** A daily digest pulls it out of every design channel. Small, unambiguous fixes go straight to an engineer teammate for a same-day PR; anything that needs real design judgment gets routed to a human designer instead of being guessed at.

## Recommended setup [#recommended-setup]

| Teammate           | Template                                                         | Key skills to add |
| ------------------ | ---------------------------------------------------------------- | ----------------- |
| Brand / naming     | Content Creator                                                  | Notion            |
| UI / prototype     | UI Designer                                                      | Figma, Notion     |
| UI feedback triage | Group Chat Summary & Actions Assistant + Code Development Expert | GitHub            |

Browse the full catalog in [Skills & Plugins →](/connect/skills-and-plugins).

**Trust level suggestion:** Standard. A human reviews structure and taste before anything ships, and that doesn't change with Helio.

## Playbooks [#playbooks]

<Cards>
  <Card title="Create brand guidelines" href="/use-cases/design/brand-guidelines" description="Turn a positioning line into naming, tone, and a guideline every asset gets checked against." />

  <Card title="Design a UI prototype" href="/use-cases/design/ui-interaction-design" description="Spell out structure, states, and edge cases before anything gets built." />

  <Card title="Catch UI feedback and ship the fix" href="/use-cases/design/usability-review" description="A daily digest triages feedback into a same-day PR or a designer's queue." />

  <Card title="Verify a PR's UI end to end" href="/use-cases/design/pr-ui-verification" description="Confirm identity, open the real preview, and report visual, frontend, and end-to-end results separately." />
</Cards>

## Next steps [#next-steps]

<Cards>
  <Card title="Hire an AI teammate" href="/ai-teammates/hire-an-ai-teammate" description="Set up your first AI teammate for design work." />

  <Card title="Give instructions" href="/ai-teammates/give-instructions" description="Define your visual and brand standards in their instructions." />
</Cards>