# Claude Design: review motion, slides, websites and app mockups

Choose an output for its actual purpose and keep the research-preview limitations visible.

[HTML](https://lukejbyrne.com/library/guides/i5yggqbq6pc/)
Content language: en
Author: Luke Byrne
Video published: 2026-04-21
Guide published: 2026-11-02

[Watch the video](https://www.youtube.com/watch?v=i5yggQBq6Pc)
Video language: English

## Choose the use case before asking for a design

The 21 April 2026 description introduces Claude Design through four applications: motion graphics, presentations, multi-page websites and iOS app mockups. It explicitly describes research-preview status and usage limits. Begin with the output you need, because an attractive animation, a readable slide and a usable application screen require different checks.

1. Use the overview at 0:40 to orient yourself before following a specific demonstration.
2. For motion graphics, start at 1:10 and define the message and visual sequence you want to explain.
3. For presentations, follow 2:45 and check that the sequence makes sense when read as a complete argument, not just isolated slides.

## Inspect websites and mockups as different deliverables

Website design begins at 5:05 and iOS mockups at 7:00. A mockup shows an intended interface; it does not establish a functioning mobile application. Likewise, a multi-page visual design should be inspected across its pages rather than judged from a single attractive opening screen.

1. Write the main visitor task for the website and follow its proposed route across the pages.
2. Compare repeated navigation, headings and content hierarchy so the design remains understandable beyond the homepage.
3. For the app mockup, inspect the screens as a user journey and identify which behaviours remain proposals rather than implemented interactions.

## Use the design system to constrain revisions

At 7:55 the walkthrough adds design systems for consistent branding, followed by the preview discussion at 9:40. Carry approved typography, colours and component choices into later outputs. Consistency is useful when it supports the task; it should not hide unclear text or a missing screen.

1. Choose one set of brand decisions and compare all four output types against the parts relevant to them.
2. Request a targeted revision to a weak screen or passage, then check that it preserves the agreed identity.
3. Review the current usage conditions before planning a larger batch; the title’s ten minutes describes the walkthrough, not guaranteed mastery or delivery time.

## The takeaway

Use the four demonstrations to choose an appropriate prototype, then review its actual purpose and consistency before further production.

## Workflow resources

- [getark.app](https://getark.app)

## Chapters

- [0:00 Claude Design & Usage Limits](https://www.youtube.com/watch?v=i5yggQBq6Pc&t=0s)
- [0:40 Interface Overview](https://www.youtube.com/watch?v=i5yggQBq6Pc&t=40s)
- [1:10 Building Motion Graphics](https://www.youtube.com/watch?v=i5yggQBq6Pc&t=70s)
- [2:45 Crafting Presentations](https://www.youtube.com/watch?v=i5yggQBq6Pc&t=165s)
- [5:05 Designing Websites](https://www.youtube.com/watch?v=i5yggQBq6Pc&t=305s)
- [7:00 iOS App Mockups](https://www.youtube.com/watch?v=i5yggQBq6Pc&t=420s)
- [7:55 Bonus: Design Systems](https://www.youtube.com/watch?v=i5yggQBq6Pc&t=475s)
- [9:40 Research Preview & Potential](https://www.youtube.com/watch?v=i5yggQBq6Pc&t=580s)

## Sources and limitations

Prepared 2 November 2026 from this exact published description and chapters. The recording was not independently watched or transcribed and no fresh hands-on test was performed. Steps are editorial adaptations; current setup, availability and offer terms may differ.

[Original video](https://www.youtube.com/watch?v=i5yggQBq6Pc)