interface-design

Generate interface design outlines with token-based typography, color, spacing, and component patterns.

Updated Feb 20, 2026

Search Tags:#design #dashboard #interface #intent #admin #craft

Ready to run

npx skills add https://github.com/MClaudio/bryan-realstate-front --skill interface-design-mclaudio

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: interface-design
Source: https://github.com/MClaudio/bryan-realstate-front/tree/main/.trae/skills/interface-design
Command: npx skills add https://github.com/MClaudio/bryan-realstate-front --skill interface-design-mclaudio

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Inconsistent interface design across dashboards, admin panels, apps, and tools wastes time and creates fragmented user experiences. This skill provides a principled approach to craft cohesive, intent-driven interfaces that scale with your product.

Core Features & Use Cases

Intent-first design guidance: establishes domain language, token systems, and a repeatable design process for surfaces, typography, spacing, and components.
Domain exploration and systematization: helps map product domain concepts, color world, and signature interactions to ensure visual cohesion.
Craft-led patterns: promotes subtle layering, consistent borders, and token-based design across dashboards and internal tools.

Quick Start

Describe your target dashboard or admin tool context and I will generate a crafted interface design outline and pattern proposal.

Frequently Asked Questions about interface-design

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

FAQPage Schema

How do I create consistent dashboard and admin panel interfaces?▼

To create consistent dashboard interfaces, establish domain language, token-based typography, color systems, and spacing rules. This approach enforces intent-driven decisions and reusable component patterns to ensure visual cohesion across internal tools.

What is intent-driven interface design for admin consoles?▼

Intent-driven interface design maps product domain concepts and signature interactions to establish a repeatable process. It ensures visual cohesion by applying token systems for surfaces, typography, spacing, and components across admin consoles.

How do I build a design system for internal tools and data dashboards?▼

Build a design system by systematizing the product domain, color world, and interactions. Apply token-based typography, consistent borders, subtle layering, and depth strategy to craft reusable component patterns for data dashboards.

What is the best way to fix inconsistent UI design across product teams?▼

Fix inconsistent UI design by enforcing intent-first design guidance and token-based color systems. This principled approach establishes repeatable processes for surfaces and components, scaling visual cohesion across product teams.

Can I apply token-based typography and spacing rules to existing control surfaces?▼

Yes, you can apply token-based typography and spacing rules to existing control surfaces. Mapping domain concepts and establishing a depth strategy helps systematize and unify fragmented admin interfaces without starting from scratch.

When should I not use a token-based design system for dashboards?▼

Avoid token-based design systems for dashboards when rapid prototyping a single disposable screen. This approach targets scaling visual cohesion across multiple internal tools and admin panels, requiring upfront domain exploration and systematization.