MI.GOV Site Design Evaluation

1. MI.GOV Site Design Evaluation October 2008

2. MI.GOV Usability Review • MSU Usability and Accessibility Center (UAC) • Reviewed rankings by studies like Brookings, Center for Digital Government • Prepared Analysis of Customer Satisfaction Survey • Led 2 Focus Groups • Prepared Heuristic Review

3. Diagnosis • Results of the study indicate that a redesign of the Michigan.gov site is necessary.

4. Strengths • Quantity of Information • Some users are highly satisfied with the site • Drop down lists for easy access to some online services • Location of Search Box

5. Weaknesses • Site is difficult for infrequent users • Overlapping content areas: Spotlight, What’s New, News… • Left and right image links look too much like advertising • Multiple navigation methods • Top most is overlooked due to dull coloration • Change of order in left navigation for selected item • Left nav items are arranged randomly resulting in difficulty scanning • Search: 33% report unsuccessful searches

6. Opportunities • Abbreviate, group and eliminate content on the home page • Eliminate and control clutter • Rename sections for better description of content • Remove duplicate links on pages • Eliminate animation • Use tabs for navigation • Order left nav alphabetically

7. Abbreviate, group and eliminate content on the home page • Too many sections contain similar type content • Quick Links and Featured Links are a mish mash of links • Too many text links in those 2 groups

8. Remove redundant content links • The SoM Home page has 4 references to News or Newswire

9. Remove redundant content links • The SoM Home page has 3 references for Jobs and 2 references for Lottery • 2 references to the Governor

10. Rename Sections • Services should be renamed to Online services or eServices • Departments and Directories should be clustered together • Directories should be renamed to Contacts • Quick Links is a collection of unrelated items • Same for Featured Links

11. Eliminate animation • Animation is distracting to the user • Image banners may be animated but should only run for a certain time span then quit animating

12. Use tabs for navigation • Users liked the tabs on other sites • Make tabbed navigation more noticable using color • Make use of drop down menus to improve use of space

13. Order Left Navigation Alphabetically • Improved scanning • Is a best practice • Eliminate active item moving to the top

14. More Recommendations • Create tabbed content targeted to various audiences • Less clutter/more whitespace • Use descriptive Page Titles • Improved metadata= improved search results • Use widgets to display multiple content items in less space

15. Next Steps • Create wire frame layouts devoid of detailed graphics • Wire frame should indicate groups, navigation, content • Examine “widgets” as content holders • Review taxonomy and look for economy in categories and navigation groups

16. What is Heuristic? • Heuristic evaluation is a usability engineering method for finding the usability problems in a user interface design so that they can be attended to as part of an iterative design process. • Heuristic evaluation involves having a small set of evaluators examine the interface and judge its compliance with recognized usability principles.

17. Two Focus Groups • Viewed and discussed other State home pages • Viewed Michigan.gov

24. Michigan.gov - What They Liked • Liked the pull down lists in the middle of the page • Lots of great information • Link to the Lottery site • Different colors of text to help separate content • News articles • Lottery news and link on home page

25. Michigan.gov - What They Disliked • Site is too text heavy • Unbalanced (“compressed to the left”) • Name: Official State of Michigan Portal seemed too tech-y • Unutilized space to the right • Insufficient space for the pull down lists • Hard to find things • Search problems • No picture in banner

26. Goals for MI.GOV 2009 • Consistent layout and design • Adequate and appropriate white space • Clean layout • Color-coded design • Content separated in visible containers • Impactful, professional quality images • Clearly identified banner images • Clear and consistent navigational hierarchy

27. Goals for MI.GOV 2009 • User group segmentation of navigation • Uses tabs for main or secondary navigation (where appropriate) • Breadcrumbs • Pages to inform users of redirects outside of the government site • Clear page identifiers • Clearer access to the Online Services section • Accessibility compliance with the Priority Level One standards recommended by the World Wide Web Consortium (W3C) • Web 2.0 Social networking implementation

28. Goals for MI.GOV Agencies 2009 • Strongly consider using an evaluation like this if you plan to redesign your site • MSU Usability and Accessibility Center is available to conduct unbiased site evaluations for you on contract • Make your site customer-centric • Heed the rules and laws of good Web design • Use sorting and grouping techniques to set up information • Accessibility compliance is still important • Request assistance from eMichigan • eMichigan keeps up on all of the latest usability and accessibility standards

29. MI.GOV Site Design Evaluation Questions?