skills.rest
joshband
joshbandCOMMUNITY
Explore all skills by this author →
GitHub

design

Your daily AI-powered briefing for top news stories and beyond.

3|Updated Feb 18, 2026
Search Tags:#design#ui#prototyping#mockups#interaction-design#webview#locusq
One-click install
npx skills add https://github.com/joshband/LocusQ --skill design-joshband
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design
Source: https://github.com/joshband/LocusQ/tree/main/.claude/skills/design
Command: npx skills add https://github.com/joshband/LocusQ --skill design-joshband

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Designers and product teams need a clear, consistent visual interface for LocusQ, enabling rapid translation of user requests into ready-to-implement UI concepts and workflows.

Core Features & Use Cases

  • UI concepting: Create wireframes and mockups for LocusQ's WebView interface and editor panels.
  • Style language and guidelines: Define a consistent visual language, typography, color system, and interaction patterns for LocusQ.
  • Design-to-development handoff: Provide design specs and assets to support implementation in the plugin, app, or Web UI.

Quick Start

Review user mentions of UI design and produce initial wireframes and a style guide for the WebView interface.

Frequently Asked Questions about design

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

FAQPage Schema
How do I design UI concepts and wireframes for a WebView editor interface?▼

To design UI concepts for a WebView editor, you need to produce wireframes, mockups, and style guidelines that define a consistent visual language, typography, and responsive interaction patterns for the interface components.

What is included in a design-to-development handoff for web interface mockups?▼

A design-to-development handoff for web interface mockups includes complete UI concepts, design specs, and style guidelines that define responsive behavior, visual language, and interaction patterns expected by developers for integration.

Can I use this UI design process to create a consistent visual language for plugin components?▼

Yes, you can use this UI design process to define a consistent visual language, color system, and typography specifically suited for integration with your plugin, app, or Web UI workflow and branding.

What's the best way to prototype interaction design for an editor's WebView panels?▼

The best way to prototype interaction design for editor WebView panels is to identify specific interface needs first, then produce targeted wireframes and design guidelines that ensure responsive behavior and visual consistency.

How do I create design guidelines that meet developer requirements for a web UI?▼

To create design guidelines meeting developer requirements for a web UI, define the consistent visual language, interaction patterns, and responsive behavior, then package these specs as deliverables ready for implementation.

Why do my WebView interface mockups lack a consistent visual style during development?▼

WebView interface mockups lack a consistent visual style when you have not defined a unified style language, typography rules, and color system before translating user requests into ready-to-implement UI concepts.

Related Skills

Explore More Design & Creative Skills→
jamesrochabrunjamesrochabrun
194

design-brief-generator

Generate Markdown design briefs with defined sections from structured inputs.

Community
Advanced
haidonglethqbhaidonglethqb

frontend-design

Convert visual designs into ready-to-implement frontend components and tokens.

Community
Advanced
alslimanyalslimany

interface-design

Apply interface design guidelines for consistent dashboards, admin panels, and data interfaces.

Community
Advanced
suhwansuhwan

phase-3-mockup

Generate HTML/CSS/JS mockups with a Next.js conversion plan.

Community
Advanced