Figma
One month contract (5 weeks)
Comparative Analysis, Synthesis, Prototyping, Empathy Mapping
(Solo) Research, Design, User Testing
In a month-long final project for my product design studio class at the Berkeley School of Information, I partnered with Central Valley Scholars and worked as the solo UX designer and researcher to help redesign their resources page, a hub for academic support and opportunities that they and their partners have to offer.
Educational resources and scholarship programs aid students in attaining higher education and beyond. Such programs and resources play a critical role in the education and success of students, however, in the Central Valley there is a lack of knowledge being passed down to students accessibly. Central Valley Scholars is a non-profit organization that aims to assist historically underserved students in the Central Valley to attain access to higher education. They provide a variety of free college workshops, mentorship programs, research programs, and scholarships - all under a safe and welcoming environment for all students.
UX research, product design, user testing/validation
While initially meeting with my client, we discussed the resources page in its original form. While this seems like a functional resources page, upon using the site for myself, I ran into some problems that called for a more streamlined experience. Once I had finished conducting an audit of the existing page, I synthesized my findings into three main pain points that would help me define my design goal:
SEARCH There isn’t an adequate search system on their current site. The search bar on the resource page is sitewide.
VISUAL Missing visual cues to direct users. Resources are not organized in an attention-grabbing way.
ORGANIZATION The resource page in its current form lacks organization. Resources would be piled on top of each other as they are added.
With the aforementioned pain points in mind, I identified a design goal that would help address a problem statement of how the Central Valley Scholars page might be altered to increase usability and functionality. My primary goal was to design a new and easy-to-use system that offers a personalized experience for those seeking the resources Central Valley Scholars has to offer.
While working with Central Valley scholars, I was working with a few design constraints. Other than the constraint of time, one of the biggest constraints was that I was designing with the limitations of Wix in mind. Because the website was built by my client themselves on Wix, they wanted a design that would easily be transferable to the current site and platform if they were to implement the changes themselves. They wanted a design that was straightforward and easy to understand, yet proposes a solution to the problems at hand.
However, upon further exploration it was apparent that Wix had more limitations than anticipated. Other than the basic layout changes that Wix had to offer, this wasn't enough to implement a substantial solution to the problems with the site without embedding custom code. With this road block in mind, I made the executive decision as a designer to pose a compromise. My proposal was that I design a prototype of a system that addresses the project's goals. Thus, this deliverable would be something that is presentable and ready to hand off to the developers on the team, or future stakeholders.
Given the tight timeline of the project, I first started my research by understanding how other scholarship programs structured their resources pages. In addition to conducting an extensive analysis of existing programs, I took the time to dive deeper into the Central Valley Scholars user base, solidifying my target users and their needs. I would then synthesize my findings to move onto the next stage of my design process.
My plan for research started by conducting an analysis of existing scholarship programs. I encountered two similar programs, both of which were based in the Central Valley with a similar mission to CVS. I ran through both experiences and analyzed these platforms as a whole and also looked at them against my defined pain points for the Central Valley Scholars’ current resource page.
In my analysis, I found that these programs strongly favored organization. Even though both platforms had a different way of structuring their pages, it seems they were thoughtful in how they wanted their users to interact with their resources pages, For example, one site assigned all their resources to a "resource type/topic". Their users would then have the option of filtering their searches according to these topics. While using this for myself, I found that I was able to narrow down my searches more efficiently.
Opportunity for Central Valley Scholars: Since a lot of the CVS resources fall into different categories themselves, their page could benefit from the use of a filtering system by relevant metadata to help their users more effectively get to whatever need in less steps.
I divided my target users into two groups according to the frequency of use for the site. The primary target users are middle and high school students who typically come from low-income and underserved communities in the central valley. Other users to keep in mind were donors and advisors who visit the page hoping to either sponsor the program or pass along academic resources to students.
So with my target users in mind, I conducted semi-structured interviews with four students from the Central Valley who have attended CVS events and workshops in the past.
How do students navigate higher education scholarship programs and the resources they offer? (How do they navigate existing sites to find different resources that fit their individual needs?)
What makes existing scholarship programs (such as CVS) attractive to students? Why?
For each participant, once I was done interviewing and gathering their input, I created empathy maps to help articulate their needs and aid my decision-making process. This helped me efficiently organize my findings to draw upon later in the design process.
“I like that CVS has all of their links on one page”
“I need a site that’s easy for me to find everything I need”
"I couldn't find the LGBTQ+ scholarship because it wasn't listed in the LGBTQ+ tab"
"I don't know how to use this search bar"
“It’s nice to see people like me on the cover of this page”
“It would be nice if I can find opportunities specifically for Latinx students to find community”
Develop features that increase personalization, allowing users to gain full reign of their experience on the Central Valley Scholars resource page
Users felt the current resources page was superfluous, having to scroll through each sub category to find a specific resource
Users felt frustrated having to use their web browser's back button to navigate back between the different resource types
After taking into consideration the interviews I conducted and the key needs that I identified, I was able to create 3 distinct personas that encompass a variety of site uses and personalities.
Now, since I was designing a new system for my client to present to developers and future stakeholders, I created these personas to help demonstrate realistic representations of the Central Valley Scholars user base for reference.
.png)
.png)
.png)
After synthesizing the insights gained from user interviews and adjacency analysis of similar programs, I went on to free brainstorming and made some low-fidelity sketches to help me understand the structure and visual hierarchy I wanted to pursue as well as elements I thought would make this page more practical.
I used my interviews to identify common gaps in the user journey, and I used elements from my comparative analysis in my drawings to help visualize the overall experience and check the flow.
Incorporate tags to help filter search results
creating an affordance to sort the resources/search results
have everything in one view to avoid superfluous scrolling
I drew upon my initial sketches to develop a few mid-fidelity screens in which I tested out different layouts and visual hierarchies. Meeting with my classmates and interviewees helped me understand elements of the design that did and didn’t work. Peer feedback and initial usability testing helped me get on track to designing a solution that fit my objective.
Screens were clear and easy to follow along
Enjoyed having an about section at the forefront that explains the resources page - this gives users more context
A mockup of the resources page in which the flow is linear: search and filtering functionality are displayed above resources and results from a search
A mockup of the resources page in which the flow search and filtering functionality are displayed alongside resources and results from a search -- everything is viewable at one glance
After creating my mid-fidelity mockups, I met with my initial interviewees to conduct some usability testing and gain some more feedback on the decisions I’ve made. I found that all users were able to successfully perform at least 2 of the 3 tasks which helped let me know that I was on the right track. Some key features to include were: 1) Reset search button for users to clearly revert the resources page to its initial state and allow them to start their search from scratch and 2) Tags within the resource listings to help define search and inform users what type of resource is displayed
01. Having the search and filtering functionality alongside the results in a fixed position was more successful due to less scrolling — all important information is in one place
02. A few testers confused about resetting the page: didn’t know whether to deselect the tags or look for a reset button
03. Organization: there should be more organization and information within the resource listings themselves
Finally, after meeting with my interviewees and conducting usability tests on my mid-fidelity screens, I used the feedback to incorporate necessary changes to the experience and iterate up to a refined high-fidelity prototype. I sought to respond to the client’s and users’ constraints while keeping the design simple to allow for a smooth and comprehendible transition between prototyping and finalization.
I decided to incorporate the use of tags and metadata to give resource listings specific properties that allow for the search functionality to take place. Tags are color coated based on similarity and subcategories with other resources. In addition, users have full authority over how resources are presented to them — they are able to sort the listings alphabetically or the date they were added, they can select and deselect tags according to their needs, etc.
In the final deliverable, having all the content in one place makes the experience more streamlined. Clear affordances guide users and make the resources page easy to use. Color coordination keeps the page cohesive and consistent.
.gif)
To address one of my earlier pain points, the search functionality would no longer be site-wide and would be limited to the resources database specifically. Users would be allowed to have a personal experience and continue to have control of their experience. With the addition of a reset search & filers button, clearing complex combinations of filters is one click away.
The inclusion of tags that encapsulate different intersections of identities makes the resource page more inclusive and personal for users. Rather than generalized categories, the new designs aim to make users feel represented.
As I reflect on my experience designing for Central Valley Scholars, I’m very appreciative of the opportunity I was given. As a first-generation BIPOC student who was born and raised in the Central Valley, I resonated a lot with the mission statement and business goal of Central Valley scholars. I really wish something like this existed when I was in high school seeking resources for higher education.
This project taught me how to effectively and proactively work under limited time constraints. Because the project was only a month long, there were ideas that had to be chopped and compromises that had to be made. Something that I was unable to get to was designing a mobile-optimized version of the site, as this would help account for users that might not have access to computers at home and rely on their mobile devices. Another thing I hoped to do but wasn't able to get to was conduct qualitative interviews with my secondary target users. This would have helped me identify common gaps in their journey.
Overall, I’m glad I was able to collaborate with Central Valley Scholars on a project that hits so close to home, working as the sole designer and researcher to conduct participatory research and need-find remotely under COVID circumstances. Thank you so much for reading!
