Apply typography, motion, layout, color, and performance guidelines to web experiences.
npx skills add https://github.com/sachio222/based-stack --skill top-design-sachio222
Please help me install this Agent Skill. Skill: top-design Source: https://github.com/sachio222/based-stack/tree/main/top-design Command: npx skills add https://github.com/sachio222/based-stack --skill top-design-sachio222
Create award-winning, immersive web experiences by applying typography, motion, and layout discipline.
Identify your signature moment, choose premium typography, and prototype motion early to anchor the experience.
High-intent search queries and answers about installing and using this skill.
Immersive web experiences use typography-centric design to define hierarchy and mood, combined with purpose-driven motion and scroll-based storytelling. You establish a signature moment, choose premium typography, and prototype motion early to anchor the narrative.
Grid layouts achieve tension by mastering a base grid with deliberate breaks, utilizing white space, and overlapping elements. This composition approach creates visual interest while maintaining structured design principles for portfolios and brand experiences.
Scroll-based storytelling works for agency-grade websites by using scroll as a narrative device. It implements pinned sections and progressive reveals to orchestrate immersive user journeys, guiding visitors through structured design content.
Performance optimization acts as a design constraint for motion and animation, enforcing 60fps rates and fast load times. It ensures custom easing and orchestrated reveals maintain smooth visual feedback without degrading the immersive experience.
Accessible contrast is required for color palettes in immersive web design. Intentional color choices must include accessible contrast ratios and contextual shifts to ensure micro-interactions and focus states remain usable across all design system components.
Complex motion and scroll-based design should be avoided when performance constraints prevent maintaining 60fps or fast load times. If optimization cannot support orchestrated reveals and pinned sections, simpler layout discipline is preferable.
brunoamaralProvide visionOS spatial UI design guidelines for Vision Pro apps.
przbaduCreate distinctive frontend interfaces with cohesive typography, color, and motion.
UnlimitedxIQBuild 3D immersive websites with React Three Fiber, Lenis, GSAP, and Spline.
KRISHNA0RGenerate GSAP-driven frontend layouts with dense gapless grids and scroll-based animations.
