intermediate·Creative & Design·Half day

Full App Design

User flows, wireframe descriptions, component specs, responsive considerations, a11y requirements, and a design-system recommendation.

⬡

Recommended modelGPT-5.5 Instant

Best visual reasoning for creative direction

What you need to fill in

[web app/dashboard/mobile app][use case][list][systems][describe]

Tools used

Claude

The prompt

"Design a [web app/dashboard/mobile app] for [use case]. Requirements: - User types: [list] - Key features: [list] - Must integrate with: [systems] - Brand guidelines: [describe] Please provide: 1. User flow diagrams 2. Wireframe descriptions 3. Component specs 4. Responsive considerations 5. Accessibility requirements 6. Design system recommendations Output as structured documentation."

Open in ChatGPT

Sample output

**Primary flow (new user)** 1. Sign up → email verify → onboarding tour (skippable) 2. Empty state → choose first task → wins (badge, confetti) 3. Day-2 nudge → return + retain **Wireframes (described)** - Home: top hero, three-card empty-state, primary CTA - Detail: left meta column, main content, right rail with related items - Settings: 3-tab layout, sticky save bar **Responsive:** breakpoints 640 / 768 / 1024 / 1280; mobile uses bottom-nav, desktop uses side rail. **A11y:** WCAG 2.1 AA contrast, focus rings on all interactive elements, keyboard-first nav, prefers-reduced-motion respected.

Try with these tools

midjourney dall e 3 runway

ux-designwireframesdesign-systemhalf-day

More in Creative & Design

Page Layout Help

A suggested layout, a colour scheme, an essentials list, the most common mistakes to avoid, and free tool picks.

beginner

Design System Build

A component architecture, token structure, code examples, documentation template, and governance process — across Figma + React + Storybook.

advanced

Chart Selection Help

Chart-type picks per metric, clarity tips, a colour scheme, the labels/annotations you need, and tool suggestions.

beginner