📱 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.

The main goal was to enhance their existing web information architecture and present their initiatives upfront. Working alongside my lead, we took apart the website architecture and redesigned the website page by page.

I took ownership of this project and presented suggestions or findings to the client. To answer the tight deadline, I decided to incorporate the feedback and insights gathered into the high-fidelity design rather than wireframes.

2022 Edit: SHF has since then completely changed direction.

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 led users to pages that overwhelmed them with excessive details. The site was not catered for mobile view even though majority 65% are mobile users. 

02 Automate process

Life-saving initiatives include learning sessions or workshops are managed on the client's end. It was crucial that our solution could help provide information to the user and also automate the sign-up process for the backend. 

03 Improve Usability 

Usability findings reveal that it took more than 5 clicks to reach the objective of the user and the average time taken to complete a task was well over 5 minutes before abandonment. Although many users were visiting the site, many user engagements were lost due to this experience.

A smarter landing page

Context is everything when trying to present a lot of information. We decided to start it off with a featured carousel section that showcased who SHF was and their latest events upfront.

Further down the fold, there would be sections that included their workshops, videos and recipes. This involved cards with images, texts and call-to-action that allow the team to set the context. What is important to the feature today? What should users care about? This would help set the tone for the rest of the user experience. 

SHF Wireframes

Solution

A new site refresh reduced the amount of hidden content and links while maintaining SEO performance and enhancing user experience. With the new visual, the site was developed and built from both desktop and mobile perspectives. This helped to feature relevant content on various pages, including the targeted audience's homepage. 

View