UI Design in Apple iBooks Author
Friday, January 20, 2012 at 12:26PM
Sirlin

Apple recently announced a big push into education, expanding iTunes U's already awesome selection of free online University classes, and adding K-12 as well. Adding a new textbook section, with a whole bunch of features specifically for text books, such as note taking, integrated quizes, and the ability to automatically create flash card tests for yourself. These textbooks have several interactive elements: such as pictures you can zoom to take up the whole page, or swipe across to see changes over time in a diagram, custom javascript widgets right inside the book, and so on.

The thing that interested me most is the authoring tool though. There's a new program called iBooks Author that lets anyone create these books, test them on your own iPad (wow!), and put them up on iTunes for free or for sale. (Note: there was some PR fumble where people though Apple owned your content, but they don't. You are free to publish your content anywhere else too.) Anyway, pretty sweet.

The iBooks Author program was immediately accessible/understandable to me because the UI is basically the same as iWork programs such as Pages. The same buttons for inserting shapes or tables, working with text, working with graphics and so on. It has a few extra buttons for inserting widgets and publishing.

The whole reason I'm writing this is actually specifically the portrait/landscape mode feature. This is the very FIRST thing that I thought of regarding this authoring tool. How the hell are they going to handle that? Doing a layout when you know a fixed screen size/ratio is one thing, but how the hell is this authoring tool going to handle when you turn the iPad sideways? All programs/books do handle that, but this seems like a big problem. All the iBooks I've read before were just plain text, so it's only Apple's own UI that changes when you rotate a book, then the author's text gets reflowed to fit the page, no big deal. These textbooks can have very complicated page layout though, with graphics and text that have to be just in the right place to make it look right.

What's worse is that if you rotated a layout sideways, it wouldn't even fit the same number of words anymore. It would be possible for some words to get cut off when rotating due to how all the images fit in portrait vs. landscape, and now it would mess up all the rest of the layouts in the entire book. You really need to layout the entire book twice, once for portrait and once for landscape. That is decidedly un-Apple, especially if it's going to be in a consumer-level tool. Imagine if your graphic is in on page 6 of one layout, but page 7 in another, and the annoyance and frustration of laying everything out twice. What the heck are they going to do here?

I watched the official Apple video of the event where they announced this stuff. All these hassles I was puzzling about, the presenter swept aside in two sentences. He explained that sometimes you want to get right down to the text, and focus on that rather than all these extras. Viewing a book in landscape mode gives full page layout with pics, movies, and interactive elements as integrated parts of that layout. But turning the iPad sideways into portrait mode automatically changes the formatting, and extracts all those non-text elements and puts them in a labeled column to the left. You can touch any of them to make them full screen, then close them when you're done to return to rest of the book. And this view is generated automatically by the authoring tool, so book-creators only actually have to worry about designing the page layout mode (landscape). You get the portrait mode "for free."

I tried it out with one of the new texbooks on my iPad, and it works well, as promised. It makes sense. The reason I mention this is I thought it was an interesting example of lateral thinking--of solving a different problem rather than the one you're stuck on. I was imagining this whole "you have to layout every book twice, how do make a good authoring UI for that?" type of problem. But that's a sucky problem to have to solve. A simpler solution is to not have the problem in the first place.

I think that comes up in game design quite a bit. Many times I've struggled with the wording of a card in a card game where there thing it's trying to do doesn't fit so easily into the system. Sometimes we come up with a good wording. Sometimes we sort of can't and say we'll come back to it, then later realize that card should be doing a different thing entirely anyway, which just happens to be easier to write text for! So you know, if you're stuck on something, maybe come back at it from a new angle.

Article originally appeared on Sirlin.Net (http://oldsite.sirlin.net/).
See website for complete article licensing information.