US Department of Labor Navigation Redesign

The US Department of Labor needs a more user-friendly layout and navigation, allowing users to more easily accomplish the most common goals of using the DOL site. To do so, I simplified the navigation header, organized secondary navigation links using alphabetization and grouping of related content, and incorporated better chunking on the homepage.

Research Methodology:

I began by performing a heuristic evaluation, usability annotations, and conducting five zoom interviews to see how users accomplish tasks on the website. These insights were organized in an affinity diagram and a user persona was drafted. Issues were identified with the amount of links on the webpage and the layout of the forms page in particular. It was difficult for users to find what they were looking for due to lots of needless information and organizational confusion. To fix this I would need to cut through the noise and create a clear user path.



Definition and Ideation:

User Goals:

  • Locating DOL forms
  • Acquiring information about labor regulations
  • Staying up to-date with recent developments in US labor.

  • Identified Problem:
    The US Department of Labor website needs to consolidate a wide variety of services and info for its users. Extensive usability testing facilitated a cleaner, more organized navigation layout.


    Solution:
    Create a more user-friendly layout and navigation, allowing users to more easily accomplish the most common goals of using the DOL site.


    Card Sort



    To help the user accomplish the identified goals, I planned to simplify the navigation header, organize secondary navigation links using alphabetization and grouping of related content, and incorporate better chunking on the homepage.

    Prototyping:

    I created lo-fi wireframes for the navigation, and tried to minimize the amount of content on the homepage, so that users could more easily explore the page. A new navigational system was implemented. Visual polish and a clean, relaxing color scheme based on my style guide was applied. I felt that the webpage could use some calming colors, as users often visited the DOL because they were stressed about their work, or going through unemployment. Helping them feel at ease was imperative.


    Lo-fi Wireframes:


    Iteration and Testing:

    User testing revealed there was still some work to do. Primarily with the carousel on the homepage, which needed more user-friendly interaction. Instead of small clickable bubbles to alternate between "featured stories," larger arrows were created instead. Navigation was fully implemented, with hoverable results for quicker responsive feedback for the user.

    Final Prototype:

    Implemented Changes:

  • Re-organized navigation header with “topics” dropdown organized based on category. Other dropdowns were consolidated based on card-sort testing. Key topics are first category instead of a separate list that was on the right side and easily missed during user testing. Spanish resources are placed in the header instead of hidden in footer and header dropdowns.
  • Footer is simplified from list 20+ links into 2 categorized dropdowns. Icons used for social media links.
  • Implemented cleaner layout of quick links, blog, news and twitter feed. Improved chunking allows for easier navigation of homepage.
  • Converted hero image graphic into a carousel for featured stories, allowing for large attention-grabbing images without overwhelming the page. Carousel allows for more economical consolidation of information contained on original homepage.
  • Conclusions:

    Redesigning the UI for the Department of Labor website was an invaluable learning experience. I was most surprised by how important the insights I received from testing proved to be, as they fully guided my efforts. The issues identified in that phase became the problems I needed to solve in the revised product. I initially expected to focus on visual presentation, but during the redesign process I found that the most crucial aspect turned out to be functionality and organization. Navigation structures are the means by which a user finds what they need and accomplishes their goals, so they must be as intuitive and logical as possible.