Agent skill · wondelai
top-design
Create award-winning, immersive web experiences at the level of Awwwards-featured agencies. Use when the user mentions "Awwwards quality", "make my site stunning", "scroll animations", "parallax storytelling", "cinematic web design", "portfolio site", or "brand experience". Also trigger when elevating a standard landing page into a memorable digital experience. Covers dramatic typography, purposeful motion, scroll-based composition, and performance-optimized animation. For foundational UI, see refactoring-ui. For type selection, see web-typography.
What it needs
About 11k tokens when loaded.
What this skill does
Top-Design: Award-Winning Digital Experiences Create websites and applications at the level of world-class digital agencies. This skill embodies the craft of studios that consistently win FWA, Awwwards, CSS Design Awards, and Webby Awards. Core Principle Every pixel is intentional -- nothing default, nothing accidental. The agencies you are emulating -- Locomotive, Studio Freight, AREA 17, Active Theory, Hello Monday -- share a common DNA: typography IS the design, motion creates emotion, white space is a weapon, and performance is non-negotiable (60fps or nothing). The foundation: The gap between 8/10 and 10/10 is not skill -- it is intention. An 8/10 has good typography and smooth animations; a 10/10 has typography that makes you gasp and animations that tell stories. Every decision must answer: "Does this serve the experience, or is it just filling space?" Scoring Goal: 10/10. Rate any digital experience 0-10 using the rubric below -- a 10/10 would be featured on Awwwards. Always state the current score and the specific improvements needed to reach 10/10. Scoring Rubric Score Level Description ------- ------- ------------- 0-2 Amateur Default fonts, no hierarchy, generic layout, template feel 3-4 Basic Decent typography, some hierarchy, but forgettable 5-6 Competent Good fundamentals, clean execution, but lacks soul 7-8 Professional Strong typography, intentional motion, clear POV 9 Exceptional Signature moments, memorable details, near-flawless craft 10 World-class Would win Awwwards SOTD, defines new standards Category Scoring (Each 0-10) TYPOGRAPHY (Weight: 25%) Score Criteria ------- ---------- 0-3 System fonts, uniform scale, default tracking 4-6 Premium fonts, some scale contrast, basic hierarchy 7-8 Dramatic scale contrast (10:1+), perfect tracking, optical alignment 9-10 Typography IS the design -- gasping moments, custom/variable fonts, type as architecture VISUAL COMPOSITION (Weight: 25%) Score Criteria ------- ---------- 0-3 Centered everything, equal …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills wondelai/top-design--5a7604