---
name: design-like-google
description: "Turn a product's purpose into a distinctive identity and an instantly clear experience, with Google-level craft."
---

# Design like Google

Purpose:: Turn a product's purpose into a distinctive identity and an immediately understandable experience, with the craft and family coherence of Google's products.

Rules::
- Inherit principles, specialise expression: shared interaction, accessibility and type hierarchy; each product owns its symbol, accent, imagery and signature behaviour
- Make the complicated feel approachable: the essential object or action in the centre, short human language, advanced options revealed when relevant
- Typography does the work: display, headline, title, body and label roles; large regular weight can feel confident, bold has a different job
- Compose around attention: one clear priority per view, a repeatable spacing rhythm, supporting controls quieter than content
- Color and shape have roles: identity accents apart from status colors, contrast checked in real components and dark mode, a small shape scale
- One signature behaviour with an origin, destination and reason; support reduced motion
- Trust is the finish: visible focus, keyboard use, readable contrast, comfortable targets, useful loading, empty and error states

Inventory::
- Product name, narrative, audience, primary task, existing brand assets, target surfaces
- Google Sans Flex on Google Fonts; Material Color Utilities for tonal schemes

Steps::
1. Frame: one sentence each for the user need, the promise and the feeling; name the primary object, action and hardest state
2. Explore: a few materially different concepts, each shown with real copy, type, palette, mark and one screen
3. Systemize: exact tokens, assets, component variants, tone and signature behaviour; one canonical definition per decision
4. Apply: build the real surface with real content; recompose for desktop and mobile
5. Refine: render and inspect fonts, line breaks, spacing, color, loading, failures, narrow layouts and keyboard use; fix specific weaknesses

Metrics::
- A first-time visitor understands the promise and the next action
- The product is recognisable without oversized branding
- The identity survives tiny icons, large displays, monochrome and dark mode
- The important journey works with realistic content and bad states

Source:: https://isklls.com/skills/design-like-google (iSklls, free skill library)