popular-web-designs

name	Popular Web Designs
skill_id	popular-web-designs
description	Guides reference-aware website and landing-page work so the result feels intentional, current, and product-grade instead of generic.
version	1.0.0
source_kind	elephant-builtin
aliases	["popular web designs","modern web design","landing page design"]
trigger_phrases	["make this look like a modern product site","improve the landing page design","give this website more product feel"]
keywords	["web design","landing page","product","ui","responsive","references"]
category	creative

Popular Web Designs

Use this built-in skill when the task is a website or landing-page redesign that should feel current and product-grade.

Core rules

• Start from the existing brand, content hierarchy, and user journey before styling.
• Choose one clear visual direction instead of blending generic trends together.
• Make desktop and mobile feel designed, not merely compressed.
• Prefer strong spacing, typography, and contrast decisions over decorative clutter.

Default workflow

1. Identify the page goal, audience, and strongest content priority.
2. Pick a concrete visual direction and apply it consistently.
3. Ensure the first screen communicates the product fast.
4. Validate the layout, navigation, and motion on mobile and desktop.

Guardrails

• Do not ship a reference mashup with no coherent hierarchy.
• Do not let hero treatment bury the main content.
• Do not leave responsive behavior as an afterthought.