Surfing the Web with Ease: Redesigning Hawaii's Safe Travel Site

The Hawaii Department of Health's safe travels program is a critical initiative to help prevent the spread of COVID-19 in the state. However, the original website for the program was difficult to navigate and posed obstacles for tourists trying to get their COVID-19 tests and vaccinations approved. In response, the Hawaii Department of Health partnered with a UX design firm, where I played a key role as a UX designer, to redesign the website and make it more user-friendly. This comprehensive case study highlights the extensive UX design process I undertook to improve the website.

To kickstart the design process, I conducted thorough research to understand the pain points and usability issues of the original website. This involved analyzing user feedback, conducting heuristic evaluations, and reviewing existing data. These research efforts provided valuable insights into the specific areas that required improvement.

To identify usability issues and design inconsistencies, I performed a heuristic evaluation on various aspects of the website, including appearance and aesthetic, content, navigation, and functionality. Based on the evaluation findings, I created redline annotations that highlighted the specific areas for improvement. These annotations served as a guide for developers, ensuring the accurate implementation of UX enhancements.

To validate and refine the website's information architecture, I conducted guerilla testing with a diverse group of users. This involved observing users' interactions with the website and collecting real-time feedback on its structure and organization. The insights gathered from this testing informed the restructuring and refinement of the information architecture to better align with user expectations and mental models.

To optimize the website's structure and hierarchy, I conducted card sorting exercises. This involved having users categorize and organize content cards based on their understanding and preferences. The results of these exercises helped in creating a comprehensive site map that visualized the improved structure and flow of the website.

Using the insights gathered from the research phase, I created mid-fidelity wireframes to establish the overall layout and interaction flow of the website. These wireframes were subjected to iterative testing and refinements, incorporating user feedback and insights from stakeholders. The iterative design process allowed for continuous improvement and refinement of the user experience.

As the design progressed, I transformed the wireframes into high-fidelity mockups, adding visual details, graphics, and interactive elements. The high-fidelity mockups brought the design concept to life and provided a clear representation of the final product. To maintain consistency across the website, I created a style guide that outlined the design system, including color palette, typography, iconography, and other visual elements. The style guide ensured a cohesive and visually appealing user interface.

Throughout the design process, I conducted user testing and gathered feedback to validate the effectiveness of the redesign. This involved usability testing, A/B testing, and gathering qualitative feedback from users. The iterative design approach and user-centric testing helped identify areas for improvement and ensured that the final design met the needs and expectations of the website's users.

As a UX designer, my contributions to the safe travels program website redesign encompassed a wide range of activities, including heuristic evaluations, redline annotations, guerilla testing, information architecture refinement, card sorting, site mapping, wireframing, high-fidelity mockup creation, and style guide development. Each step in the design process aimed to enhance the user experience and address the pain points identified during research. The collaborative efforts, iterative design approach, and user feedback played a crucial role in creating a successful redesign that improved the website's usability, navigation, and overall aesthetics. The comprehensive testing and evaluation validated the positive impact of the redesign, ensuring that the website effectively supports the safe travels program and