## Phase 1 — Website concept and roadmap

Take on the role of a team that brings together performance engineers, front-end engineers, senior UI/UX designers and award-winning creative directors.

Task: design and build a website of agency quality for [brand / product] that gives visitors a premium experience.

Deliver:
- the complete information architecture
- the visual identity
- the animation system
- responsive layouts
- the conversion strategy
- an accessibility plan
- an implementation roadmap

## Phase 2 — Cinematic scroll and motion

Website: [website / brand]

Take on the role of a world-class designer of digital experiences.

Task: turn my website into an immersive storytelling experience built with modern web technologies.

Design:
- transitions between sections
- storytelling driven by scrolling
- page reveals
- motion principles
- interactive scenes
- cursor interactions
- micro-animations
- the visual pacing

For every interaction, explain how it serves the user's journey instead of pulling attention away from it.

## Phase 3 — Premium design system

Website: [website / brand]

Take on the role of an award-winning product designer.

Task: build a full design system for my website covering:
- typography
- spacing
- grids
- color palette
- component library
- navigation
- buttons
- forms
- cards
- iconography
- motion guidelines
- responsive behavior
- accessibility standards

Every design choice must support one coherent, premium brand identity.

Constraints: the design system must scale, and it must be optimized for easy maintenance.

## Phase 4 — Interactive landing page

Take on the role of a creative director and UX strategist focused on conversions.

Product or service: [product / service]

Task: design a premium landing page for it that makes a first impression people remember.

Sections to include:
- hero experience
- interactive showcase of the product
- storytelling around the features
- testimonials
- pricing
- FAQ
- calls to action built for conversion

For every section, suggest animations and interactions that keep the page usable and fast.

## Phase 5 — Front-end implementation blueprint

Website: [website / brand]

Take on the role of a senior front-end architect.

Task: produce a full blueprint for building this website with modern web technologies.

Cover:
- project structure
- reusable components
- animation architecture
- responsive layouts
- performance optimization
- SEO
- accessibility
- testing strategy
- analytics integration
- deployment workflow

For each major technical decision, explain the trade-offs.

## Phase 6 — Tasks for AI-assisted development

Website: [website / brand]

Take on the role of an expert software engineer who builds with AI.

Task: split the website into implementation tasks that suit development with an AI assistant.

For every section, provide:
- development prompts
- testing checklists
- accessibility validation
- responsive requirements
- performance benchmarks

Constraints: the workflow must be production-quality, and fast to develop with no loss of quality.

## Phase 7 — Performance, SEO and accessibility optimization

Website: [website / brand]

Take on the role of a specialist in web performance, SEO and accessibility.

Task: optimize my website for:
- Core Web Vitals
- responsive performance
- accessibility compliance
- structured data
- image optimization
- caching
- lazy loading
- visibility in search engines
- analytics

Then write a complete quality assurance checklist to run before launch.

Constraints: performance comes first in every optimization.

## Phase 8 — Full agency build and launch plan

Website: [website / brand]

Take on the role of a coordinated digital agency whose team includes a creative director, a brand strategist, a UI/UX designer, a front-end engineer, a motion designer, a copywriter, an SEO specialist and a conversion strategist.

Task: build a complete website of agency quality, from the first concept all the way to launch.

Include:
- branding
- storytelling
- page layouts
- animation systems
- design system
- implementation guidance
- optimization strategy
- analytics setup
- deployment plan
- maintenance recommendations