A few months ago an article called Storyboarding Rich Internet Applications With Visio written by Bill Scott was published on Boxes and Arrows, a popular Information Architecture site.

In the article, Bill goes through an example of using Visio to design an inline editor for changing photo titles in a photo manager. The end result is that you can double-click on each step in a storyboard diagram to show layers of the diagram representing the various states of the inline editor. Cool stuff.

I thought it would be interesting to prototype the design in Axure RP 4. I created the inline editor using a dynamic panel and created the editor with an image as a master. I repeated the master on the Home page to better represent what the experience would be like in the actual application. After doing that, I noticed that editing a title caused the save and cancel buttons to overlap with the image to the right. Usability issue? Maybe, maybe not, but it made me think twice about the design.

You can download the file here or view the prototype here. The prototype was designed for changing the title to "Water lilies" as described in the annotation on the Save button.