brainstorming

Guides product and design brainstorming with a browser-based visual mockup companion server.

Updated Aug 30, 2026
One-click install
npx skills add https://github.com/ryanportfolio/threejs-interview-test --skill brainstorming-ryanportfolio
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: brainstorming
Source: https://github.com/ryanportfolio/threejs-interview-test/tree/main/.agents/skills/brainstorming
Command: npx skills add https://github.com/ryanportfolio/threejs-interview-test --skill brainstorming-ryanportfolio

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve? Unstructured brainstorming for products, interfaces, and architectures often stalls on unresolved goals and tradeoffs, and purely text-based discussion fails when the question is inherently visual. This Skill provides a structured brainstorming workflow plus a browser companion that renders mockups, diagrams, and side-by-side options so users can see and click choices instead of only reading them. ## Core Features & Use Cases - Structured Brainstorming Workflow: Applies a canonical workflow for exploring goals, tradeoffs, and design directions before any implementation begins. - Visual Companion Server: Ships a Node.js WebSocket/HTTP server that serves HTML mockups to the browser, records user click selections to an events file, and auto-reloads on new screens. - Decision Guidance: Distinguishes visual questions (layouts, diagrams, comparisons) from textual ones (requirements, tradeoff lists) so the right channel is used per question. - Use Case: When designing a new dashboard, present three layout mockups in the browser, let the user click their preference, then read the recorded selection and iterate on the chosen direction. ## Quick Start Ask the assistant to brainstorm the design of your feature and show layout options in the browser using the brainstorming visual companion.

Frequently Asked Questions about brainstorming

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

FAQPage Schema
How do I show UI mockups in the browser during a brainstorming session?▼

Start the companion server with scripts/start-server.sh and a project directory, then write HTML content fragments to the returned screen_dir. The server serves the newest file in the browser and records user clicks to the state directory events file.

When should brainstorming use the browser versus the terminal?▼

Use the browser when content is inherently visual, such as wireframes, architecture diagrams, or side-by-side design comparisons. Use the terminal for textual content like requirements questions, tradeoff lists, and conceptual choices between described approaches.

Does the brainstorming server work on Windows or in Codex environments?▼

Yes. The start script auto-detects Windows (Git Bash) and Codex environments and switches to foreground mode, since those environments reap detached background processes. On Windows, launch it with a background-capable shell tool call.

How are user clicks in the browser captured and read back?▼

A helper script injected into each page sends click events over WebSocket to the server, which appends them as JSON lines to the events file in the state directory. The agent reads that file on the next turn to learn the user's selection.

What are the limitations of the visual brainstorming companion?▼

The server auto-exits after 30 minutes of inactivity and binds to localhost by default, so remote or containerized setups need an explicit host flag. It is also unsuitable for routine or fully specified work where no tradeoffs remain.