Sriram Kansala › Seven interactions
Seven interactions
Designed in code for Artos, Taralipi and this site
Glass columns you can turn
Hover a month and the headline rolls to that month’s value. Drag sideways to turn every column on its own axis; pick a month and the section splits to show what it was made of. It took more rounds than any other piece here. Artos Web is my prototype, built by directing Claude Code; the Artos developer plans to bring it into the app.
Ink that rides the highlight
The section index from this site’s case studies (Fluid Functionalism’s tabs), with one change of mine: its bright ink rides the gliding highlight. Mid-glide, the text turns bright exactly where the highlight is, partway through a word. Press a section and the pill follows. The case studies still use the original.
One key for the sidebar
A quiet button beside the window controls hides the sidebar and gives the page its width back; ⌘\ does the same. Its two glyphs cross-fade. I designed it for Taralipi, a desktop writing app built mostly by others. It hasn’t shipped.
A ring you can pick up
Hover a slice and a sphere glides to it with its share while the others dim. Hold the ring and it lifts into a room behind the chart; turn it any way and it stays where you leave it. From Artos Web, my prototype. It hasn’t shipped.
A stack that makes room
Collaborators overlap beside Preview. Hover a face and it lifts while its neighbors slide apart, so it shows whole, with a name and role. Click and the same stack lists everyone on the manuscript, with their roles. My design for Taralipi. It hasn’t shipped.
Selection that glides
The highlight is drawn behind the text, one band per line, and moved by a critically damped spring I tuned by eye. During a drag its edge follows the pointer between letters; when the pointer rests, it settles on a character. My design for Taralipi. It hasn’t shipped.
Where the salary goes
Five stages pour through one glass funnel. Hover a stage and the rest turn gray; drag to roll it. Pick a stage and the funnel gives up a third of its width to the breakdown. From Artos Web, my prototype. It hasn’t shipped.