Made with: Processing, TUIO, Swift
The idea for the concept came from a simple desire to access information on my computer using minimal interaction. Instead of having to look for information buried deep within menu structures or hidden behind static windows and ultimately having to spend a lot of my mental capacities to “deal with the technology” as opposed to the content I care about, I wanted see if i could come up with an interface that would allow me to only use one single interaction to retrieve the information I desired. This has led me to the idea of an interface structure that simultaneously shows all the information available and shapeshifts in a way so that it hides unneeded information out of sight, yet always keeps it within “hands reach”.
Treemap diagrams served as a main inspiration for the structure of the interface. This is because these diagrams can consist of multiple cells of different sizes that in its entirety always organize in a way so that they occupy the available space in the most effective way, leaving no gaps in between. If a cell would change in size, the view would automatically rearrange while continuing to align perfectly to the given space.
However, when this happens, treemap diagrams are not capable to transition smoothly between states because their cells would need to jump around finding their optimal space to exist in. That is why instead, I came up with a simple recursive rule that would retain a treemap-like structure yet enable transitioning between states: The available space is divided into four sections which in themselves would then be divided again into four pieces. Theoretically, this process could be repeated recursively. By moving the center points of every one of these four-part spaces, smooth rescaling of the compartments can be accomplished.
A concept like this can not just be conceptualized and visualized to test if it works and makes sense. This is why I created several prototypes using the Processing programming language and the Swift programming language.
A major aspect of the usability of the principle is an effortless interaction. In the Processing prototypes, I implemented the possibility to select individual cells by hovering them with the cursor and then using the multitouch capabilities of the trackpad of my laptop to navigate the interface and expand and shrink individual cells.
I realized that such an interface would have a wider variety of consequences on how content must be aligned to work optimally and it would open up further interaction possibilities. Hence, I conceptualized and prototyped more interaction paradigms that could work with such a system
A web browser seemed to be a useful first example of using the principle with real content. Not only could the use case of a web browser be tried out, but this would also open the opportunity to create responsive mockup HTML/CSS pages that could mimic other applications (e.g. an application of an automotive interface). This way, the web browser could serve as a universal "playground prototype" for designing different use cases.
