EDUCATION
2 weeks
METHODS USED
User Interviews, Heuristic Evaluation, Competitor Analysis, Prototyping, Illustration, Animation, User Journey Mapping
The Overview
This was the second project I had completed within the UC Berkeley UI/UX Bootcamp. For this project, our instructors had tasked each team to partner with a non-profit and assist with redesigning a website. Our team got in contact with LISA Academy, a non-profit based in Arkansas, who allowed us to redesign their website.
I participated in the full process: from conducting user interviews, drafting ideas, to designing the desktop and mobile hi-fi prototypes.
Beginning the project
On the first week of the project, our team got into contact with our stakeholder, the Director of the IT Department at LISA Academy. He told us that they had no specific requirements in mind. This lead to a team brainstorm about what the best pages to redesign were, as we only had three weeks to complete a redesign from lo-fi to hi-fi.
A video of the previous site that we were redesigning (2023)
Our team concluded that redesigning the Contact, About Us, and Homepage would be most beneficial, as most families would visit these three pages the most in order to learn more about the school. Having decided this, we conducted user interviews to see what people thought about the original LISA Academy pages for these sections, and created our user persona Margaret Martin.
Competitor Analysis
After determining our user persona, we perused other educational sites with one question:
What would Margaret think?
We wanted to keep Margaret happy, to be able to design a site that would meet all her needs and prevent any pain points in finding information for her children.
Our team referenced other websites for educational services in order to make LISA Academy’s website more sleek and professional, with cleaner formatting and less saturated colors. We then sketched wireframes of what we thought LISA Academy should look like, and made them into low-fidelity wireframes. We especially wanted the news and events section to be nearer to the top of the homepage, as parents would most likely want to see this section when visiting the site.
The Overall Flow
After taking notes on competitors, we created user flows, mapped out the site pages, consolidated our data from the user interviews we conducted. This allowed us to begin our sketching and rough ideations, from which we iterated and revised upon as a team. We ended up with six desktop screens and six mobile screens, prototyped and ready to present.
A part of the intro flow to the app.
Conclusions
I learned a lot about collaborating with a team and coordinating with a stakeholder during this project. While our stakeholder did not have many requests or expectations, we still provided a timeline for updates and kept in contact with the stakeholder. Ultimately, our design was never implemented as we did not know how to code, but it was a valuable experience nonetheless.
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 112 120" xmlns="http://www.w3.org/2000/svg"><path d="M 61.5 13.5 L 0 13.5 M 12.5 0 L 0 13.5 L 12.5 27" fill="transparent" height="27px" id="BBn2IMvOT" stroke-dasharray="0" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" stroke="rgb(196, 123, 122)" transform="translate(25 41) rotate(90 30.75 13.5)" width="61.5px"/></svg>)