HUOA
Redesign the HUOA webpage to increase engagement and value.
Overview
The Hawaii United Okinawa Association is a non-profit organization with a mission to promote, perpetuate and preserve Okinawan culture. HUOA wants to redesign their webpage to increase engagement and value. They want the HUOA.org website to be the primary source and hub for all of their communication channels (email, print, social media, word-of-mouth, etc.) to link back to the most accurate and current information. On February 2020, I joined their UX/UI team to redesign the HUOA website. I partnered with another UX designer to complete the information architecture and create low-fidelity wireframes of the entire website.
TIMELINE
4 Months
TOOLS
Figma
Whimsical
MY ROLE
Information Architecture, Wireframes, and solely presented the entire clickable prototype to the clients and the Dev team.
Why?
In this fast-paced and tech oriented generation, cultures and traditions face increasing threat of becoming forgotten. We can use technology as a vital tool in preserving culture and in engaging all generations while seeking new opportunities in facilitating an enhanced discovery process by redesigning the HUOA website. The ultimate Goal of HUOA is to spread awareness of the Okinawa culture and heritage globally.
HOW?
The overall goal of this project is to redesign the website. More specifically, the website needed changes to:
Existing homepage
Research
The current HUOA site is visually unappealing, busy, and outdated so we looked at a few nonprofit sites for inspiration before moving to the designing stage. The simplistic navigation and sub menu format of JCCH and the MACC webpage, the fun and cheerful tone from the Art of Elysium site, along with the footer content structure of the Malala Fund provides a good basis for the direction needed for the HUOA website upgrade.
HEURISTIC ANALYSIS
Just by looking at the website, it was obvious that there were many usability errors. In order to categorize the errors, we conducted a heuristic analysis using Nielsen’s 10 Usability Heuristics.
Most common usability violations found were:
Minimalistic and Aesthetic Design: Multiple instances of misaligned text, awkward spacing, and too much content on individual pages.
Consistency and Standards: The content had inconsistent font styles and sizes.
Match Between System and Real World: The “tier system” which is used to organize search results is not intuitive.
CARD SORTING
The open card sorting method helped us understand users’ mental model and to decide on a simple page hierarchy.
Existing sitemap
Based on our research we discovered the 3 most important criteria users look for when visiting HUOA webpage:
Proposed sitemap
Redesigned the site map for a better intuitive experience. We iterated on this based on feedback we got from our client and the research team.
Wireframe iterations
Final design solution
Getting closer to reality
INTERACTION DESIGN
After I presented mid-fidelity, I animated the prototype so that it was a closer reflection of how our users would be interacting with the website.
CLEAR CTA
Donation process
Proper donation button on the header makes it easier for people to navigate, which will also encourage more users to make donation for the organization.
DROPDOWN FILTER
Join the HUOA member’s club
Classification of over 50 clubs allows for efficient search results.
GET INVOLVED IN THE COMMUNITY
Online volunteer application
Online application form will be a simple and effective solution for more people to get involved and help the organization grow bigger.
Final Thoughts
I truly enjoyed working on this project since it was a non-profit and I felt like this was my little contribution to support the legacy of Japanese Okinawan culture. This project was also an opportunity for me to put my educational knowledge to test with a real world establishment while also remotely collaborating with experienced UX designers and clients.
Initially, this project was to be managed between 2 UX Designers (including myself) where we work on the information architecture and complete low-fi design. Mid-way through the project, the other designer resigned so I used this challenge to take fully ownership of the project with the right guidance from the Project Manager/Team Lead. I feel a lot stronger and more confident in being able to exercise my skills after this experience and hope to support many more projects like this in the future.