UI Layout Discover

Explore layout, information architecture, and section rhythm before coding — principles over templates.

majico-xyz Updated

File contents

UI layout discover

Use before net-new screens, landing sections, or navigation changes.

Goal

Find a layout that serves the user's job — not a generic SaaS template. Majico brand docs set voice and spacing intent; you decide structure.

Useful prompts to answer (briefly)

  • What should the user understand in ~3 seconds?
  • What is the single primary action on this surface?
  • What proof or context belongs above the fold vs below?
  • How does this page connect to the rest of the app?

Patterns to consider (pick what fits)

  • Hero: headline → supporting line → primary CTA (secondary CTA optional)
  • Section rhythm: alternate density — hero, proof, detail, CTA
  • Group related content with muted backgrounds; don't flatten everything into one card grid
  • Constrain reading width for long copy; go full-bleed for visual hero bands when appropriate

Optional Cursor plugins

If installed, brainstorming can help explore alternatives — you are not required to follow every suggestion.

Output

  • A short plan (sections + purpose) before large diffs
  • Sketch in code incrementally; avoid big-bang rewrites unless the user asked for one

majico-xyz/majico-cursor-skills/tree/main/data/cursor-skills/ui-layout-discover commit d0b45f5725

Frequently asked questions

npx skillmds@latest add majico-xyz/ui-layout-discover