websights

How to Design for Digital

We’ve made many design decisions about how to bring textbooks to a digital device since we began designing Inkling. Some of the design problems we deal with apply to any e-reader software, while others are unique to Inkling, which we’ve designed especially for learning content.

Every reading system for electronic media has to deal with a limiting factor: the screen. You can only see so much content at once. Many e-book applications treat the screen space as a digital “page,” a centered block of type surrounded by generous margins, page or location numbers, and running heads along the top and bottom edges. In these apps, you slide sideways from page to page, reading one screen’s worth at a time. To see how far you are in the book, you refer to a horizontal indicator at the bottom of the screen that shows your progress in the book. Much like the playbar on a video, you can scrub along this scrollbar to jump to another part of the book.

We spent a lot of time early in the design process with a tough question: to page or not to page? Horizontal paging of content feels familiar because it borrows from the heritage of paper books. Moving across the content in a right-to-left direction also seems intuitive because it feels a bit like scanning across the horizon in the natural world.

 

But at Inkling, we deal with the unique and often challenging characteristics of textbooks. Words and images need to be tightly integrated, often at a 50/50 ratio. Textbooks are filled with components — call-out boxes, asides, learning objectives, and end-of-section questions, to name a few — developed by the authors to engage the student in active learning. Inkling books need to support these features as well as many types of media beyond text. They require activities like note-taking and bookmarking and many different types of reading: cursory, skimming; scanning, reviewing; deep, focused.

When we explored horizontal paging, and screen-chunking in general, we ran up against a number of stumbling blocks. What happens to the screen layouts when the reader decides to change the type size? (You’ll notice the newest iPad magazine apps, while beautiful in their page composition, don’t let the user change type size and reflow the text.) If the content is divided into screens, how can the reader highlight or annotate text that crosses the break? What kind of algorithmic magic is needed to ensure the screen layouts never have distracting gaps or unsightly orphans and widows? What happens to the screen chunks when the reader switches between portrait and landscape mode by rotating the device?

After an exhaustive exploratory phase, we decided that vertically scrolling text was the best solution. It doesn’t force the content into the confines of another medium — it feels authentically digital. It also embraces a design philosophy that the form should result from the content itself. Textbooks are naturally modular, so each section of content in Inkling is represented as a separate “card.” Reading cards expand vertically to the size of their contents, and when moving from, say, section 6.1 to 6.2 of the book, you see and travel through the empty space between cards. We also break out features like call-out boxes, illustrations, or 3D molecules into separate cards, which encourages interaction. Each modular piece of content becomes a singular, focused experience for the student as they move through the book in a non-linear manner.

At the same time, we’re keeping it familiar and stable. The text and images you’re accustomed to seeing on the printed page look suspiciously similar in Inkling, and features like jumping to page numbers are preserved so that students can use Inkling alongside classmates who still use the paper book. In Inkling, the content has a material quality. (This is quite unlike the web, which feels like an endlessly scrolling, hyperlinked stream of content.) You can see the length of your reading and your progress within it at a glance by looking at the spine on the left, just as you could thumb forward a few pages in a paper book to see how far you are from the end of the current section.

I know we’re doing the right thing when the small but significant interventions we’ve made in the design of Inkling are accepted by our users with a quick, “Oh right, that makes sense.” We hear from students in our pilot programs that Inkling makes reading “faster” and more “fun.” We want our readers to enjoy Inkling as a gateway to their learning content. The software should never get in their way.