To support the Uniformed Services University of the Health Sciences (USUHS) mission of advancing military health through education, research, and service, the Consortium for Health and Military Performance (CHAMP) launched Operation Supplement Safety (OPSS). OPSS offers evidence-based information on dietary supplements, empowering military personnel, their families, healthcare providers, and leaders to make informed choices about supplements. This initiative enables them to confidently pursue their fitness goals while prioritizing safety and adherence to military health standards.
CHAMP leadership and staff aimed to provide service members with a comprehensive understanding of the risks and benefits of supplement usage, but the OPSS.org website needed help with navigation, screen hierarchy, and mobile responsiveness. Users struggled to find critical features from the home page, and accessibility issues further hindered engagement. The design did not comply with modern web accessibility standards, making it difficult for users to find the needed information and potentially excluding some users from accessing critical information. Recognizing the need for improvement, CHAMP revamped the OPSS.org website to meet user needs better and offer an enhanced digital experience.
TIAG created an innovative, human-centered design to tackle these challenges and modernized the OPSS.org website. TIAG implemented a comprehensive strategy, starting with in-house user research and baseline assessments. The team analyzed usage trends, behaviors, and drop-out rates, which informed the creation of personas representing soldiers using supplements. These personas were instrumental in developing a goals-driven design roadmap tailored to soldiers’ specific needs.
Post-redesign, stakeholders reported an impressive 50% to over 100% increase in usage for some of the site’s most popular pages and features. TIAG’s comprehensive software development process for OPSS, grounded in Agile methodology and stringent coding standards, resulted in a robust, secure, and user-centric digital product. The iterative and feedback-driven approach, supported by powerful tools like JIRA, Azure DevOps, Adobe XD, Figma, Drupal CMS, PowerMapper, and WebAim, ensured the final product met user and stakeholder needs. The transition to maintenance ensured ongoing optimization and enhancements, providing a sustainable and continually improving digital solution.
The mission of the CHAMP HPRC is to decrease health risks and create positive behavioral change for service members through evidence-based education opportunities and events. HPRC’s education program focuses on human performance optimization based on the Total Force Fitness (TFF) framework.
The HPRC website is an extension of the larger educational effort by CHAMP. It has been in existence since 2010 and has gone through four iterations prior to this new effort. For this next iteration, the focus was on graphical appeal, updated navigation schemes, clear information hierarchy, easily searchable and readable content, and a pleasing responsive web mobile experience. TIAG UX specialists provided a customized human-centered design (HCD) approach that aligned with an agile development environment.
TIAG employed an agile iterative HCD process for the HPRC website. Our UX specialists created the optimal user experience by applying numerous HCD design and research methodologies to guide the design approach and meet usage goals. Research methods included analytics reviews, heuristic evaluations, user research, gap analysis, and user persona creation. Using the research as a guide, we created a series of mobile and web wireframes (or simplistic blueprints), conducted stakeholder design sessions, and built high-fidelity designs and site maps. To establish the ideal user interface approach, we conducted a comprehensive analysis based on 508/WCAG 2.1 guidelines intended for optimizing site accessibility.
By integrating a specialized HCD approach within the agile environment, we were able to expand opportunities to keep users at the center of the design and development process and further enhance the overall HPRC website. The final website redesign and optimization work met or surpassed baseline usage rate goals for key areas of the site. In addition, this effort far exceeded client expectations, resulting in contract extensions for follow-on sustainment and feature based work. Per the CHAMP Chief of Staff: “TIAG has been better than I imagined – we didn’t know what we were missing.”
While military service members often use supplements to augment an exercise and fitness regimen, if the user is unaware of their specific ingredients, they can actually inhibit performance rather than improve it or, in some instances, result in failed drug tests. As part of the Consortium for Health and Military Performance (CHAMP), Operation Supplement Safety (OPSS) strives to provide the best evidence-based information about dietary supplements to military service members, their families, healthcare providers, and leaders to achieve human performance optimization.
CHAMP leadership and staff required an accessible web application to help service members make informed decisions on the benefits and risks of supplement usage, and they were disappointed in the existing OPSS.org web design effort. Existing site challenges included problematic navigation schemes, confusing screen hierarchy, insufficient accessibility, and an unappealing responsive web mobile experience. Plus, many of the most popular OPSS.org features and resources were not easily discoverable from the home page – a crucial design limitation.
TIAG was tasked to produce an innovative, human-centered design to alleviate existing challenges and optimize soldiers’ experience with the website. Armed with stakeholders’ in-house user research, we reviewed site analytics data to get an in-depth understanding of usage trends and user behaviors (such as page views, usage rates, and drop-out rates) and conducted a baseline assessment. From there, we created personas based on research gathered on soldiers who engage in supplement use and then a goals-driven design roadmap. We were then able to design the information architecture scheme and wireframes for both web and mobile to provide visual context for stakeholders’ review. After soliciting insights and guidance from stakeholder and subject matter experts, we were able to construct high-level web and mobile prototypes. User interface color schemes, icon assets and style guides were created that upheld accessibility standards for visual design and sight impairments. Through collaborating with user experience specialists and developers, we were able to ensure the redesign effort met accessibility and design standards for the site.
As a result of these efforts, we created a compliant, visually appealing, and soldier-friendly OPSS.org mobile responsive website offering streamlined information and resource access for supplement safety. Post-redesign, stakeholders reported a 50% to 100+% increase in usage for some of the site’s more popular pages and features.