UI Prototyping with MS Excel

1
UI Prototyping with MS Excel
Last updated May 26, 2004
Maggie Law, Interaction Designer PeopleSoft, Inc.
2
Why Prototype?

• Clear benefits
• Design, development, and innovation are all
  highly iterative
• Explore whats possible, evolve interesting ideas
• Communicate ideas clearly to one another
• Validate ideas with our users
• Reveal unforeseen issues early on --
  significantly reduce coding time!
• A really cheap way to make mistakes -- which are,
  of course, inevitable!
• Whats the best prototyping method to use?
• An effective tool is easy to use
• Lets you focus on what youre designing, not how
  to design it
• Encourages experimentation (fast, cheap,
  disposable)
• Different tools are appropriate for different
  situations
• Brainstorming early ideas (whiteboard, paper)
• Visualizing and validating ideas (Excel,
  PhotoShop, Powerpoint, Dreamweaver)
• Designing the back-end structure for front-end
  design (App Designer)

3
Why Excel?

• Why not Excel?
• We all have it
• Many of us have experience using it
• Offers highly useful features for prototyping --
  who knew?
• Quick manipulation of text, images, borders,
  backgrounds, form objects
• Built-in calculation capabilities
• Simple, boxy look and feel -- just like
  PeopleSoft! )
• Easy to comment in context
• Easy to group and organize related prototypes
• Produces relatively small files
• No need to reinvent the wheel each time -- start
  with the pre-made template!
• See for yourself
• Live or Memorex?
• The template file explained
• Demonstration of building a page

4
Getting Started

• \\adntfs30\ueHome\SCM\reference\awareness_training
  .html
• The Prototyping Training page on SCM UE web site,
  contains
• This presentation
• Is It Live or Is It Memorex? Can you tell which
  is the product screenshot and which is the
  Excel-based mockup?
• Latest version of Excel prototyping template