Interface Requirements of an Interactive Layout Application . 32

In a layout application, the specification of constraints is mandatory. Every user action will specify a layout constraint. Still, the interaction must feel as natural and intuitive as in a common drawing application. The relation between a user’s action and the visual result is only indirect however: The user input is fed to the layout constraint system whose solution is presented on the screen. Thus, the design of an interactive layout application poses many new challenges. Since the principles of direct manipulation interfaces are formulated in very general terms, it is necessary to analyze how they apply to the problem of designing an interactive layout application.

Understandability

A direct manipulation layout application must let the user interact directly with shapes and constraints. Therefore constraints must be visualized and the constraint semantics must be immediately obvious from the visual repre-sentation. Although constraint visualizations are necessary, they introduce visual clutter and hence additional complexity as experienced in Briar. This effect can be reduced if the number of available constraints is reduced to the minimum, i.e., only to constraints that represent very simple and familiar concepts in the user’s mind. The number of constraints visible at the same

2.4. INTERFACE REQUIREMENTS 33 time can also be reduced, e.g., by only showing the constraints affecting the currently selected set of graphical elements.

During a user action, the manipulated objects must be permanently repre-sented on the screen. If the effects of an ongoing user action are continuously visualized, the constraint solver has to run repeatedly during a user action.

Obviously, this affects the system performance. But too much visualization during a user action can increase the user’s confusion rather than his com-prehension. While the user manipulates an object, e.g., while he moves it over the page, the object goes through many intermediate states between its original position and the desired target position. If the user has at least a rough idea where the element should be placed based on his own preferences, the intermediate visualizations will only surprise and detract him or her but they will not provide any important information.

Reversibility

If the system gives some visual feedback during a user interaction, the user can reevaluate and cancel the action at any time. The system must support undo and redo with an infinite number of undoable steps so that any action that – despite the visualization – did not have the intended result can be reverted with the click of a button.

Reproducibility

The same sequence of user actions must always yield the same result, i.e., the system behavior must be reproducible. This implies that the system must have no hidden state that the user is unaware of and that cannot be directly manipulated. The requirement of reproducible results limits the applicability of random algorithms in interactive applications.

In previous constraint-based drawing applications, the user could make drawings without any constraints. Constraints were used to improve the accuracy of a drawing, but they were not required. It was thus a natural idea to change the initial drawing minimally until all constraints were satisfied, but this made it difficult to reproduce the same drawing.

A layout application, on the other hand, is expected to tolerate large deviations in the user’s input and – within certain bounds – should arrive at exactly the same result. If the exact input positions influenced the layout process, the user would have to put great care into his initial drawing which would run counter to the whole idea of an automatic layout system. Thus, a layout algorithm must calculate the same layout reproducibly even given altered input.

Controllability

No matter how good the results of a layout algorithm are, some users will have very specific ideas how the page content should be laid out. A layout system has to offer its users the power to specify exactly where an element is placed and what size it has. Such user decisions should be final, i.e., they must be respected by the layout algorithm. The user should be able to place a few elements at exact positions while the remaining elements are positioned by the layout algorithm. Thus, if necessary, the user has full control over the layout.

Previous constraint drawing applications maintained all constraints dur-ing user interactions. Changdur-ing some property of a sdur-ingle element could have caused several other objects to change as well, if they were connected by a chain of constraints. Users frequently found this behavior hard to under-stand [117]. An action’s consequences are much easier to underunder-stand if they remain local. Thus, every user manipulation should only affect the selected graphical elements and all other elements should be left unchanged. Con-straints between the manipulated objects and the rest can be removed if they become unsatisfiable. Such an approach is feasible in layout applications but not, e.g., in CAD applications as explained in section 2.2.4. In a layout ap-plication, constraints are merely a way to persistently represent prior user decisions which the user can override and change at any time.

Over- and Underspecifiability

A layout system must be able to deal with under- and over-constrained in-puts. Under-constrained inputs are the default for a layout algorithm. If the layout were completely specified, there would be no need for a layout algorithm. Over-constrained inputs will occur frequently, e.g., if the space required by the content on a page exceeds the available page space. For over-constrained inputs, the layout system must calculate a layout that violates as few constraints as possible. The solution should indicate visually which parts of the input are too constrained. Essentially, the layout algorithm must always generate a result and is never allowed to fail with an error message.

Chapter 3 System Overview

This thesis proposes novel techniques to layout a wide array of documents.

The contributions of this work include both an algorithm to solve a generic class of layout problems and an intuitive interface to specify instances of such problems. The layout algorithm and the user interface have been im-plemented to demonstrate their usefulness. The resulting system is called the Interactive Constraint-Based Slide Manipulation system or ICBM in short.

This chapter presents the problem ICBM is designed to solve and explains the basic architecture of the ICBM system.

3.1 The Chore of Manual Document Layout

Figure 3.1 shows a sequence of document layouts a user may have created with the following actions:

1. The user picks the desired chart type from a menu and clicks at the desired insertion position,

2. inserts the chart legend at the top-right corner of the chart, and 3. selects a text box from the menu which he resizes to align left and right

with the chart. The result is shown in Fig. 3.1a.

4. The user inserts a narrow table to the right of the chart and starts typing. There is not enough space to fit all the necessary text.

5. The text box, the chart, and the legend have to be selected and moved to the left until the table can be made wide enough. This may take several tries until the resulting layout looks as depicted in Fig. 3.1b.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum nisl. Nunc vestibulum arcu eget sem. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer lacus est, eleifend nec, blandit et, ullamcorper eget, pede. Vivamus sagittis laoreet lectus. Duis vehicula mauris quis odio.

Series Series Series

Series Series

Series Quisque diam sapien, auctor sit amet, lacinia quis, eleifend sit amet, urna. Praesent pretium ullamcorper urna. Praesent nulla.

Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut vestibulum neque ut justo. Ut vitae libero ac tellus viverra fringilla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.

Pellentesque mi orci, auctor vitae, fringilla eu, rhoncus sit amet, arcu. Pellentesque lacinia venenatis nulla. Sed arcu. Aliquam fringilla lobortis neque. Morbi commodo quam id urna. Donec pretium suscipit dolor. Curabitur eget magna eget neque bibendum interdum.

PRO

(a) (b)

Praesent pretium ullamcorper urna.

Praesent nulla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut vestibulum neque ut justo. Ut vitae libero ac tellus viverra fringilla. Class aptent taciti sociosqu ad litora torquent per conubia n o s t r a , p e r i n c e p t o s h i m e n a e o s . Pellentesque mi orci, auctor vitae, fringilla eu, rhoncus sit amet, arcu. Pellentesque lacinia venenatis nulla. Sed arcu. Aliquam fringilla lobortis neque. Morbi commodo quam id urna. Donec pretium suscipit

Praesent pretium ullamcorper urna.

CONTRA

Series Series Series

Quisque diam sapien, auctor sit amet, lacinia quis, eleifend sit amet, urna. Praesent pretium ullamcorper urna. Praesent nulla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Ut vestibulum neque ut justo. Ut vitae libero ac tellus viverra fringilla. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Pellentesque mi orci, auctor vitae, fringilla eu, rhoncus sit amet, arcu. Pellentesque lacinia venenatis nulla. Sed arcu. Aliquam fringilla lobortis neque. Morbi commodo quam id urna. Donec pretium suscipit dolor. Curabitur eget magna eget neque bibendum interdum.

PRO

CONTRA

Figure 3.1: Adapting layouts when the content changes.

6. The user reflects on the information he would like to convey, decides to present both sides of the argument, and adds another table column.

7. Again, the text box, chart, and legend have to be moved to the left to accommodate the wider table.

8. The user has to make both table columns narrower and taller. Fig-ure 3.1c shows the slide after this step.

9. Finally, the user’s boss drops in to say that she would like to see the latest data included in the chart. The user thus adds two columns to the chart.

10. First, the user has to realign the left and right text box edges with the wider chart. The text box height can be reduced too.

11. Then the legend has to be moved next to the chart again.

12. The text box, chart, and legend have to be moved until they almost align with the left page border.

13. The user has to resize both table columns again, making them narrower and taller until the final layout of Fig. 3.1d is reached.

3.2. INTERACTIVE LAYOUT OF PRESENTATION SLIDES 37

Im Dokument Sketching Slides (Seite 44-49)