Prepare Remotion Studio and Canvas Capture for a product demo recorded by the user. Import the original capture into packages/brand as an editable composition, preserve cursor metadata, and upload the verified recording to remotion.media.
- Prepare a Studio interaction demo for recording
- Frame a timeline demonstration
- Import a capture with editable cursor data
remotion-dev/remotion☆ 65.6KUpdated Oct 20, 2026
Apply Remotion Studio’s interaction conventions to buttons and links: keep the default cursor, brighten text and icons on hover, and show a visible focus indicator for keyboard navigation using shared styling helpers.
- Style a new Studio button or link
- Keep text and icons consistent on hover
- Retain visible focus for keyboard navigation
remotion-dev/remotion☆ 65.6KUpdated Oct 20, 2026
Turn a product's visual and interaction goals into DESIGN.md and EXPERIENCE.md. Through guided discussion, capture appearance, screen structure, behavior, accessibility, and user journeys as specifications that can guide later design and development work.
- Define a product's appearance and interaction behavior
- Document screen structure and user journeys
- Update UX specifications after design changes
bmad-code-org/BMAD-METHOD☆ 54.4KUpdated Oct 20, 2026
Consult Sally, a UX and UI specialist, to translate user needs into interaction designs and UX specifications. The role considers unusual situations as well as everyday use, helping communicate clear design intent to architecture and implementation work.
- Discuss interaction flows based on user needs
- Clarify UX specifications for implementation
- Consider unusual situations in interface design
bmad-code-org/BMAD-METHOD☆ 54.4KUpdated Oct 20, 2026
Analyze drug concentration and response data to calculate exposure, fit models of drug movement and effects, and simulate dosing schedules. Produces exploratory research results with explicit assumptions and diagnostic checks.
- Calculate exposure and half-life from concentration data
- Compare models of drug concentration over time
- Simulate dosing schedules for research
K-Dense-AI/scientific-agent-skills☆ 53.2KUpdated Oct 19, 2026
Build Solidity contract tests with Hardhat and Foundry. Check individual functions, contract interactions, gas usage, and varied inputs, and use a local copy of mainnet state to test against existing contracts.
- Testing token transfers and expected failures
- Checking edge cases with varied generated inputs
- Testing interactions with existing mainnet contracts
wshobson/agents☆ 41.2KUpdated Oct 20, 2026
Write JavaScript and TypeScript tests with Jest using consistent structure, dependency mocking, and checks for asynchronous code. Includes guidance for snapshots and React components, focusing on user interactions, accessibility, and choosing appropriate assertions for expected results.
- Organize Jest test files and test names
- Replace API or database dependencies with mocks
- Test asynchronous results and errors
github/awesome-copilot☆ 40.2KUpdated Oct 20, 2026
Design, refine, or review web and iOS interfaces using the product’s existing components and visual style. Consult relevant screen examples when useful, then inspect the result for layout problems, inaccessible controls, and broken interactions.
- Designing screens that fit an existing product
- Refining a dashboard or simplifying an interface
- Reviewing layouts and interactions before release
github/awesome-copilot☆ 40.2KUpdated Oct 20, 2026
Rebuild existing web pages as working, editable local code using their actual content and assets. Inspect desktop and mobile layouts, reproduce interactions and animations, then compare rendered pages and fix visible or functional differences.
- Recreating an existing page in a local app
- Matching desktop and mobile layouts
- Reproducing Framer pages and scroll animations
JCodesMore/ai-website-cloner-template☆ 37.1KUpdated Oct 20, 2026
Create Mermaid diagrams from text to explain software structure, API interactions, workflows, and database relationships. The skill guides diagram selection, syntax, styling, and export, helping keep visual documentation editable and stored alongside code.
- Explaining system architecture with diagrams
- Mapping API requests and responses
- Documenting database table relationships
davila7/claude-code-templates☆ 32.8KUpdated Oct 20, 2026
Plan mobile app screens and interactions around touch, performance, offline use, and platform conventions. The skill guides design decisions and implementation checks for React Native, Flutter, and native iOS or Android apps.
- Planning screens for one-handed use
- Reviewing slow lists and animations
- Designing loading, error, and offline states
davila7/claude-code-templates☆ 32.8KUpdated Oct 20, 2026
Build custom interactive charts, maps, and network diagrams with d3.js. The skill guides data preparation, styling, resizing, and interactions such as zooming and tooltips, giving detailed control over how data appears and responds to users.
- Creating charts beyond standard library options
- Exploring relationships in a network diagram
- Adding zoom and tooltips to visualizations
davila7/claude-code-templates☆ 32.8KUpdated Oct 20, 2026
Integrate the Gemini API on Agent Platform using the Google Gen AI SDK. Guidance covers authentication, text and multimedia tasks, structured JSON responses, live voice interactions, context caching, and batch prediction across five programming languages.
- Adding document and multimedia understanding to an application
- Generating JSON that matches a defined schema
- Building live voice and video interactions
davila7/claude-code-templates☆ 32.8KUpdated Oct 20, 2026
Guide Zoom Contact Center integrations across Zoom client apps, websites, and native mobile apps. Use platform references to implement chat, video, scheduled callbacks, and handling of customer interaction states, context changes, and resource cleanup.
- Build an agent side-panel app with notes per customer interaction
- Embed chat or video on a website
- Add chat, video, or scheduled callbacks to a mobile app
anthropics/knowledge-work-plugins☆ 30.7KUpdated Oct 20, 2026
Turn a design into a developer handoff document covering layout, shared design settings, component options, interactions, and screen-size behavior. Include loading and error states, animation details, and accessibility notes to clarify implementation requirements.
- Preparing a design for developer handoff
- Documenting layout changes across screen sizes
- Specifying loading, empty, and error states
anthropics/knowledge-work-plugins☆ 30.7KUpdated Oct 20, 2026
Test Qwen Code through realistic keyboard interactions in tmux, a terminal session tool. Capture readable screen snapshots at each step and produce a report documenting dialogs, commands, outcomes, and observed side effects.
- Testing authentication dialogs and keyboard navigation
- Checking slash command interactions
- Reviewing intermediate screens for regressions
QwenLM/qwen-code☆ 28.6KUpdated Oct 20, 2026
Automate terminal interactions and capture screenshots before and after commands run. Define scenarios in TypeScript to review CLI appearance, document command flows, or record changing output such as progress bars, with optional animated GIFs.
- Review CLI appearance changes in a pull request
- Capture slash command interactions
- Create screenshots for usage documentation
QwenLM/qwen-code☆ 28.6KUpdated Oct 20, 2026
Test Qwen Code CLI behavior from model requests through tool execution. Reproduce bugs, check terminal interactions and MCP tool connections, and inspect API logs using real models or mock servers for controlled scenarios.
- Reproduce reported CLI bugs and verify fixes
- Test MCP tool connections through the CLI
- Check terminal rendering and keyboard interactions
QwenLM/qwen-code☆ 28.6KUpdated Oct 20, 2026
Debug local web and Electron apps through a persistent Playwright session in js_repl, an interactive JavaScript environment. Reuse browser connections while checking user interactions, visual states, screen sizes, and screenshots after changes.
- Rechecking an interface after code changes
- Testing buttons and complete user flows
- Inspecting layouts at desktop and mobile widths
openai/skills☆ 28.2KUpdated Sep 9, 2026
Implement and review interfaces that support both right-to-left and left-to-right reading. Apply guidance for CSS layout, mixed-direction text, menus, scrolling, resizing, and Electron title bars, then verify interactions in both directions.
- Reviewing CSS layouts for right-to-left support
- Displaying mixed-direction text, code, and paths
- Checking menus, scrolling, and resize interactions
Kilo-Org/kilocode☆ 27.7KUpdated Oct 20, 2026
Review game interface specifications, HUD designs for information shown during play, and shared interaction rules before implementation. Check completeness, accessibility, and consistency with game design documents, then receive a verdict with specific issues and missing review inputs.
- Checking a screen specification before implementation
- Reviewing HUD information and display priorities
- Checking consistency across shared interaction patterns
Donchitos/Claude-Code-Game-Studios☆ 27KUpdated Oct 19, 2026
Coordinate a game interface feature from user experience specifications through visual design, implementation, review, and polish. Reuse existing interaction patterns and report input support, accessibility checks, engine validation, and unresolved issues alongside the delivered interface.
- Building an inventory screen from specification through implementation
- Designing and implementing a game's main menu
- Creating a HUD with defined visual and interaction constraints
Donchitos/Claude-Code-Game-Studios☆ 27KUpdated Oct 19, 2026
Test the pages affected by a branch or pull request in a browser. The skill checks rendered pages and key interactions, then reports passes, failures, skipped checks with reasons, and steps to reproduce problems.
- Checking pages affected by a pull request
- Testing key interactions after a branch change
- Recording failures and reproduction steps
EveryInc/compound-engineering-plugin☆ 25.6KUpdated Oct 19, 2026
Build Gemini API integrations on Google Cloud’s Agent Platform using the Google Gen AI SDK. Get guidance on authentication, text and media processing, structured JSON responses, function calls, caching, batch processing, and real-time voice or video interactions.
- Adding Gemini to enterprise applications
- Processing images, audio, and documents
- Generating JSON in a specified format
google/skills☆ 21.4KUpdated Oct 20, 2026