design-guide

Adapt client UI designs to brand colors with glass-based depth and cinematic lighting.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/AIBPM42/hodgesfooshee-site-spark --skill design-guide-aibpm42
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-guide
Source: https://github.com/AIBPM42/hodgesfooshee-site-spark/tree/main/.claude/skills/design-guide-updated
Command: npx skills add https://github.com/AIBPM42/hodgesfooshee-site-spark --skill design-guide-aibpm42

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Designing modern, premium interfaces that align with client branding while maintaining high quality and emotional resonance can be challenging and inconsistent. This skill provides a professional methodology to achieve stunning results.

Core Features & Use Cases

  • Glassforium Logic & Cinematic Polish: Applies advanced design principles like glass treatments, cinematic lighting, and physics-based motion to create visually stunning and emotionally engaging interfaces.
  • Client Brand Adaptation: Seamlessly integrates client colors, fonts, and brand guidelines into the design methodology, enhancing their identity without overriding it.
  • Comprehensive Design Principles: Provides guidelines for clean minimalism, color palettes, spacing systems, typography, shadows, and interactive states, ensuring consistent and professional execution.
  • Use Case: You're designing a new landing page for a client who wants a 'premium, cinematic' aesthetic. Use this skill to apply glass methodology, adapt their brand colors to lighting effects, and ensure all UI components follow a consistent, high-quality standard.

Quick Start

Use the design-guide skill to create a premium interface for my client's new web application, adapting to their brand colors.

Frequently Asked Questions about design-guide

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I adapt client brand colors to a cinematic, premium UI design?

Apply cinematic design principles by integrating client colors into glass treatments and lighting effects. This methodology ensures brand colors maintain emotional resonance while achieving premium, modern aesthetics across all UI components.

What design principles ensure consistency across client web projects?

Use a comprehensive design system covering typography hierarchy, spacing grids, shadow depth, color palettes, and interactive states. This ensures all client UI components follow a consistent, professional standard aligned with brand identity.

Can I use glassmorphism and cinematic effects while maintaining brand guidelines?

Yes. Glass-based depth and cinematic lighting integrate seamlessly with client branding. Adapt their fonts and colors to lighting effects without overriding brand guidelines, creating premium interfaces that feel cohesive and on-brand.

How do I create accessible, premium interfaces for client work?

Combine glass methodology with accessibility requirements through proper contrast, spacing systems, and motion language guidelines. This approach balances cinematic polish with accessible, inclusive design that meets professional standards.

What's the best way to maintain design quality across multiple client projects?

Use a standardized design methodology for clean minimalism, color systems, and component states. This repeatable approach ensures consistent, high-quality execution while allowing rapid adaptation to each client's brand and aesthetic preferences.