Glaucoma Website
Built a fully responsive and accessible website with HTML, CSS, and JavaScript, implementing WCAG standards to ensure a seamless experience across devices and compatibility with assistive technologies.
Impact:
Achieved a 95% improvement in accessibility scores (WCAG compliance) and enhanced overall usability for users with glaucoma. User testing revealed 87% found the new layout easier to read and navigate.
KEY FEATURES
Accessible Design: Adjustable contrast, colour schemes, and text size for visual impairments.
Educational Resources: Comprehensive details on glaucoma types, treatments, and patient testimonies.
Interactive Learning: A "Card Challenge" game that simulates the experience of glaucoma.
Research
Analysed existing glaucoma websites: 77% charity-focused with minimal medical details.
No simulation or patient perspective insights.
Findings
Users with glaucoma benefit from high contrast, muted tones, and simplified navigation.
Target Users
Individuals seeking information about glaucoma, including patients, caregivers, and advocates.
Wireframes & Hi-Fi Prototypes
Developed using Figma with a focus on accessibility and visual hierarchy.
Interactive Game: The "Card Challenge" allows users to experience glaucoma’s visual impact by matching cards through simulated vision impairments
Information Architecture:
Streamlined navigation for intuitive access.
Structured menus and call-to-action buttons guide users through key resources.
Accessibility Bar: Features customisable contrast settings and text size adjustments, adhering to W3C guidelines.
Logo Design:
The logo reflects the website’s identity: the letter "O" in "Glaucoma" was replaced with an eye symbol, creating a visual connection to the site’s mission. A shortened version of the logo, a stylised eye, was also designed, following the website’s colour contrast standards.
Color Palette:
The color palette was chosen to evoke trust and reflect medical expertise. Colors were rigorously tested to meet W3C accessibility standards, ensuring clarity for users with visual impairments.
Delivered a website that: - Educates users with an accessible, visually engaging design. - Raises awareness through interactive simulations. - Supports inclusivity with accessibility-first features.
