Monday, December 19, 2011

DPS app design spotlight: Van Gogh's Dream

(This is the fourth in an intermittent series of posts highlighting interesting or innovative apps built using Adobe Digital Publishing Suite.)

Van Gogh's Dream is an amazing piece of work. If you have any interest in the work of Vincent van Gogh, this is a must-have. But even if you don't, it is well worth the $10 to see the design, organization, and interface concepts used very effectively in this app.

The designers did so many things well. I'm only going to highlight a couple of things here. First, I like the way they used Unibody 8, a "screen type" for areas where very small type is needed. At the iPad's 132 pixels per inch resolution, it is difficult to render extremely small type clearly. Using fonts that don't employ any anti-aliasing (sometimes known as "bitmap" fonts) such as Unibody 8 or one of the fonts in the Minifonts line is a good idea. In the screenshot below, I've highlighted the use of Unibody 8 with yellow.

Screen1

 

Another innovation that I like in this app is the Table of Contents and Help screens. The TOC does a nice job of giving the user a "birds-eye" view of how this complex, content-rich app is organized. I like the way it gives the user a feel for how much content is in each section at a glance.

Screen2

 

When you tap the "Show the User's Guide" button, instead of a typical DPS help screen, you get a "full-size" replica of the DPS interface elements, with helpful explanations pointing to each icon.

Screen3

 

Spend some time exploring this cool app, and I'm confident you'll discover many other good DPS design ideas!

 

 

Monday, December 05, 2011

DPS app design spotlight: Chased By The Light

Apple just approved our latest iPad app, Jim Brandenburg's Chased By The Light. Lynn Phelps (Phelps Design) did the design, I did the technical production. This app is derived from the popular coffee table book of the same name. The RGB photos look stunning on the iPad...surpassing the best CMYK printing. We used InDesign and the new Adobe Digital Publishing Suite Single Edition to create the app.

The app contains video commentary, where Jim discusses how and why he took some of the shots. Throughout the book, we wanted the photography to be big, beautiful, and to take center stage. We didn't want video elements and icons to clutter up the screens. We also wanted the user to be able to view the photo while the video was playing.

If a particular photo has an accompanying video, there is a small "v" icon in the bottom left corner. When a user taps the "v" icon, the video plays in a 320px by 240px area in the bottom left corner. How did we do this?

 

Photo 1

 

 

Photo

 

The trick is to create a transparent "poster frame". We created a 320px by 240px PSD file in Photoshop that contains the white "v" icon artwork on a transparent background. We then used this mostly-transparent file as the "poster frame" for the video. You can choose a poster frame file for DPS video using the Media panel.

Mediapanel