Spicy Sections: An experiement/demonstration

This glitch is an experiment, attempting think about (and demonstrate for discussion) how something a group of people in Open-UI observed while working on "Tabs". You can read a bit about the idea on this blog post introducing a term "Design Affordance Controls", but a short explanation is that sometimes design can dictate whether or not content should displays as controls with user affordances, or just as good ol' content. This glitch begins to think through how this could work, attempting to provide something basically usable for further evaluation and discussion.

If you want to cut to the chase and see something working and just get a general sense of it, check out this demonstration. It is a "sections collection" element with available one-at-a-time or N collapse afforances - you can use it for 'better summary/details' or for tabs, exlusive selection accordions (responsive tabs) or non-exlusive collpases.

If you want to see more details on the custom element as we try to figure out how this might work and what an API might look like, that's what's happening over in SpicySections.html. It's all built on a premise which you can dig into further from links there if you are interested - but a lot of it isn't a "proposal" at all as much as ways that you can use this custom element.