Responsive Web Design & Visual Design for Medical Researcher, Favorite Iradukunda

Dr. Favorite Iradukunda, an Assistant Professor and medical researcher at Amherst College, specializes in healthcare research and needed an online platform to disseminate her findings effectively. Her mission is to enhance healthcare communication through comprehensive and qualitative research.

Responsive Web Design & Visual Design for Medical Research

Lead UX/UI Designer and Graphic Designer. Responsibilities included managing the full design lifecycle, from user research and information architecture to visual design and usability testing.
Client
Amherst University
Date
2023
Role
Lead UX/UI Designer, AI Artist
The Design Process
Understanding The Challenge
Research
Interviews
Empathy Maps
User Personas
Competitive Analysis
Accessibility Compliance  
Ideation & Lo-fi Design
Paper Sketching
User Flows
Information Architecture
Paper Wireframes & Testing
Hi-fi Design
Visual Design
Interaction Design
Motion Design
Evaluation & Iteration
Figma Prototype
Collaboration Boards
Testing
Last UI Changes 
Documentation
Bussiness Challenge
The client lacked a well-organized, visually engaging online presence. Existing visual branding and image assets were insufficient, and complex CMS interfaces were not suitable given the client's busy schedule.
Pain points
Users found it difficult to navigate the information, and the current design did not engage them effectively due to poor visual storytelling.
goals & objectives
- Create a responsive website that enhances visual storytelling through generative AI

- Improve the organization and navigability of site content  

- Develop an intuitive CMS tool for easy content management
Parameters

Usability Study

Study Type
Unmoderated usability study
Location
United States, Remote
Participants
5 Participants
Lenght
20 to 30 min
Key Findings About Users and Their Needs
- Users need quick access to research findings  

- Prefer visually appealing and easy-to-navigate interfaces  

- Desire for accessibility features, such as text size adjustments and simplified navigation
User Personas
- Persona 1: Olivia, a healthcare professional seeking research updates

- Persona 2: James, a student looking for academic resources
User Journey Maps
Key touch points included homepage visit, research content browsing, and resource downloads.

Pain points were identified in navigating large datasets and complex content.
Information architecture
Data Audit and Content Inventory: Conducted a thorough audit of existing research data and content, categorizing it for relevance and usability.
Data Hierarchy and Organization: Structured data into clear, accessible categories, ensuring a logical flow of information. Main sections included Research, Publications, and Resources.
Wireframes and Low-Fidelity Prototypes: Created wireframes to visualize layout and user flow, focusing on intuitive navigation and content organization. Low-fidelity prototypes tested to ensure basic functionality and usability.
Visual Design
Color Palette and Typography: Chose a soothing color palette (blues and greens) and professional typography (serif fonts for headings and sans-serif for body text) to enhance readability and visual appeal.
Layout Options:
Considered multiple layout options focusing on ease of navigation. Final layout featured a clean design with intuitive menus and clear categorization of content.

Final Solution

Overview of Final Design: The final website design is a responsive, user-friendly platform featuring generative AI for visual storytelling, intuitive navigation, and accessible content.

Key Features and Functionality: Main features include a dynamic homepage, categorized research sections, interactive data visualizations, and an easy-to-use CMS.

Implementation and Rollout: The website was implemented using a phased approach, with stakeholder reviews and iterative improvements based on user feedback ensuring a smooth rollout.

Results & Impact

Metrics and KPIs
Key metrics included user engagement rates, content discoverability, and feedback on usability.
User Feedback
Users reported a significant improvement in navigation and engagement, praising the visual storytelling and accessibility features.
Business Outcomes
Successfully met the client's needs, improving user satisfaction and engagement with the research content, and enabling easier content management for the client.

Lessons Learned

Challenges Faced and How They Were Overcome:
Encountered challenges with initial user adoption of the new CMS; overcame them through additional user training and iterative design enhancements.
Key Takeaways:
The importance of iterative feedback in UX design and the significant role of accessibility in enhancing overall user experience.
Future Improvements and Next Steps:
Potential future improvements include integrating more AI-driven personalization features and expanding accessibility options.

Conclusion

Project Achievements

Successfully designed and implemented a responsive, visually engaging, and accessible website that enhanced user experience and content management.

What I Learned

The project enhanced my skills in visual design, generative AI applications, UI design, and improved my understanding of accessibility principles. It also reinforced the importance of user-centric design and continuous feedback in creating impactful digital solutions.