create-prototype-dashboard
Develops dashboard prototypes. Helps visualize important data and statuses in an organized and focused way.
What it does
This assistant creates a dashboard prototype for monitoring operations. It displays important information clearly and organized, such as Key Performance Indicators (KPIs) and status tables.
When to use it
- ✓When you need to quickly visualize operations data.
- ✓When developing a new system and wanting a dashboard model.
- ✓To simulate how a customer success dashboard would work.
Example of what to ask your AI
“Create an operations dashboard for a logistics manager, showing key delivery indicators and order status for the last 24 hours.”
Want more? Open the sections below.
How to use
The easiest way: copy the message below and paste it into Claude, ChatGPT, Cursor or any AI. It reads the skill and follows the instructions.
Skill link
Ready-to-paste message
How it works
It first understands who will use the dashboard and what that person needs to decide. Then, it builds an HTML file with essential elements: navigation, indicators, charts, and an action table, using realistic-looking data.
Installation
Easiest way: copy the skill link and paste it into Claude, ChatGPT or Cursor asking it to follow the instructions.
In the terminal (Claude Code, Codex, Cursor), in your project folder:
npx skills add nexu-io/open-design --skill create-prototype-dashboardOr download just the file:
curl -L https://raw.githubusercontent.com/nexu-io/open-design/main/plugins/spec/examples/create-prototype-dashboard/SKILL.md -o SKILL.mdTechnical content (original SKILL.md)
Original text by the author, straight from GitHub.
Example Ops Dashboard
Use this plugin when the user wants a realistic product, operations, or customer-success dashboard prototype.
Workflow
- Identify the operator role, the key decisions they need to make, and the time window.
- Build a single-file HTML artifact with a persistent navigation rail, KPI row, primary chart area, and action table.
- Use real-looking labels and numbers instead of placeholders.
- Check that the layout works at laptop width and that tables remain readable.
- Return
index.htmlas the primary artifact.
Quality Checks
- The dashboard is useful for scanning and repeated work.
- The main action table has status, owner, priority, and next step columns.
- Text stays inside compact controls and cards.
- No external network assets are required.
FAQ
What are KPIs?
KPIs are Key Performance Indicators. They are important numbers that show how well something is performing, like sales or delivery time.
Does the dashboard work on any computer?
Yes, the design is made to work well on laptop screens, ensuring tables are easy to read.
Do I need internet to use the dashboard?
No, the dashboard is a single file and doesn't require an internet connection or downloading other files to function.
Details
Original description by the author
Create a polished operations dashboard prototype with dense KPIs, status tables, and a focused command-center layout.
repo: nexu-io/open-design
Popularity
- GitHub stars
- 101k
- Ranking position
- #648
- License
- Apache-2.0
- Updated
- 10/16/2026
Comments
- …
More skills from this repository
sample-plugin
Makes your agent create a metadata file for tests. It helps ensure code works correctly in different situations.
nexu-io/open-design
aster-atelier
Helps your agent create an artistic website with a classic look. It uses elegant imagery, blue skies, and serif fonts for a cinematic feel.
nexu-io/open-design
audio-jingle
Makes your agent generate audio like jingles and sound effects. It can create music and voices, saving the result as an audio file.
nexu-io/open-design
blog-post
Helps your agent write long articles or blog posts. It includes space for images, quotes, and author information.
nexu-io/open-design
Similar skills
accessibility
Helps your agent create interfaces that everyone can use. Ensures websites and apps work well for people with disabilities, like those who are blind or have reduced mobility.
affaan-m/ECC
design-system
Helps your agent create a design system from existing code. It extracts visual information and checks for consistency, generating a report and an interactive preview.
affaan-m/ECC
liquid-glass-design
Helps your agent create iOS user interfaces with a 'Liquid Glass' effect. Allows adding dynamic and interactive visual effects in SwiftUI and UIKit.
affaan-m/ECC