UX Experiments and other fun web/screen exercises
Sometimes I need to build out web-based interfaces to measure the possibilities or to fully visualize design gaps and interaction issues. Here are a few that are not under embargo...
Color Contrast via Twind
A Twind v0 auto accessible foreground color contrast "plugin" using CSS props/variables.
Dynamic class swapping to simulate on-the-fly theme switching using Twind's amazinf CSS in Js.
jQuery-ish Contrast Color
DEPRECATED ~ Another Twind v0 foreground color contrast example but this one is using jQuery.
Twind Prose + Vue Fun
A starter page using Vue and Twind. Contains advanced examples for both libraries.
A prototype example of a Kiesel Guitar itemized option list and price sheet.
A super simple template to mimic Spotify's "Wrapped" yearly usage experience.
SASG + Twind
A recreation of a the classic SASG website home page using modern HTML, Twind, and Alpine.
Alpine.js + Elasticlunr
Example of how to use Alpine.js & Elasticlunr together as well as an external data file.
Let's use modern web tech to recreate BeOS UI chrome. No images. Just JSS/Twind and HTML...
Xpandy via Twind
An interesting horizontal accordion effect for columns with background images.