website/DESIGN-DIRECTION.md

Design Direction Draft

Design Principles

1. Simplicity first.
2. Premium without excess.
3. Product and environment should feel real, not theatrical.
4. Information density should stay controlled.
5. Navigation should reduce hesitation.
6. The site should feel international and editorially composed.

Homepage Hierarchy

1. Hero banner with lifestyle usage scene, with support for still image and showcase video
2. Featured products (4-up layout with horizontal product imagery)
3. Brand / technology statement in image + text composition
4. Support access
5. Secondary proof such as reviews, awards, and press

Visual Character

• Light theme
• Clean composition
• Strong whitespace
• Large photography
• Minimal copy blocks
• Controlled typography scale
• International layout rhythm
• Material richness and cinematic lens quality
• No shopping cues
• No discount, badge, or pricing treatments

Component Priorities

Tier 1

• Header / navigation
• Hero banner
• Product card
• CTA button
• Footer

Tier 2

• Section intro
• Spec block
• Media quote / award block
• Support shortcut card
• Gallery module

Tier 3

• Accordions
• Tabs
• Download list
• Breadcrumbs
• Pagination

Interaction Principles

• Motion should be subtle.
• Hover states should feel deliberate.
• Transitions should support clarity, not spectacle.
• Mobile behavior should preserve the same restraint as desktop.

Visual Risks To Avoid

• Generic luxury gradients
• Over-styled glass effects
• Too many homepage modules
• Dense comparison-table layouts on top-level pages
• Product grids that feel like retail catalog pages
• Visual treatments that break between Chinese and English content lengths

Open Design Questions

• Typography personality: neutral modern sans or sharper editorial contrast
• Photography direction: interior lifestyle, studio realism, or mixed by page
• Awards / reviews treatment: logo wall, quote strip, or mixed module
• Whether hero video is a launch-only asset or persistent CMS option
• Whether regional versions need different imagery or content emphasis