Ozark Literacy Council Website Redesign
Embedded Files
Project Overview
Make it possible for students to connect with a tutor through the non-profit organization's website.
Role & Responsibilities
Role & Responsibilities
Sole UX/UI designer redesigning the website from conception to delivery
Tools
Tools
Figma, FigJam, Zoom, Google Drive
Project Duration
Project Duration
Part-time 3 weeks
February 2022-March 2022
Goals
Improve the landing page of the site, primary navigation and provide a way for users to find a tutor online.
Problem Statement
Problem Statement
Addy, a recent immigrant to the United States, needs an easier way to access a tutor so that she can improve her English and confidently live a better life.
User Centered Design Process
User Centered Design Process
Empathize Define Ideate Prototype Test
Empathize / Research
User Research
User Research
User Interviews
I completed user interviews to learn more about how people learn English.
Usability Test
I ran usability tests on the original site to find out what issues users had when interacting with it.
Competitor Analysis
To gain ideas for redesigning the site, I look at what strengths OLC's competitors have.
Research Findings
Research Findings
The four following takeaways was uncovered by user interviews and usability tests.
01
Speaking
Each Person found it important to practice speaking outside of class.
02
Tutor
The tutor plays an important role in practicing English.
03
Class Schedule
On the present site, finding class information is difficult.
04
Find A Tutor
There’s no way to find a tutor on the current site.
Define
User Persona
I created a user persona based on the research findings to better understand the needs and motivations of users.
User Journey Map
To visually represent the website's user flow. I developed the user journey map.
Ideate
Affinity Process
I used affinity mapping, I like I wish what if method and prioritization matrix to analyze the research data and came to the conclusion that our website should include a feature that allows students to find a tutor online.
Design
Sketches
To get the better result, I drew four different versions of the homepage and then chose one to use for the digital wireframe.
Homepage V1
Homepage V2
Homepage V3
Homepage V4
Design Iterations
Following the formation of the first digital wireframe, I continue to iterate in order to make it both user and visually friendly.
Final Design
I continue to iterate based on the following feedback I've received from my peers and instructor:
Crammed nav bar
The use of circles does not match the overall design style
The hero image may not be appropriate for the brand
Card tiles jammed together
Test
Prototype
Takeaways
What I've Learned
Keep user and the brand in mind and make sure every iterations are meeting their needs, not just the design
In attempt to make it both beautiful and functional, I got stuck on the color palette and layout. And I learned that using A/B Testing to figure it out is a great approach.
Future Opportunities
Create dropdown menus to add & organize content
Improve the site's copy & Images
Thank You!
Thank You!
Your Feedback is Welcome
Let’s Connect
EmaiL: bingbingy955@gmail.com
LinkedIn: linkedin.com/in/bingbing-yang-28a618232
Page updated
Google Sites
Report abuse