The Hoa Mai Bilingual Preschool is the first Vietnamese-English dual-language child development center in the Northwest. Nested in South Seattle, Hoa Mai is at the core of the Vietnamese community and is a considerable influence in helping young kids learn Vietnamese tradition and culture.
UX Design
Client Sponsored
In recent years, Hoa Mai has faced challenges due to the pandemic, safety concerns in the neighborhood, and resource constraints. Their website, managed by the Executive Director overseeing multiple programs, has taken a backseat in terms of priorities and has been neglected due to time, budget, and expertise limitations.
As Hoa Mai strives to create classroom environments reminiscent of home, families should feel a strong sense of belonging and experience affirmation of their identities and cultural ways of being.
Most of all, Hoa Mai preschool is a nonprofit organization, and its mission is to empower the Vietnamese community to succeed while bridging, preserving, and promoting cultural heritage.
After meeting with our clients and discussing both expectations and constraints, we have defined specific goals and metrics and set out the following strategic objectives:
To assess the current website, we used 4 research methods to identify existing issues, pain points, and user goals.
Understand high-level visitor demographics and how they’re currently using the site.
Identify the current navigation issues and explore how we might improve the sitemap.
Analyze similar websites to identify key issues and distinguishing their similarities and differences.
Get insight into the website's overall experience, where it has strengths, and where it falls short.
Based on the user research we defined 3 main user groups that uses the websites and I was able to build the user personas. I then referred to them throughout the entire website design process. The three key user groups are:
Based on the user personas, we then were able to define the key actions and create the task matrix for each user group.
To address the first design challenge about creating a clearer navigation. We designed a card sorting exercise and had 11 users participated. At the end, a total of 9 navigation clusters were created.
Based on the card sorting exercise results, a new website information architecture was created.
To address the second design challenge about identifying and clearly presenting key information, I sketched and created wireframes of all the website pages and handed over to our developer to build a mid-fidelity prototype.
With the mid-fidelity prototype,I went to Hoa Mai with two of my team members to run the usability testings and gained some useful insights.
To address the third design challenge about providing consistent page layouts and a welcoming & trustworthy branding, I defined 4 brand tenants to guide my visual design for the website.
I selected fonts that have a smooth structure. Work Sans makes the content readable, and Nunito provides a feeling of warmth. I also made sure both fonts support Vietnamese language because the website dose have a large international audience from China and Vietnam.
I also made a design style guide includes all the color selections, logo and the different image ratios so that they could be developed by engineers and reused by future designers.
I selected a few pages to show the details of the design changes.
Here are an overview of the rest of the website pages:
