refero-design

Plan discovery questions and extract design patterns using Refero MCP tools.

183|13|Updated Feb 5, 2026
One-click install
npx skills add https://github.com/referodesign/refero_skill --skill refero-design
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: refero-design
Source: https://github.com/referodesign/refero_skill/tree/main
Command: npx skills add https://github.com/referodesign/refero_skill --skill refero-design

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes assets (resource) and references (resource) components.

What problem does it solve?

Research-First design grounded in real product data and Refero MCP to prevent AI slop, enabling design teams to move from generic patterns to research-backed decisions.

Core Features & Use Cases

  • Discovery and research planning using Refero tools (search_screens, search_flows, get_screen, get_flow, get_design_guidance) to surface credible references.
  • Pattern extraction from real products to inform craft across typography, color, spacing, and interaction details.
  • Guided workflows with quality gates to translate research findings into production-ready design specs.

Quick Start

Use Refero MCP to plan a design brief, run a research loop, extract references, and craft implementation guidance for a new screen.

Frequently Asked Questions about refero-design

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

FAQPage Schema
How do I prevent generic AI slop in UI design?

Prevent generic AI slop in UI design by applying a research-first methodology that grounds UI creation in real product data. Extract actionable patterns from credible references to inform typography, color, spacing, and interaction details instead of relying on defaults.

How do I extract design patterns from real products for UI research?

Extract design patterns from real products by performing a research loop using search_screens, search_flows, get_screen, and get_flow tools. This surfaces credible references and translates findings into a pattern extraction summary to guide craft decisions.

What is a research-first design methodology?

A research-first design methodology is a workflow that plans discovery questions and performs research before UI creation. It uses Refero MCP tools to surface credible references, extracting actionable patterns to translate findings into production-ready design specs.

How do I create a research brief for a new app screen?

Create a research brief for a new app screen by planning discovery questions and running a research loop with Refero MCP. The workflow outputs a comprehensive research brief, a pattern extraction summary, and craft-focused implementation guidance aligned with quality gates.

Does Refero MCP provide design guidance for production-ready specs?

Refero MCP provides design guidance for production-ready specs through the get_design_guidance tool. It operates within guided workflows and quality gates to translate research findings into actionable craft details across typography, color, spacing, and interactions.

What are the limitations of using AI for UI design without real product research?

Using AI for UI design without real product research leads to generic AI slop and default patterns. Without extracting actionable patterns from credible references via tools like search_screens and search_flows, outputs lack research-backed decisions and fail quality gates.