Background
In desktop publishing, a page break is an invisible control character which alters the presentation of text on the digital page. It occurs in text without appearing to the user and signifies to a text system that layout should end for the current page and pick up again on the next page.

Practically speaking, a page break allows a user to begin writing on a second page without filling up the first and without pressing the return key a dozen times to get to it. Its flexibility allows the user to then return to the first page and write without shifting the text on the next page, which otherwise occurs when a series of newlines (return keys) are used to simulate a page break.

Page breaking has been a widely requested feature throughout Per Se’s beta testing. Users would like to leave the left side of the journal for images or notes and write exclusively on the right side, or they would like to begin another topic on the following page, leaving the remainder of the current page empty.

It is a reasonable request. It is more than reasonable; it is expected, and I had put it on the to-do list for a future update without realizing how significant that expectation was. I also believed, wrongly as it turns out, that page breaking would be a difficult addition to make. I decided to postpone any research, not wanting to modify Per Se’s code in a large way so close to the release date and lacking the time to investigate the feature properly.

Interfaces
I only realized the necessity of page breaking in Per Se after reading the chapter on metaphors and idioms in About Face, The Essentials of Interaction Design. I had been reading about storage and retrieval systems when I was referred to this chapter, in which the author describes three interface paradigms: metaphoric, implementation-centric and idiomatic, criticizing the first two in favor of the third.

Metaphoric interfaces mimic real world objects, telephones, for example, or folders, filing cabinets, notebooks, planners and so on. They have become hugely popular with the rise of the iPhone, iPad and touch technology, as the tactile interaction establishes a similarity between software systems and physical objects. If the software looks and attempts to behave like its real world counterpart, it is metaphoric.

Idiomatic interfaces introduce easy to learn relationships between interactive elements and their functionality. Unlike metaphoric interfaces there is no pre-established relationship between the design and the system’s behavior. Idiomatic interfaces don’t mimic real world objects, and the relationships between appearance and function are arbitrary. A hyperlink is a good example. There is nothing inherent about underlined blue text which suggests clicking it will take you to another web page. But once you have learned this behavior, it is easy to recognize and apply yourself.

Implementation-centric interfaces base the design on the internal workings of the system. The layout is ordered such that it mirrors the organizational structure of the system it is presenting.

Journals & Journaling Software
Most journaling software is implementation-centric. Writings are organized by date and by list, maybe by folder as well. This is exactly how the software’s object model is organized. An entry object is associated with a date, and many entries may appear on a single date. The user needs a way of accessing those dates and selecting one of the entries which occurs on it. If there are folders, there is also a container object which refers to any number of entries, one of which must also be selected from a list for viewing and editing. The on-screen presentation explicitly duplicates the software’s data organization pattern, so that you see a calendar, folders, and a list of entries.

But is this how we actually keep a journal? Hardly. I certainly don’t look at a calendar on the inside front cover which refers me to the correct page for a given date. And I rarely even use the date when I’m looking for an entry I previously wrote, partly because the date may have been a matter of complete indifference to the topic, partly because I don’t index or associate in my mind entries with a specific date.

If I am creating a new entry, mostly I just open up my journal to the next blank page and start writing. I note the date only because it is the most immediate means of organizing the journal, not because it is the most significant. When I’m looking for a previously created entry, often it is by content or by topic: what I wrote or that about which I wrote. Folders help here as well as tags, which are just folders that collect their content by topic automatically.

But knowing what I’m looking for — if I am so fortunate to even have this — and recognizing that I’ve found it are two different things. If I have a hundred or more entries on a given topic, knowing that I’m searching for an entry about this topic hasn’t yet found it for me. I still have dozens of potentially lengthy writings to search through.

When I’m perusing my written journal, seeking out a specific entry, often, and somewhat surprisingly, it is not the content which provides the most important cue to recognizing the entry I’m looking for, but its appearance, how I placed the text on the page, whether I left a lot of empty space or wrote in a box, used arrows and diagrams, added images and so on. It is the form rather than the material by which I recognize an entry, even though it is the material I seek. And this has nothing to do with calendars, lists and folders.

Per Se & The Importance of Page Breaking
Per Se obviously establishes a metaphoric interface. I didn’t explicitly set out to create this kind of interface when I first envisioned the application. Really I was just jealous of the gorgeous interfaces being developed for portable, tactile platforms and wondered why they couldn’t also be implemented on the Mac. I was also reacting against the currently dominant paradigm in Mac journaling software and was hoping to create a unique product.

The author of About Face is strongly critical of metaphoric interfaces. He enumerates a number of limitations, many of which I must take into consideration as I continue to develope Per Se, but the one which immediately caught my attention concerns the expectations that metaphors engender:

"After the user depends on the metaphor for recognition, he expects consistency of behavior with the real-world object to which the metaphor refers."

Per Se mimics a physical journal. With a physical journal it is possible to use both sides of the open page without filling up one side first. Per Se in its current form (RC2) permits this but only incompletely. For example, Per Se supports text wrapping around images. And while it is possible to place images, notes, flourishes, files and any other kind of attachment on the right side of the journal without filling up the left, it is not possible to actually write there. Text layout is “linear and continuous”, as I’ve told a dozen beta testers. You must fill up the left side of the page first.

Per Se establishes and immediately breaks the metaphor of the physical journal.

I don’t think it’s possible to over-emphasize the importance of meeting user expectations when designing software. If an interface begets expectations and they are not met, it is frustrating. Very frustrating. So much so that users will stop using your software if it doesn’t work the way they expect it to. There are some expectations you cannot account for, but when the design you have created establishes expectations which it does not meet, you are wholly responsible for the failure. And by you, I mean me.

Implementing Page Breaking
After reading that passage in About Face I decided to take another look at page breaking. I knew Text Edit permitted it, so I checked the sample Text Edit source code included with every copy of Apple’s developer tools. The menu sends the message insertContainerBreak: to the first responder. I couldn’t find it in Text Edit’s source, but a second quick lookup showed that it was an NSResponder method explicitly implemented by NSTextView to insert page break control characters.

Meaning page breaking is built into the system text objects. Meaning it requires exactly zero lines of code to get this working in Per Se. Sure enough, after hooking up my own menu items to that first responder message, Per Se was supporting page breaks.

The implementation wasn’t quite right though. I had added the page break command to the Insert menu, which is where users find commands for links, checkboxes, tables, attachments and so on. In order to page break, you had to select the menu item, which is clearly not how users move to the other side of their physical journal. They just pick up the pencil and set it down on the opposite page.

The equivalent is clicking on the other page with the mouse. Responding to one click might be a bit unexpected and jarring, the more so if it isn’t obvious how to get rid of the page break, not because pressing the delete key or selecting Undo is difficult but because a single mouse click in empty space doesn’t generally have that kind of effect.

Instead, I opted for two clicks. With less than five lines of code, I am able to override NSTextView’s mouseDown: method, check for the presence of glyphs, or laid out text, on the page, and if there are none insert a page break. From the user’s perspective, all she has to do is double click on the empty right side of the journal and begin typing there. She can continue to place images and attachments however she wishes, and she can return to the left side and write without altering the position of the text on the right side.

All in all it works beautifully and as expected, and it required hardly a modicum of effort on my part.

It isn’t just a superfluous metaphor
Supporting page breaks is important for two reasons. While there may be enduring problems with metaphoric interfaces, software which nevertheless pursues this paradigm must pursue it as completely as possible or risk negating user expectations and losing customers. If Per Se is to be a successful program, it must work the way users automatically expect it to.

Completing the metaphor isn’t just a matter of internal consistency. As the author notes in About Face, metaphors are visual. When they work, they work because humans rely largely on visual cues when navigating their environment, and especially when recognizing objects in that environment. By ensuring that Per Se works the way users expect it to I also enable a more robust, natural way of recognizing data: by its appearance, rather than by its content or its temporal or hierarchical location on a date or in a folder. Which is quite a feat considering that Per Se is dealing mostly with text.

Custom, digital page layout that includes page breaking is a significant step towards completing the metaphor of the physical journal. It empowers the user in natural but unexpected ways. And once you’ve tried it, you just can’t help notice how cool it is.

[[ Originally posted at http://getsprouted.com , but it feels more appropriate here. ]]

Leave a Reply