What does the Implement Custom D3 Question skill do?

This skill provides a foundational architecture and reusable components for building unique, highly interactive D3.js questions that do not conform to any standard templates.

How does this skill improve my workflow?

It accelerates development by providing a pre-built structure for essential features like state management, interactivity locking, and communication with the host platform, allowing you to focus on the unique visualization logic.

When should I use this skill?

Use this skill as a fallback when standard question types like sliders, tables, or multiple-choice are not suitable. It is ideal for tasks requiring complex custom visualizations or novel combinations of interactions.

What capabilities does it provide?

The skill includes a core architecture for state and messaging, a library of reusable UI components (cards, inputs, drag-and-drop), a detailed implementation guide, reference examples, and a pre-flight checklist for quality assurance.

Implement Custom D3 Question

Name: Implement Custom D3 Question
Author: asmith7013

byasmith7013

0•

Learning & Documentation

Builds highly interactive, custom D3.js questions that do not conform to standard templates.

Use this skill as a powerful fallback for creating highly customized D3.js questions when standard templates like multiple-choice or sliders are insufficient. It provides a foundational architecture for robust question development, including requirements for state management, message protocols, and interactivity locking. By offering a library of reusable components and a clear implementation guide, this skill enables the construction of questions with truly unique visualizations and complex, non-standard user interactions for advanced learning experiences.

Key Features

01Serves as a fallback for creating unique, non-standard questions not covered by other patterns.

02Offers a detailed implementation guide, reference examples, and a pre-flight checklist.

030 GitHub stars

04Includes a library of reusable components like cards, form inputs, and drag-and-drop systems.

05Provides a core architecture for state management, message passing, and interactivity locking.

06Establishes a protocol for state restoration and communication with the host platform.

Use Cases

01Developing a question with a novel, complex data visualization.

02Creating an interactive question that combines multiple interaction types, like drag-and-drop and text input.

03Building a custom educational tool when no standard question pattern fits the requirements.

What are Skills?·How to Install

Install with 🐟 Skill.Fish

npx skillfish add asmith7013/coachingplatform question-types

For use in Claude.ai and ChatGPT

Download Skill