Billy Hollis Consultant / Author Next Version Systems WUX205

The Customer: Sommet Group Provides services to small businesses Sommet Center in Nashville named for them

The Scenario: Temporary Staffing Management Small staffing companies (2 to 10 users) Match temporary employees to companies needing workers Orders and assignments Payroll and billing

Easy deployment, transparent updating Software-as-a-service Highly intuitive UI Distributed users Keep training minimal Increase revenue by finding more matches Essential Needs

The end result: StaffLynx Billy Hollis Consultant / Author / Team lead for StaffLynx development Next Version Systems

How We Got There Requirements gathering and documentation Originally expected to be ASP.NET Advent of Silverlight opened up new thinking Problem: how to use advanced UI capabilities So the prototyping began… First step: Is advanced UI worth it?

First StaffLynx prototype Billy Hollis Consultant / Author / Team lead for StaffLynx development Next Version Systems

First Prototype: Important Lessons Data templates are powerful Try to be “non-linear” Don’t think of the screen as a set of rectangular areas to pour things into

You Don’t Want This

First Prototype: Additional Lessons Traditional navigation not good enough Gradient color is effective Translucency preserves mental context Some experiments did not work Oval vs. square buttons In-place editing has usability obstacles

Conclusion from First Prototype Advanced UI is worth it, but lots more experimentation needed

Next Phase: Multiple Prototypes Developed several prototypes in parallel Basic idea: Develop one approach Pretend we can’t use it Develop another, significantly different Repeat until run out of ideas for approaches Then we hashed out the results with a group of users

Multiple StaffLynx prototypes Billy Hollis Consultant / Author / Team lead for StaffLynx development Next Version Systems

Multiple Prototypes: Lessons Learned Home screen resonates with users One place to find an entity Semi-modal child screens essential “Interrupt-driven” users Visual “dirty record” signal essential Animation essential to natural feel Don’t try to cram too much user action into pop-ups Pop-ups for additional detail work well, however

Process and Team Structure Process must be design-centric rather than code-centric Visual designer vs. interaction designer Interaction designer hard to find, needed early Visual designer easier to find, can come in later Collaboration User involvement

Major Lessons Let’s go through the most important lessons we learned in the development of StaffLynx Circumstances vary; only you can decide if these lessons apply to your situation

Work with People’s Brains Gradient colors Animation Goal is that they like it but they can’t tell you why

Use Both Sides of Your Own Brain Developers tend to be left-brained Visual sense, pattern recognition, empathy are right brained skills

Get Insides User’s Head Understand their work flow Understand where they add value Know their pain points Empathize with them

Multiple Prototypes Develop one approach Pretend you can’t use it Develop another Repeat until out of ideas

Collaboration is Essential

Question Everything Question every principle you ever learned about UI design Some will still apply Many won’t

Build Production Version from Scratch Prototypes should be hacks Don’t reuse them Production version needs manageability

Design, Don’t Decorate

Interaction Patterns Early, Styling Later Hard to change interaction pattern Easy to restyle

Learn and Use Templates Data templates make list boxes amazingly flexible Control templates drive look and feel

Don’t Get Bogged Down in Details Lot’s of things easy to change late in the game Color schemes Templates

Complex UI  Asynch data Use asynchronous data in WPF Required in Silverlight

Don’t Make First Project Time - Sensitive If you do, it will never live up to advanced UI potential

Result Can be Worth it

Sessions On-Demand & Community Resources for IT Professionals Resources for Developers Microsoft Certification and Training Resources Microsoft Certification & Training Resources Resources

Complete an evaluation on CommNet and enter to win!

© 2009 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.