I was given a design challenge by Google to design an experience for college students that allows new students to ask questions about school life, and experienced students to share answers and advice.
After the research and ideation process, I envisioned Lookout.
Lookout is a social networking app that allows users to explore, collaborate, and look out for one another at their school.
OVERVIEW
DURATION
7 Days
(Feb 2021)
ROLE
UX/UI Researcher & Designer
TOOLS
Figma
Miro
Whimsical
KEY SKILLS
User Research
Concept Ideation
Prototyping
Information Architecture
PROBLEM
With problem in mind, I proceeded to conduct research via:
Students, especially freshmen, can feel intimidated by their college environments due to a variety of reasons. Moreover, remote learning (due to COVID-19) exacerbates these conditions which affects the majority of college students around the world, making it harder for them to transition to college, seek guidance and socialize. I want to design a solution that can help them build a stronger sense of community to help alleviate these challenges and improve their college experiences through a more inclusive, and collaborative way, so I came up with the problem statement:
HMW help college students build an inclusive community, so that they can support and collaborate with one another, ultimately improving their college experience?
KEY RESEARCH INSIGHTS
Literature Review
Validation: Many studies and articles have suggested that college students are struggling with various challenges, from mental health to navigating college resources. And with the current pandemic, it has only exacerbated the conditions.
Competitor Analysis
Validation: I analyzed existing socializing platforms like Facebook, Twitter, LinkedIn, and Reddit, and summarized their strengths and weaknesses from the perspectives of college students. Overall, there isn’t really a centralized platform for college students and platforms do not necessarily have the resources for students’ needs.
Survey
Validation: I was able to utilize Google Forms to gather data from my institution (University of Washington, Seattle Campus) about students' previous and current experiences at college. Overall, the majority of the students at my institution struggled with lots of challenges and wished they had more support in those areas.
SOLUTION APPROACH
1. PERSONAS
Consolidated key insights into 2 personas to better understand user needs before moving on to concept ideation.
2. CONCEPT IDEATION
After brainstorming, I decided to design an all-in-one forum-based platform that allows students to socialize, get guidance, create communities, collaborate, and allocate resources with one another within the institution throughout their college careers.
3. FLOWCHART
I then created the basic user flow and features of the brainstormed app before diving deep into designing wireframes in the next section.
LOW FIDELITY WIREFRAMES
I started by creating low fidelity wireframes for core feature screens via Whimsical.
I then created branding for the application before designing high fidelity wireframes.
HIGH FIDELITY FEATURES
These are the Login/Sign-up and FTUE wireframes. Users will have to login/sign up using their college credentials in order to use this service. After the user has verified their identity, the user will then need to go over some instructions, fill out information, and add personal interests for app personalization.
These are the Home feed & Creating a New Post wireframes. It lets users browse through posts from people or communities they follow, or explore trending posts on the application. They can perform actions such as liking, commenting, sharing and more (the 3 dots) on each post . They can also create their own posts, decide what and where to post, along with the option to post anonymously. Post tags serves as an easy identifier for post categorization.
These are the Explore & Creating a New Community wireframes. Users can find and join communities within their institutions by first browsing through categories and then through the list of the available communities. They can look into each individual communities and join ones they are interested in. Once joined a community, the user is allowed to create posts within the community.
These are the Messaging & User Profile wireframes. The messaging feature provides an additional way for users to communicate and collaborate with one another. Users may create group chats or send private messages to others using the application.
These are the Notifications, Directory & Menu wireframes. The notifications shows all activities happening around the user, with an exception for message notifications, which will indicate on messaging icon on top right instead. The directory organizes the institution’s resources and serves to provide easier, faster accessibility to students. The menu feature allows users to perform a variety of actions, including viewing own profile, settings, logging out and more.
USE CASES
Use Case 1: Creating a Post
John Appleseed (persona 1) wants to learn some tips and tricks about college as well as learning about the HCI major at his college. However, he wants to ask the general public and doesn’t want to be known. In the video, it shows how John utilized the anonymous posting feature as well as adding tags to his post.
Use Case 2: Creating a Community
Colton Murillo (persona 2) is passionate about helping others with similar backgrounds. he wants to create a community for First Generation College Students (FGCS) at the school. In the video, it shows how Colton is able to seamlessly create a community on the platform.
RETROSPECTIVE
Reflection
What Went Well: Building from previous experiences with UX design, I was able to establish a timeline and follow through with most of the steps pretty efficiently. Being able to utilize skill sets and experiences gained from courseworks and projects definitely provided a strong foundation and has helped me become more confident and efficient when designing.
What I Would’ve Done Differently
Better Time Management: Even though I had a roadmap planned out, I wasn’t quite able to fit in everything within the 7 day challenge duration because I had to spend time on other things such as school assignments and work. And because of that, I spent very little time conducting usability testing on the low-fidelity wireframes with a few participants in order for me to have enough time to finish the challenge on time. Usability testing is a crucial part of a product’s development in order for us designers to understand others’ perspectives and design better solutions, and so if I had more time I would’ve conducted better/in-depth usability testing with more testers. In the future, I hope to improve my time management abilities and deliver a more optimal solution.
