interface-design

Design user interfaces for dashboards, admin panels, and SaaS applications.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/RagnarokButMemorySafe/opencode-config --skill interface-design-ragnarokbutmemorysafe
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: interface-design
Source: https://github.com/RagnarokButMemorySafe/opencode-config/tree/main/skills/interface-design
Command: npx skills add https://github.com/RagnarokButMemorySafe/opencode-config --skill interface-design-ragnarokbutmemorysafe

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses the challenge of generating generic, templated UI designs by emphasizing intent-driven design, product domain exploration, and consistent application of craft principles. It aims to create interfaces that feel unique, purposeful, and deeply connected to their specific user and context.

Core Features & Use Cases

  • Intent-Driven Design: Guides the user through defining the target human, their goals, and the desired feel of the interface before any visual elements are considered.
  • Product Domain Exploration: Mandates deep dives into the product's world to uncover unique concepts, color palettes, and signature elements, moving beyond generic patterns.
  • Craft Principle Application: Enforces adherence to principles like subtle layering, consistent spacing, deliberate typography, and meaningful color usage.
  • Use Case: A developer needs to design a new dashboard for a complex data analysis tool. Instead of defaulting to a standard dashboard layout, this Skill prompts for exploration of the data's domain, the users' specific analytical tasks, and the desired feel (e.g., precise and technical vs. exploratory and visual), leading to a more tailored and effective design.

Quick Start

Use the interface-design skill to explore the domain for a new SaaS analytics dashboard and propose a design direction.

Frequently Asked Questions about interface-design

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

FAQPage Schema
How do I design a SaaS dashboard that avoids generic templates?

To design a SaaS dashboard without generic templates, use intent-driven design by defining the target user's goals, exploring the specific product domain, and applying craft principles like deliberate typography and meaningful color usage.

What is intent-driven UI design and when should I use it?

Intent-driven UI design is the process of defining the target human, their goals, and the desired interface feel before considering visual elements. Use it to create dashboards and admin panels that feel purposeful and deeply connected to user context.

How do I apply craft principles to admin panel interfaces?

Apply craft principles to admin panel interfaces by enforcing subtle layering, consistent spacing, deliberate typography, and meaningful color usage. This ensures all design decisions are rooted in purpose and reinforced by systemic visual elements.

Can I use this approach for complex data analysis tool interfaces?

Yes, you can use this approach for complex data analysis tools. It prompts you to explore the data domain and the users' specific analytical tasks to deliver a tailored interface, whether the desired feel is precise and technical or exploratory and visual.

What's the best way to establish a design system for product domains?

The best way to establish a product design system is to mandate deep dives into the product's world. This uncovers unique concepts, color palettes, and signature elements, moving beyond generic patterns to ensure domain-specific consistency.

Why does my UI design lack product domain specificity?

Your UI design lacks product domain specificity because it likely defaults to standard layouts without exploring the product's world. Defining user context, core tasks, and desired aesthetic qualities ensures design decisions are rooted in purpose.