Dash: A Hyper Framework
Popular application suites, as well as specialized apps, are designed for workflows in which users focus on a single task for extended periods of time. These application silos slow down the many other workflows that require users to move with agility between tasks in a single working session. This is particularly true for creative people who have personalized patterns of gathering, organizing, and presenting information from a variety of sources.

Dash: A Hyper Framework

Authors: Stanley Yip, Bob Zeleznik, Samuel Wilkins, Tyler Schicke, Andries van Dam

Full-text formatting converted from the supplied ACM version of record under ACM authorization. Source: ACM Digital Library.

bcz@cs.brown.edu samuelwilkins@brown.edu

tschicke@gmail.com andriesvandam@brown.edu

Brown University

Providence, RI

Abstract

Popular application suites, as well as specialized apps, are designed for workflows in which users focus on a single task for extended periods of time. These application silos slow down the many other workflows that require users to move with agility between tasks in a single working session. This is particularly true for creative people who have personalized patterns of gathering, organizing, and presenting information from a variety of sources. Moreover, each application comes with its own learning curve and data model, restricting users seeking to extend their workflows and in some cases, losing data through poor data transferring mechanisms such as clipboard copy and paste.

Dash is an open component-based hypermedia system that pro- vides what we believe to be a best of breed set of components. While each component can be used in isolation as less full featured ver- sions of an analogous application, Dash allows users to interoperate components and compose their own workflows without losing data or expending effort while switching between tasks. As hypertext allowed users to flexibly move between texts, Dash allows users to flexibly move between tasks.

Ccs Concepts

• Software and its engineering →Software design engineering; • Human-centered computing →User interface programming; Hypertext / hypermedia; Collaborative interaction; Web-based interaction; • Information systems →Document collection models; Personalization; Document structure.

Keywords

Hypertext; Hypermedia; Document Engineering; Workflow Sup- port; Collaborative Editing

Permission to make digital or hard copies of part or all of this work for personal or classroom use is granted without fee provided that copies are not made or distributed for profit or commercial advantage and that copies bear this notice and the full citation on the first page. Copyrights for third-party components of this work must be honored. For all other uses, contact the owner/author(s). HT ’20, July 13–15, 2020, Virtual Event, USA © 2020 Copyright held by the owner/author(s). ACM ISBN 978-1-4503-7098-1/20/07. https://doi.org/10.1145/3372923.3404807

ACM Reference Format: Stanley Yip, Bob Zeleznik, Samuel Wilkins, Tyler Schicke, and Andries van Dam. 2020. Dash: A Hyper Framework. In Proceedings of the 31st ACM Conference on Hypertext and Social Media (HT ’20), July 13–15, 2020, Virtual Event, USA. ACM, New York, NY, USA, 2 pages. https://doi.org/10.1145/ 3372923.3404807

1. Video

We have created a short video that showcases some of the simple features of Dash.

2. Use Of Pareto’S Principle

We believe that most information workers approach a single work- flow by switching through a series of views tailored to different features of their data. Adapting Pareto’s Principle, we posit that these users would benefit from having integrated application com- ponents each of which may be only ~20% deep in functionality, over functionally deep applications or highly focused applets that are siloed from each other. Because of the ‘there’s an app for everything’ mindset, the current generation of sophisticated smartphone users must juggle ad hoc collections of simple apps in a manner loosely analogous to the pre-hypertext problem of having to search for and then switch among various linear texts. In Dash, we re-imagine this sequence of operations as switching between different UI views over a single database as opposed to marshalling data between different applications.

The foundation of the Dash approach is being able to transclude any information view into any other view. Views range from simple media displays (e.g., RTF, PDF, HTML, audio, video) to compound layouts (e.g., spreadsheet-like schemas, dynamic pivot views), anal- ogous to apps, that emphasize specific aspects of the data they transclude. When changes are made to data in any one view, they are immediately reflected in all other views without any need for tedious, error prone or even lossy user-driven data transfer. Dash users instead compose data views using the same tools they use to edit their data as the two processes are naturally blurred.

3. Transclusion And Views

Beyond views of primitive datatypes, Dash supports a set of Col- lection views that each displays its transcluded documents using a layout reminiscent of popular apps (e.g., Trello, file system viewer, spreadsheet). However, these standard views are each composable so that users can define new views that target their specific work- flows and data. The following collection views are available in Dash:

• Freeform: Documents viewed on an unbounded 2D canvas. • Grid-like Views: Documents can be viewed in various grid- like structures, such as in a single stack, multiple stacks, and 2D grids. • Tree: Documents are viewed hierarchically. Any document can be expanded to view a list of transcluded documents or a live inline preview. • Schema: Documents are displayed as a row, where each column displays the contents stored with the specified key for that document. Each cell can be edited to update the key/value pairs for the selected document. • Timeline: Documents are viewed in a 1D timeline that pro- portionally lays out documents based on the values of a user-specified key.

In addition, any document can be simultaneously viewed either in different locations within a single Dash instance, or on different machines by different users for synchronous and asynchronous collaboration.

4. A Hyper Framework

Our research vision is to provide a ‘hyper’ solution not just for creating and following links between traditional texts and media, but also for reusing and composing general purpose information structures to support unique, personalized workflows. In essence, we want users to be able to think in a unified, generalized way about authoring information layouts with embedded navigation trails. Dash addresses this goal by including four significant traits that collectively distinguish it from the many systems from which it borrows features:

(1) Main features appear like a federation of smaller or familiar

apps (e.g, Prezi, OneNote, Trello, Excel), but are designed to be freely composed or modified in the manner of Haystack[2] and used as templates to create new dashboard-like views. (2) Functional scope is broad enough that users can perform

most all their information management activities (e.g., writ- ing, searching, encoding relationships spatially and via hy- perlinks, presenting, publishing) within it, analogous to how programmers use an IDE. In a sense, Dash is an IDE for multimedia documents in the style of Tinderbox[1]. (3) Everything is a document (including regions, links, annota-

tions, etc.), stored as a list of key/value pairs to provide a simple data model for novices while also allowing experts to manipulate from a database perspective with scripts. (4) The browser implementation supports platforms from phones

and laptops to interactive whiteboards, and all common me- dia, including rich text, PDF, image, audio, video, digital ink,

webcam, and HTML. Synchronous and asynchronous collab- oration on a shared collection are facilitated by a browser based application. Just as hypertexts help readers flexibly navigate through texts, we want information workers to be able to freely transition among collecting documents, taking notes, structuring data, discovering and encoding relationships spatially, via hyperlinks and via script- based agents, making presentations, creating web pages, and more. Each of these transitions may involve a variety of hypermedia features including, in the most general sense, linking, transcluding, and transforming documents.

5. Implementation

In Dash, documents are the basic building block; not just primi- tive content types, but also regions, anchors, links and annotations. Documents are structured as a dynamic set of key/value pairs, where each value is either an atomic element (number, string, URL, rich text), a reference to another document, a list of values, or a script. Each document can also have a prototype allowing for pro- totype/delegation inheritance. For example, consider the structure of a single text document. At its core, there is a generic text proto- type which defines key/value pairs dictating the default way any text document can be viewed. A data document inherits from the generic text prototype and defines intrinsic metadata, such as the creation date, in addition to the text of the document. Author and other user-defined metadata can be added at any time or dictated by a layout template. Finally, a layout document inherits from the data document to add view-specific metadata, such as position, width, and height. Typically, this text layout document would be transcluded in a collection document which would render the text document and potentially override any layout metadata, analogous to CSS property inheritance. Aliases allow a data document to be transcluded in multiple views, and with different layout documents.

For consistency with the fundamental ’everything is a document’ notion, a link in Dash is just another document with two required key/value pairs referencing the two anchor documents; all links in Dash are bidirectional. These links can be used naively to create coarse links, from media document to media document, or to create fine-grained links that instead connect arbitrary regions on (or sub- sections of) media documents. Links have two anchors, but anchors are documents, so they can be arbitrarily complex. Following a link will first try to focus on any opened view of the destination document. If multiple views are opened, only one will be focused. If no views are opened, a new view of the destination will be opened in a new pane.

Acknowledgments

We gratefully acknowledge the support of Microsoft Research and Adobe Research.

References

[1] Mark Bernstein. 2017. The Tinderbox Way (3rd ed.). 492 pages. https://www. eastgate.com/Tinderbox/updates/Tinderbox86.html [2] David Karger Eytan Adar and Lynn Andrea Stein. 1999. Haystack: per-user

information environments. In Proceedings of the eighth international conference on Information and knowledge management (CIKM ’99). Association for Computing Machinery, New York, NY, USA.

Do you like what you are reading? Subscribe to receive updates.

Unsubscribe anytime