📱 Mobile Design 🖱 Web Design 👆 Interaction Design
Modernising the web experience for Singapore Heart Foundation ❤️
The largest local heart foundation in my country, Singapore Heart Foundation (SHF), required an update to their existing web infrastructure to showcase their initiatives.
Singapore Heart Foundation (SHF), the country’s largest local heart foundation, required an update to their website to better showcase their initiatives.
Working with my lead, we took apart the existing site IA structure and redesigned each page. I owned the project, presenting findings and recommendations directly to the client. To meet a tight deadline, I integrated feedback and insights directly into high-fidelity designs rather than working through wireframes.
Note: The website has since been updated. This case study reflects the work completed during our project.
YEAR
2018 (3 months)
MY ROLE
UI/UX Designer
Design Audit
Competitors Research
Wireframing (UX)
Prototyping
Set new look and feel tone
Website & Mobile (UI)
Managing content system Wordpress PHP
Main Goals
01 Make it accessible
The old website had hidden links and duplicated content, which often sent users to pages overloaded with details. It wasn’t optimized for mobile, even though 65% of visitors were on mobile devices.
02 Automate process
Life-saving initiatives like workshops and learning sessions were managed manually on the client side. Our solution needed to provide clear information to users and automate the sign-up process on the backend.
03 Improve Usability
Usability testing showed that reaching key tasks took more than five clicks. The average task completion time was well over 5 minutes, which often led to abandonment. While traffic was high, user engagement and conversions were lost due to these friction points.
A smarter landing page
Context is key when presenting a lot of information. We started with a featured carousel to highlight who SHF is and their latest events upfront.
Further down the page, we included sections for workshops, videos, and recipes. These used cards with images, text, and clear calls to action, allowing the team to set context. We focused on what was important for users to see and what they should care about first. This helped establish the tone for the rest of the experience.
Solution
The refresh reduced hidden content and links while maintaining SEO performance and improving the user experience. The site was designed and built for both desktop and mobile, allowing relevant content to be highlighted across pages, including the homepage for the target audience.
