Purdue iPhone Services: Graphics and Thumbnails

jstn's picture
Submitted by jstn on Fri, 03/06/2009 - 18:47

My instructions will be presented as an ASP.NET website, primarily formatted via CSS. Each individual service that I cover will reside on its own page. The name of the service will represent the page's title and leading header (the 'Headers' section in the attached PDFs). Each individual process will have a screenshot (provided by a native iPhone utility) and its own header similar to the 'Subheaders' section. The separate steps of each process will be enumerated and any sub-steps will be indented below the number.

For novice users, the screen shots will have the correct setting circled in red and referenced in the text beside the figure. Furthermore, each process outlined in the novice user pages will present more detail and clarification than the instructions for experienced users.

For experienced users, the instructions will be considerably more concise and fewer screenshots will be provided; only the screenshots that are necessary, or may be new to the user, will be included. As experienced users will be familiar with the iPhone interface controls, the area to click will not need to be circled on the figures.

iPhone nation

dbasso's picture
Submitted by dbasso on Sat, 03/07/2009 - 18:49.

I looked at mostly everyone’s layouts and I thought that yours was one of the best. The novice instructions were very impressive with the red layout around the touch screen. I am sure it did not take much thinking but the graphics are clean and easy to understand. I do not have a iPhone but I completely understand how your layout will work and what to press. I think when you are done with this manual you should give it to the ITap lab and make them pay you for it. I like how you went the extra step to put the pictures in your rough draft. The only thing I could think of is maybe introduce a color organizing scheme like TANoNati did in his. Maybe even put a full case around the iPhone so it looks like a college student just pulled it out and ready to follow the directions. That might sound stupid but a square screen almost is boring. Impressive.

Graphics and Thumbnails instructor feedback: jstn

Nathaniel's picture
Submitted by Nathaniel on Sun, 03/08/2009 - 17:39.

I have a few comments and suggestions:

  • Your graphics seem to be well selected. Additionally, the consistency of the images in terms of quality and size will insure a professional look.
  • I like that you plan on supplementing your graphics with elements that will focus the user's attention (circles, arrows, highlights, etc.).
  • Are you comfortable with the 8.5 x 11 page size? Do you think that is appropriate for both sets of users? (This is a genuine question.) Perhaps another page size would allow you to better utilize white space. Currently, you have some "trapped" white space between the elements, but very little around them.
  • I appreciate how the design of your instruction sets reflects the different audiences. The less cluttered appearance of the novice set seems to reflect the needs and expectations of those users. It gives such novice users a distinct way of using the instructions. Do remember, however, the novice set needs to be more than a scaled-down version of the expert set.
  • Remember to focus on creating instruction sets that differ in kind rather than degree.