The Brief
Fōkcus assesses entrepreneurs and intelligently matches them with business mentors and curriculums. The company has over 300 ventures and 400 mentors in their network. Apple is one of the companies that helps Fōkcus launch live events in various cities, providing Fōkcus with mentors for startups. Hailing from San Diego, Fōkcus has been operating out of San Diego since August 2016, and now need a web application to compliment their events.
Fōkcus is a professional mentorship for entrepreneurs. They help new startups by providing curated resources and mentorships from companies like Apple and Google.
Our Goals
Our goal is to help integrated features work together cohesively, and ultimately help entrepreneurs by providing additional resources such as networking events, mentorships and other useful tools. Our team focused on web applications and branding. We aimed to create a product that adequately helps mentors and mentees connect with each other and create a community of entrepreneurs and support for them.
Project Scope
To create a service redesign and web application design that streamlines the experience of mentees and mentors through integrated features that compliment the city launch sessions and events.
THE PROBLEM
We noticed users didn’t understand how to best take advantage of Fōkcus' features; they couldn’t see the benefit of what they were doing compared to what they expected. Users needed more context on the timeline and next steps, as well as more guidelines. Some users have mentioned they liked how Fōkcus is not as rigid as some traditional mentorships can be, but it still needed more structure.
THE SOLUTION
Improve the web app by better integrating the app's features, such as profiles, events, messaging and curriculums, and ensuring the features all work together in a cohesive manner.
The Process
Team: Pauline S McNaughton, Abraham Abbas & Lauren Torres
My Role: Head of UI & Visual Design, Head of High fidelity Wireframes & Prototype, and an Assistant Project Manager. Also worked on User Research & Interviews, Persona, Service Blueprint, Affinity Mapping, Wire Flows, User Flows, and Usability Testing.
Tools: Abode XD, Adobe Illustrator, Adobe Photoshop, Sketch, Google Suite & Keynote
Platform: Web App
Timeline: Week 1 User research; Week 2 Design wireframes and prototyping; Week 3 Usability testing and iterations.
RESEARCH
- Product Research
- User Interviews
- Current User Flow
- Comparative & Competitive Analysis
- Synthesis (Affinity Map)
- Service Blueprint
- Problem Statement & User Persona
- MVP
- Feature Prioritization
- Information Architecture
- Site Map
Product Research
We wanted to better understand the product and hear from the CEO and users. We performed a contextual inquiry at USC and the Apple Store in San Diego. The meeting helped us understand every step of the Fōkcus process. We got the opportunity to see what kind of entrepreneurs were selected and what Fōkcus values as a company. This gave us insight into the product, what its future goals are, and what is required to meet those goals.
User Interviews
For the interviews, we were looking for a more detailed understanding of Fōkcus' service and we wanted to identify more pain points from both mentees and mentors. Through speaking with users, we learned how the Fōkcus team works with users. We found that the mentorship process could be improved by creating a more organized structure.
Current User Flow
We made a current user flow to visualize the process that users go through. We noticed that the flow had several tangents: some steps were skipped, coordinating for those events were confusing, and it was a slow and long process. We wanted to fix all these issues, so the Fōkcus team could improve user experience.
Comparative & Competitive Analysis
We conducted a C&C analysis to evaluate Fōkcus' competitors. This illustrated what they each have to offer and what Fōkcus can improve upon based on the differences.
Fōkcus and its competitors share many similar features. We believed that we could make a web app that can help entrepreneurs get the best possible service and mentorships.
Synthesis
We collected data from user interviews and through a contextual inquiry. From the research we produced an affinity map to identify trends we were noticing across the board.
Service Blueprint, User Persona & Problem Statement
We created a service blueprint to help us map out the process, giving us a better idea of the different possible touch points for the web app. The process was organized in a clear and digestible way with concrete steps for our users to follow and for us to know exactly what is being offered to the users.
Based on user interviews, our contextual inquiry, and quantitative data from past mentees and mentors, we created a persona, Niha. Like all entrepreneurs, Niha wants her startup to be successful with a well-rounded network and resources. Niha is confused with all the things she needs to do for her startup. How might we help Niha get connected with someone she can trust to help grow her company?
MVP
We came up with a list of important features to include for the app, or the Minimum Viable Products. The following features will help facilitate and strengthen mentorships:
- About Fōkcus page
- Profile
- Messaging
- Events
- Curriculum/Resources
Feature Prioritization
The list of potential features were prioritized according to user needs.
- Sign in/Sign up
- Progress bar
- Profile Editing
- Search bar
- Event information
- 1-on-1 messaging
- News and updates
- Business card design
- Dashboard
- Roadmap
Information Architecture
Site Map
We created a site map to understand the information architecture and how we want our information organized for the web app. This helped define the hierarchy of the web app's flow. The information architecture led to designing wireframes.
SKETCH & DESIGN
- Studio Design
- Low-Fidelity Wireframe
- Medium-Fidelity Wireframe
- High Fidelity Wireframes
- Wire flows
Before implementing any technical designs, we had a Studio Design period for our team to figure out what we can do to help design a product that is well integrated with all the features we have for Fokcus. From that we made low-fidelity to medium-fidelity wireframes. After some usability testing from users, I produced high-fidelity wireframes and prototype designs.
Low Fidelity Wireframe
Studio Design
Medium Fidelity Wireframe
High Fidelity Wireframes
Wire Flows
After finishing the High Fidelity design, I constructed multiple wire flows based on the task scenarios we have given to users to test.
We were able to learn whether these integrated ideas are fluid and work as expected.
check out other wire flow examples
PROTOTYPE
USABILITY TESTING
The plan was to test users through a few scenarios on the web app. These flows allow us to identify the issues that might need fixing.
- We found several problems for our users, they had trouble signing up due to a long sign up process.
- Users felt the term "Curriculum" sounded too much like school work. This didn't make sense to users, causing some to think of Fōkcus as a school mentor site and not a professional one.
ITERATION
After testing the usability of our Fōkcus prototype, we made some changes based on user reactions to certain placements of the features. Our team decided to move certain tabs around, cutting steps to shorten the process, and changing the navigation bar name to help users find their way through Fōkcus. The response after the iteration from users confirmed that the changes made a big difference and helped improve user flow on the web app.
- 100% of our app testers were able to navigate our prototype and complete the tasks without fail
- 100% of our app testers preferred the changes we made to Fōkcus
NEXT STEPS
We know that users enjoyed Fōkcus' new web app. However, the next step is to help not only the users but to improve the overall performance of the product by adding features where users can:
- Invite others
- Mentors Log in sections
- Check homework from the Fōkcus team
- Video chat in app
- Access more resources for the mentees, such as recorded sessions, video guides and, more documents relevant for business owners
What we learned from this project is that we wanted to build a web app that is robust for all users and great application platform for their startup.
“Design creates stories, and stories create memorable experiences, and great experiences have this innate ability to change the way in which we view our world.”
