Web Toys Directory
A minimalist collection of self-contained, interactive digital instruments, generators, and playful design utilities. Built with pure vanilla technologies.
T-Shape Generator →
Visualize and map your multidisciplinary skill depth and breadth. Resizable vertical stripes, customizable labels, dynamic color harmonics, and clean SVG export.
Responsive Slide Whistle →
An interactive Web Audio demonstrator mapping browser width to pitch. Widening the window raises the pitch; narrowing lowers it, complete with real-time piston slide extension and portamento glide.
What's your t-shape?
A T-shaped person holds deep expertise in a primary discipline, supported by wide, cross-functional competence across neighboring fields. Map your personal strengths in seconds.
About the T-Shape Concept
The concept of T-shaped skills was popularized in the design and engineering realms by IDEO and modern agile organizations. It describes the abilities of individuals in the workforce:
The Vertical Bar (↓)
Represents depth of related skills and expertise in a single field or specific capability (e.g., deep system design or visual typography).
The Horizontal Bar (↔)
Represents the ability to collaborate across disciplines with experts in other areas, and to apply knowledge in areas of expertise other than one's own.
How to use this tool
- Drag handles at the bottom of each column to scale its depth from 10% to 100%.
- Click any label at the top to rename it, reorder stripes left/right, or delete it.
- Add up to 10 disciplines to map your custom skill ecosystem.
- Toggle Color mode to dynamically spin up fresh, curated color palettes with accessible contrast.
- Export high-res vector SVG directly into your portfolio, resume, or presentation slides.