The Mine Safety and Health Administration (MSHA)
MSHA requested to update their outdated public facing website and intranet to improve overall online user experience that meets the DOL standards but most importantly, elevate The Perceived Value of MSHA.
Over 700 pages were developed over the period of couple of decades. There were many issues - outdated content, pages were inconsistently designed, redundant and broken links throughout the site, pages were taking forever to load and many more. Biggest complaint from end users were they can not find they were looking for. For instance fatality information, which the law requires MSHA to report any violation, accident, and inspection data on the website. These information were buried inside that requires lot of clicks and hence it was leading lot of user frustrations.
I embrace Design Thinking mindset. As the UX/UI Design Lead, I envisioned users experience of MSHA.gove and MSHA.net (intranet) and bring that vision to life in a way that transform into intuitive, accessible and easy-to-use websites that end users love. Strived to learn and gain empathetic understanding of end users, their needs, behaviors, and emotions to gather insights that inform website strategy and design. I owned various key research and methods such as key user flows, qualitative insight research, wireframes, visual design, hi-fi prototypes to show the full website experience to handing off the widget library, style guide for Dev team.
SIMPLIFY THE INFORMATION ARCHITECTURE(IA)
In this phase, I essentially focused on organizing content and flow as a whole. My user research insights helped guide a data-driven IA. I had combined Clickstream Analysis with Card sorting exploration methods for understanding the problem space, design scope and addressing end users’ needs. This helped me understand ‘what user say’ (Attitudinal dimension) vs ‘what people do’ (Behavioral Dimension).
I had conducted empathy interviews and open card-sorting workshops with MSHA stakeholders to validate I am moving in the right direction. This helps solidify organization and navigation structure I had proposed. This was an iterative process. This tremendously helped eliminate navigational inconsistencies and reduced the number of steps needed for a user to find what they were looking for such as fatality reports. I had used MindJet to aid visualize user flow.
WIREFRAMES TO PROTOTYPE JOURNEY
In this phase, I designed multiple wireframe options of a home page that conveys layout ideas, content, and page-level design that had useful features that featuring important components such as: Fatality reports, Mine Data Sources and calculations, Coal & Metal resources, Upcoming events.
In the user research, we had tested with the participants from various program areas (around 40 participants) who provided valuable feedback. I incorporated valuable insights in hi-fi prototype in the next phase. The high Fidelity interactive prototype helped established a realistic experience to encourage useful stakeholder feedback that I created in Axure.. Below are the before and after entire experience look like. MSHA.gov is now live.
Easy, simple yet modern interface that drastically improved the user experience as a whole.
- Refined and simplified workflow and user interface design to simplify experience.
- The DOL branding applied to ensure a consistent brand identity.
- Reduced cost of operation and eliminate the technical team need by implementing Drupal Content Management System (CMS).
- Easy to find most accessed and required fatality reports.
MSHA public facing website and intranet turned out in a way that they and we are proud of. Check it out