Usability.gov Program Update and Site Redesign
•Download as PPTX, PDF•
3 likes•368 views
Usability.gov: The Research Behind the Redesign August 2013
Recommended
Recommended
More Related Content
Similar to Usability.gov Program Update and Site Redesign
Similar to Usability.gov Program Update and Site Redesign (20)
More from DigitalGov from General Services Administration
More from DigitalGov from General Services Administration (20)
Recently uploaded
Recently uploaded (20)
Usability.gov Program Update and Site Redesign
- 1. Program Update and Site Redesign | Aug 2013
- 2. 1 | Aug 2013 The New & Improved Usability.gov
- 3. 2 | Aug 2013 What We’ll Discuss… During this webinar we’ll cover: • Getting the initial buy-in • Redesign goals and resources • Taking our own advice • Touring the site • Measuring success • Our next steps and how you can get involved
- 4. 3 | Aug 2013 Getting the initial buy-in… Initially, we analyzed our metrics, conducted market research, high-level expert review, and content assessment. Recommended additional user research to confirm concerns and begin to identify improvements.
- 5. 4 | Aug 2013 Taking our own advice… This provided us an opportunity to improve, by becoming our own user-centered design case study.
- 6. 5 | Aug 2013 A user-centered approach… Among other methods, throughout the process, the team conducted: • Expert review • Market research • Metrics analysis • In-lab usability testing of wireframes for desktop and mobile versions • Remote interviews • Surveys • Focus groups • Card sort • Review feedback through social media
- 7. 6 | Aug 2013 Identifying and structuring content… To better understand the tasks that users or potential users come to the site with, we looked at a number of things. Throughout the process we: • Identified what we have • What’s working and/ or needed to be edited • Whether there were gaps, or added to • Learned about the need for the ability to relate content • Discussed challenges for implementing UX • What resources might help • What types of content the site should have • How the content should be presented
- 8. 7 | Aug 2013 Are we meeting expectations… Metrics: • Majority of our users are coming from search • Need to optimize for non-branded keywords • Need to redirect high-value content that had moved • Mobile engagement was comparatively low Remote Interviews & Surveys: • Outdated content and look and feel • Need for government-specific information • Need to show how the bigger picture comes together to improve the user’s experience Market Research: • Similar sites have broadened the discussion • Top tasks related to the topic were not on the site or did not have enough information
- 9. 8 | Aug 2013 Redefining our purpose… Usability.gov is the leading resource for user experience (UX) best practices and guidelines, serving practitioners and students in the government and private sectors.
- 10. 9 | Aug 2013 Redesign Goals… • Re-introduce the site as the leading resource for user experience (UX) best practices. • Take a user-centered approach and evaluate and improve our methods as we go. • Create a more engaging platform. • Create a more sustainable site moving forward. • Update existing content • Add additional content to cover what people are asking for • Make all content actionable and engaging • Relate content in multiple ways Content • Leverage Drupal’s more dynamic capabilities • Provide the ability to render content in a number of ways (cards or list)Technology • Create a fresh look and feel • Experiment with tile design • Take a mobile-first design approach • Make it a responsive design Design • Expand our network • Create a criteria for allowing external submissions to the blog • Determine a process to get people involved in the Guidelines update Outreach
- 11. 10 | Aug 2013 Time and Resources… •Project Management •Content Strategy •Subject Matter Expertise •Accessibility •Business Analysis •Change Management •Enterprise Architecture •Information Architecture •Interaction Design •Marketing •Metrics Analysis •Quality Assurance •Technical Development •User Research •Usability Testing •User Interface Design •Visual Design Timeline: •Concepts and research started in Nov 2012 •Site launched in July 2013 Areas of expertise were called upon throughout the process: Remember: Some people wore multiple hats and most weren’t in the day-to-day.
- 12. 11 | Aug 2013 Making content more useful… Need to show how all the pieces come together to improve the user experience. We added overviews, methods, templates, resources, and glossary terms for each area.
- 13. Started with designs for a smartphone screen, and then moved up and out in. Went beyond responsive design by designing first for touch and swipe and then reverse engineering for the more traditional click and scroll. Mobile-First Approach 12 | Aug 2013
- 14. It took multiple designs and several rounds of user testing to get to the end result. Focused on making it: • Functionally usable for both desktop and mobile users • Conceptually usable for all users • Accessible to all users Evaluating concepts for the new site… 13 | Aug 2013
- 15. 14 | Aug 2013 Demo of the site
- 16. Demo of the site 15 | Aug 2013
- 17. Demo of the site 16 | Aug 2013
- 18. 17 | Aug 2013 Putting It All Together The final tile design addresses these challenges through a number of functional and conceptual elements… • Double-wide tiles for featured content • Docked top-task tiles on every page for user orientation • Tiles that respond to gestures (directional swiping) on mobile devices • A list-view toggle option for a more traditional content layout • Organized and collapsible content sections to reduce users’ cognitive and visual load
- 19. Measuring success… • Are we reaching our intended audience? • How are they accessing the site? • Are users finding content on the site? If so, how? • What is our top content? • Is there content that people aren’t finding? • How are users interacting with the site? • Do users find the interface and content usable and appealing? 18 | Aug 2013
- 20. Refining the new site… • Upcoming usability testing • Analysis of metrics • Using Twitter as a customer service line • Reviewing comments through the page-level and site-level surveys 19 | Aug 2013
- 21. 20 | Aug 2013 Building a stronger community around the program… Accepting blog submissions and giving attribution Follow us and share ideas through on Twitter @UsabilityGov Sign-up for email updates Involving colleges and universities and recruiting a fall intern.
- 22. 21 | Aug 2013 Will the Guidelines be updated? Yes and we need your help! Tell us how you would like the process to take shape on our recent blog.
- 23. 22 | Aug 2013 Getting the word out… Feds can take part in: • GSA’s First Fridays Program • UX Community of Practice
- 24. 23 | Aug 2013 What we discussed… Today we covered: • Getting the initial buy-in • Redesign goals and resources • Taking our own advice • Touring the site • Measuring success • Our next steps and how you can get involved
- 25. 24 | Aug 2013 Contact Information… Katie Messner | Web Manager, Usability.gov Program Email: kathryn.messner@hhs.gov Stay Connected to Usability.gov Follow us on Twitter @UsabilityGov Sign-up for email updates
Editor's Notes
- Redesigned a tired, outdated, static website, turning it into a strategic, responsive, connected, forward-facing website. Basically, something that was more deserving of the name “Usability.gov” Launched in July 2013
- The New & Improved Usability.gov
- During this webinar we’ll cover: Getting the initial buy-in Redesign goals and resources Taking our own advice Touring the site Measuring success Our next steps and how you can get involved
- Initially, we analyzed our metrics, conducted market research, high-level expert review, and content assessment. We brought these finding to management and discussed this project as an opportunity to: Better our own processes and advice through updating content Update the look and feel Follow recent policies Increase engagement with the program Use it as a sandbox Better our own processes and advice Once we saw people were on board with the initial proposal to reboot the site, we recommended performing additional user research to confirm concerns and begin to identify improvements.
- Getting from point a to point b required taking our own advice. We wanted this reboot of the program and site to serve as a case study. So when identifying ways to improve our program and site, we said we wanted to take a user-centered approach and management agreed. This was an opportunity for us to not only get insights on the content, functionality, and design, but also and opportunity to gain insights about the challenges people face in taking a user-centered approach and how we might be able to better support them through our content.
- Some of these were done prior to getting the initial buy-in, some were done regularly throughout the process to refine concepts, and others will be ongoing as we continue to make iterative improvements. While performing these and as we move forward, we kept coming back to: What are the goals of the site and program? Who are our audiences and what are their goals? Are we meeting expectations? How can we improve?
- To better understand the tasks that users or potential users come to the site with, we looked at a number of things. Expert review, metrics analysis, market research, card sort, content audit Identified what we have What’s working and/ or needed to be edited Whether there were gaps, or added to Learned about the need for a strong taxonomy Interviews, Focus Groups, Survey, Discussed challenges for implementing UX What resources might help What types of content the site should have How the content should be presented
- With the green light to move forward, we took a deeper look into whether we were meeting expectations and how we some high-level areas for improvement. We looked at the: Metrics: Majority of our users are coming from search Need to optimize for non-branded keywords Need to redirect high-value content that had moved Mobile engagement was comparatively low Remote Interviews & Surveys: Outdated content and look and feel Need for government-specific information Need to show how the bigger picture comes together to improve the user’s experience Market Research Similar sites have broadened the discussion Top tasks related to the topic were not on the site or did not have enough information
- We re-thought our mission: Usability.gov is the leading resource for user experience (UX) best practices and guidelines, serving practitioners and students in the government and private sectors. And made it a conscious effort to always keep in mind our primary audiences: Government web managers UX professionals in public and private sector Students in a UX related field
- Our big, high-level goals for the redesign focused on: Re-introducing the site as the leading resource for user experience (UX) best practices. Taking a user-centered approach and evaluate and improve our methods as we go. Creating a more engaging platform. Creating a more sustainable site moving forward. We also had some more specific redesign goals for our new “sand box”. The Content: Update existing content Add additional content to cover what people are asking for Make all content actionable and engaging Relate content in multiple ways Technology: Leverage Drupal’s more dynamic capabilities Provide the ability to render content in a number of ways (cards or list) Design: Create a fresh look and feel Experiment with tile design Take a mobile-first design approach Make it a responsive design Outreach: Expand our network Create a criteria for allowing external submissions to the blog Determine a process to get people involved in the Guidelines update
- We had a longer timeline with this smaller site relative to our other refreshes (3-6 weeks) because we wanted to try many different things in this “sandbox”. With that, came pulling from many different perspectives to see how to make some of these goals happen. The core team consisted of a project manager, content strategist, and subject-matter expert. The rest of the expertise came into play at various points throughout the process. Remember: Some people wore multiple hats and most weren’t in the day-to-day.
- In our office, we believe that content is what’s most important. Our team encourages a holistic approach to building a user-centered website. So, it was no surprise when we found out through research that users and potential users were looking for more information that showed how the larger picture comes together to improve the user experience. As a result, you will no longer just find usability evaluation and user research methods and resources, you will also find information related to content strategy, information architecture, user interface design, interaction design, visual design, project management, accessibility, and analytics. We provide useful overviews, actionable methods, downloadable templates and other helpful resources for each of these. There is also government-specific content to help navigate some processes or challenge we uniquely face in the federal space.
- From the beginning we were looking at a tile-approached design. The reasons behind this included… Mobile-first thinking – the site was conceived to be responsive…usable on desktop, laptop, tablet, phone… responds to swiping up/down/left/right gestures on tablets/phones
- Armed with personas, analytics, and top-task information, the design team set out to create the tile approach. There ended up being 4 different design approaches used. Designs were fine tuned through intermediate testing a small group of users, quick tweaks, and then further testing. SHOW EXAMPLE OF DESIGNS Functionally usable – mobile users liked the swiping, desktop users wanted more scrolling Conceptually usable – we started with a broad mix of tiles…users wanted more organization to it Accessible – From day one the design team worked with the 508 team to ensure that the experience would be truly accessible for all users, despite any sensory challenges they might face
- Demo of the site
- The homepage shows… The top task icons on the left side A double-wide feature tile that can display any type of content
- The interior pages show… Docked top-task icons on the left side…upon hover, they expand to display the full title Toggle options for the row vs. list view…some desktop users just wanted to view things vertically, while mobile users loved the swiping interface Swipe-ability…mobile users can swipe the row to reveal more tiles Organized and collapsible content sections, allowing users to easily scan and understand what they are looking at as well as collapse it to lessen the cognitive and visual laod These actions are also all fully accessible for our users who use assistive technologies Our next actions will be an additional usability study to test out these final features. All the knowledge gained during these process will inform and contribute to the development and maintenance of the agencies websites down the road.
- Ultimately, the final tile design addresses these challenges through a number of functional and conceptual elements… TALK ABOUT EACH Double-wide tiles for featured content Docked top-task tiles on every page, to orient the user and give the users confidence to browse the site, but always be able to get back to their top needs Tiles that respond to gestures (directional swiping) on mobile devices A list-view toggle option for users who prefer to view content traditionally Organized and collapsible content sections to reduce users’ cognitive and visual load Let’s take a look at them in practice…
- We have a suite of analytics tools and a strong UX program that will be able to help us gauge success. Google Analytics Tynt Quantcast Radian 6 Twitter analytics AddThis Are we reaching our intended audience? How are they accessing the site? Are users finding content on the site? If so, how? What is our top content? Is there content that people aren’t finding? How are users interacting with the site? Do users find the interface and content usable and appealing?
- To refine the new site, we’ll continue to take our advice. We’ll make iterative changes based on… Upcoming usability testing Analysis of metrics Using Twitter as a customer service line Reviewing comments through the page-level and site-level surveys Feedback from other methods
- We’ve also looked at how to make this a more active, engaging, and sustainable platform for idea sharing moving forward. To do this, we are: Accepting blog submissions (criteria is on the website) Using Twitter not only to push out or amplify ideas, but also as a customer service line. Users are letting us know how we can improve and we’re responding. Share information through email updates Recruiting an intern for the fall semester
- We see the Guidelines as an important part of the reboot of our Usability.gov Program and now we know that many in the field agree. To kick this off, we recently presented an Idea Market at UXPA International in Washington DC. During the event we learned how and why people use the Guidelines and gathered recommendations on how we might improve them moving forward. First published in 2004, updated in 2006, and put into a database for easier access in 2012, there are 209 guidelines. We’re looking to define a process that is more efficient but keeps the Guidelines credible and authoritative to the community. We’ve recently blogged about what we learned at UXPA and want to know what you think. Please leave us a comment and let us know how you would like to see this process take shape.
- GSA’s First Fridays Program A usability education, demonstration and awareness program that focuses exclusively on federal digital services (websites, mobile sites, etc.). The program educates government web teams and program managers about usability via collaborative testing experiences and training opportunities. Its ultimate goal is that agencies will either begin their own usability testing programs, or hire professionals who can help them. UX Community of Practice The User Experience Community of Practice (CoP) is part of the Federal Web Managers Council. An interagency group of government Web managers, user experience specialists, and others who are interested in working to improve the usability of U.S. Government websites. Our goal is to support the use of user-centered design (UCD) principles and methods to improve government websites and web applications and enhance service to citizens. Members include employees of federal, state, local or tribal U.S. Government agencies who are interested in learning more about improving the user interface of government websites. Please note that CoP membership is limited only to government employees and contractors with a government email address.
- Today we covered: Getting the initial buy-in Redesign goals and resources Taking our own advice Touring the site Measuring success Our next steps and how you can get involved
- Katie Messner | Web Manager, Usability.gov Program Email: kathryn.messner@hhs.gov Stay Connected to Usability.gov Follow us on Twitter @UsabilityGov Sign-up for email updates