skills.rest
nirukk52
nirukk52COMMUNITY
Explore all skills by this author →
GitHub

chat-widgets

Catalog interactive chat widgets for the Clue symptom tracker application.

1|Updated Dec 28, 2025
Search Tags:#design system#component library#chat ui#ux#widgets#symptom tracker
One-click install
npx skills add https://github.com/nirukk52/Clue-Symptom-Tracker-v0 --skill chat-widgets
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: chat-widgets
Source: https://github.com/nirukk52/Clue-Symptom-Tracker-v0/tree/main/.claude-skills/chat-widgets
Command: npx skills add https://github.com/nirukk52/Clue-Symptom-Tracker-v0 --skill chat-widgets

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill provides a comprehensive catalog and implementation guide for creating interactive chat UI elements and widgets within the Clue symptom tracker.

Core Features & Use Cases

  • Widget Catalog: Detailed specifications for various UI components like sliders, selectors, chips, and more.
  • Onboarding & Post-Onboarding Widgets: Maps specific user needs to appropriate widget implementations for both initial setup and ongoing interaction.
  • Use Case: When designing a new feature for the Clue app that requires users to input symptom severity and related factors, consult this Skill to select and implement the most effective GradientSlider and MultiSelectChips components.

Quick Start

Use the chat-widgets skill to implement a GradientSlider for tracking symptom intensity.

Frequently Asked Questions about chat-widgets

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

FAQPage Schema
How do I build interactive chat widgets for symptom tracking applications?▼

Interactive chat widgets for symptom tracking are built using UI components like sliders, selectors, and chips. This Skill provides a catalog and implementation details to create low-cognitive-load, efficient chat interfaces for onboarding and ongoing user interaction.

What is the best way to design low-cognitive-load chat interfaces for health apps?▼

Low-cognitive-load chat interfaces are designed by mapping specific user needs to appropriate widget implementations. Utilizing components like GradientSlider and MultiSelectChips reduces friction during onboarding and ongoing symptom input.

How do I implement a GradientSlider for tracking symptom intensity in a chat UI?▼

To implement a GradientSlider for tracking symptom intensity, consult the widget catalog for component specifications and design principles. This ensures the chat UI element effectively captures user input with minimal cognitive load.

Can I use MultiSelectChips for post-onboarding symptom selection in my app?▼

Yes, MultiSelectChips can be used for post-onboarding symptom selection. The Skill maps specific user needs to appropriate widget implementations, covering both initial setup and ongoing interaction for efficient data input.

When should I use chat UI widgets instead of standard form inputs for user onboarding?▼

Chat UI widgets should be used instead of standard form inputs when creating low-cognitive-load, efficient chat interfaces is a priority. The catalog provides design principles for selecting components like sliders and chips for interactive onboarding experiences.

Related Skills

Explore More Design & Creative Skills→
cctylcctyl

tailwindcss-styling

Standardize Tailwind CSS styling with color tokens, spacing scales, and dark-theme guidelines.

Community
Advanced
fyuuki0jpfyuuki0jp

ux-design

Applies UX psychology and behavioral economics to solve UI usability challenges.

Community
Basic
mostafa-ismail-2004mostafa-ismail-2004

ui-ux-architect

Generate implementation-ready UI behavioral specifications with interaction states and accessibility requirements.

Community
Advanced
arjitj2arjitj2

swiftui-design-principles

Enforce SwiftUI and WidgetKit design principles for spacing, typography, and color.

Community
Advanced