Skill UI

This skill transforms written content, such as articles and reports, into engaging, two-host conversational podcast audio. It first structures the content into a detailed JSON script (dialogue format) and then uses advanced Text-to-Speech synthesis to generate the final MP3 file. Supports both English and Chinese languages, making content accessible for audio-only listening.

Upgrades existing websites and apps to premium quality by auditing typography, color, layout, and UI patterns, then applying targeted tweaks within the current stack without rewrites.

Automatically orchestrates 1-3 available skills into a cohesive, emotionally resonant deliverable whenever the user asks for “surprise me,” inspiration, or something unexpected, prioritizing visual flair and playful storytelling.

Automate Canva design workflows via Rube MCP's Composio toolkit, covering listing, creating, exporting, uploading, organizing, and autofilling brand templates with asynchronous job polling for reliable results.

Generates Excalidraw diagrams from natural language prompts, covering flowcharts, relationship maps, mind maps, architecture, data flow, swimlane, class, sequence, and ER diagrams for communicating processes and systems.

Automates Figma workflows via Composio's Rube MCP client, covering file inspection, exports, design token extraction, comments, and project browsing while enforcing tool discovery first.

Guides designers through using the Penpot MCP tools to craft professional UI/UX for web, mobile, and desktop apps, covering workflows, design systems, accessibility checks, and setup/troubleshooting steps for the Penpot MCP server.

This skill scaffolds a complete, cohesive, mobile-first page structure, ensuring consistency across the entire application. It guides the user to define the page's core purpose, apply the Information Pyramid, and compose the layout using established design systems and existing components (shell, navigation, cards). It is ideal for starting new product flows or developing new screens while maintaining professional structural integrity and mobile-first best practices.

This skill provides a deep audit of user experience (UX) and usability, going beyond basic visual checks. It systematically evaluates screens, flows, and components against Nielsen's 10 usability heuristics and modern mobile best practices. Use it when you need to identify structural flaws, cognitive load issues, or navigation regressions in a product design, providing prioritized issues, violated heuristics, and concrete remediation steps.

This skill generates concise, tone-consistent microcopy for various UI states, including buttons, error messages, empty states, toasts, and form guidance. Inspired by a casual yet polite voice, it ensures that product messaging is actionable, helpful, and aligns with a consistent brand tone, moving beyond generic or robotic wording.

This skill helps enhance the robustness of data-dependent user interfaces (UIs) by implementing the four critical feedback states: loading, empty, error, and success. It ensures that applications provide clear, graceful, and actionable feedback regardless of data fetching status, making the product reliable and user-friendly.

This skill helps design the complete user journey or 'flow' before building individual screens. It applies established UX principles (like progressive disclosure and hub-and-spoke models) to define entry points, exit paths, and the overall navigation architecture. Use it for complex tasks like onboarding, checkout, or multi-step features to ensure a coherent, logical, and highly intuitive user experience.