Jordan’s Toolkit
GitHub
← All categories

Design & Communication

Define coherent interfaces, semantic tokens, accessible icons and purposeful motion; explain systems with evidence.

Browse the collection

6 entries

Showing 6 entries

Original

Evidence-backed Visual Explanation

Explain an inspected system or change with source-linked relationships, explicit assumptions, readable visual structure and an equivalent accessible narrative.

Design and communicationexperimental
Original

Product Video Storyboarding

Plan a product video as a timed shot, asset, claim and caption contract before authorizing generation, composition or publication.

Design and communicationexperimental
Original

Design System Architecture

Establish a small versioned system of semantic tokens, accessible primitives and feature compositions with clear ownership and migration criteria.

Design systemsexperimental
Original

Animation and Motion Design

Use motion to explain interaction and hierarchy while preserving reduced-motion alternatives, interruption behavior and rendering performance.

Design systemsexperimental
Original

Icon System Integration — React Icons

Select and integrate a coherent icon family using React Icons, Lucide or an existing library with accessible meaning, bounded imports and preserved upstream license information.

Iconsexperimental
Original

Interface Design Brief

Turn a frontend task into a coherent, testable interface direction grounded in the audience, product workflow, existing system and realistic content states.

Design systemsexperimental