# UX Affordances of a Stack See [[Card Stack as Medium for Thinking]] for raw notes. ## What is a stack A stack is a novel interface for users to navigate, organize, and manipulate items of a variety of "data types" in a unified manner. Concretely, a stack is a visual presentation of an ordered list of items that can be navigated by scrolling up and down, where each item is visually represented by a card roughly the size and shape of a 3x5 index card. ..stack diagram.. ## Why we need a stack The DXOS model upends a key relationship between applications and data: rather than each application having a separate silo of data, there is a single shared substrate of data that multiple applications interact with. How does upending this relationship change the Composer environment? - **Many diverse types of data coexist.** Multiple applications read and write to the same data store, leading to a variety of items of various types and media: documents, images, whiteboards, table rows, person records, etc. - **Apps are always running.** Within Composer, applications can be thought of as all "running" simultaneously. There's no need to "open" or "quit" an application. There's no longer a need to differentiate between the modes of "view" and "edit." - **Items don't have an inherent location.** Items do not live at a specific location in a file system construct as files do, but rather in a database. Thus they can be visible in multiple places in the interface at the same time. (This concept is sometimes called transclusion.) This reversal creates a need for new user interfaces that are not predicated on an app silo model. We need new UI paradigms. Specifically, we need a way of navigating, organizing, and manipulating items that takes seriously: - Transclusion over location - Visualize multiple data types - Apps as simple views into data ## Prior Art In an application-centric world, there have been various solutions to this general problem. - The Desktop Interface: the desktop, folders, overlapping windows - macOS Finder Views - List - Grid - Columns - Quick Look - Block-based editors - On mobile, the ubiquity of UITableView on iOS - scroll up and down - pull-to-refresh - swipe left and right on items ## Data Structure Given any collection (ordered list or unordered) of items, that collection can be visualized as a stack. A stack presents an ordering of the collection: - manual sort order (stored in the list itself if ordered?) - currently active sort order (manual or automatic) - hidden item IDs - active view mode ## Stack Affordances The UX affordances necessary for a stack to function are as follows: - Add item to stack - Remove item from stack - Re-order stack (manual sort order) - Edit item (depending on the preferences) - Sort stack automatically - most/least recently updated - most/least recently created - by kind - by name - by size? - Navigate to the stack item - Drag item from any other view into the stack - Navigate up and down via keyboard Possible extensions of stack functionality: - Hide or archive item - the ability to leave something in the list but mark it as "dealt with" - archived or hidden - Delete item completely - Context action items based on item type - Collapse to list view (just headers of the cards) - Expand item to full height (but not navigate to the item) - Items must be able to customize their own appearance - Switch between different views (plugins) for any item - view a markdown doc as a doc or as a slide - Publish stack as web page - this is probably a _different_ plugin actually, just like Presenter is a different plugin ## Use cases How might we use a stack to accomplish a variety of user objectives? ### Browsing a diverse set of items Spaces within Composer can contain a variety of different item types. A stack can be used to visualize the items within a space and allow for them to be quickly navigated to, edited, and/or sorted. ### Queue of items to work through (inbox) - Rather than having a custom "email" plugin, a stack could be used to sort through and deal with emails - Favorited tweets automatically sent to a List, work through as a Stack ### Slide deck editor - Don't need a full "slide editor" - stack primitives give you most of what you need ### Curating a collection of related items - Pinterest - Collect multiple items into a stack - View the stack in masonry mode ### Notification queue - Rather than build a custom "notifications" feature in Composer, it can be built simply from the existing stack primitives - no special feature needed - Notifications plugin would handle the presentation, but stack would handle the list manipulation ## Open Questions - What about mobile? - Just like we don't use Finder metaphors on mobile (iOS metaphors instead), this interface is meant for Desktops (keyboard and mouse/trackpad, wider screen, etc) - Reduce things to Cards - different affordances - How do we make it more composable with other DXOS primitives? --- ## Raw Notes - Need a new paradigm for manipulating objects in our system b/c the system is different than others - Shared data substrate - Built for transclusion - Multi-media - Something in-between editing and browsing - Don't need to open the full application in order to edit the item (there are no "full applications")