0

%

Top
of Page

Portfolio Home Page

Next Case Study

Bottom
of Page

Sage Advice

Hero image consiting of five phone screen shots.

If you got to create an app to help people during the pandemic, what would you design?

The Challenge

I love learning, but sometimes tutorials can only take you so far. I conceived this app as something I could benefit from because sometimes I need a one-on-one session to improve. During the pandemic, I saw a trend of professional photographers who make a large part of their income from in-person workshops having to cancel their plans and reinvent their business on Zoom. This wasn't just photographers but different industries and different events. This app aims at creating a way for people to learn and also for others to make an income.

Background

Develop a UX case study and prototype for my Senior Capstone Project.

Goals

Create a personal project iOS prototype intime for the show from conception to MVP completion.

Tools

Clickup, Figma, Google Forms, Google Docs, Miro, Maze.co, Procreate

Duration

Ten Weeks

Project Management

man looking at a laptop

Gantt Chart

I used Clickup to manage my time and tasks. During the project proposal, I created a Gantt chart with all the tasks I needed. As the project progressed, I eliminated tasks that were no longer relevant. The Gantt chart was essential to staying on track for my deliverables.

Gantt Chart

Research

Clipboard with a text bubble, pie chart, notes and a sticky note

Swots

I started this journey by using and reading customer reviews for ten mentoring apps from the Apple App Store. The conclusion is no app meets the needs of finding a mentor. This did not take into account other platforms like APDList.

SWOT DiagramSWOT DiagramSWOT Diagram
Piechart of people looking for hobby help.

Do you want help with hobbies?

Piechart of people looking for professional help.

Do you want help with professionals skills?

Survey

The initial SWOT research helped me define the survey questions. The survey revealed favorable results for the idea because the majority of people want this service and would pay for it.

Interviews

With the SWOT and Survey research, I constructed an informal interview, and five interviews were conducted where all participants were in their thirties.  All questions and answers were recorded in Google Word. These interviews gave incredible insight into what the app should be and not be.

InterviewerCouple sharing during interview.

Define

sign that reads this way that way

Affinity Diagram

With the research complete I extracted the findings and organized them into a affinity diagram. Patterns emerged and groups were formed for future reference.

Affinity Diagram
Persona of a young man looking for a mentor.

Personas

Out of three personas, I chose to use Isaiah as he was a mentee looking for a mentor. When creating the MVP and prototypes, I reference Isaiah to keep me on track.

Ideation

Man thinking of lightbulbs

Ecosystem Map

When I got to this stage, I froze but remembered ecosystem maps from Mapping Experiences by Jim Kalbach. I just read the book, and I'm glad I did! This was a good substitute for a sitemap, and it helped me see all the macro interactions.

Ecosystem Map
User Story Map Diagram

User Story Map

Referencing the ecosystem map, I developed user-centric flows for all the interactions I could create. I added more detail to the map over a few weeks due to missed ideas or flawed concepts.

MVP

This step was essential to maintaining my deadline for the capstone show. I wanted to show the app's concept, so everything was split into build now, maybe later, and the last iteration mainly focused on mixed reality concepts.

Most Viable Product Diagram
Pattern Languge Mood Board

Mood Board

Before sketching, I wanted to create a mood board based on a pattern language to guide the sketching process. I'm constantly expanding my design knowledge and now wish I would have done a Stylescape.

Sketches

I almost always use crazy 8 sketches to flush out ideas. It is the quickest way to create concepts that can be further refined. For this project, 10 sets were produced.

crazy eight sketchcrazy eight sketch

Wireframes & Testing

woman confused while looking at a phoneman holding coffee and been surprised

Wireframes

I built the wireframes in Figma with the intention of user-testing them in Maze.co. Eight main wireframes were created and in the future, I should keep my wireframes a bit more simple to speed up prototyping and testing.

WireframeWireframeWireframe
Testing Heat MapTesting Heat MapTesting Heat Map

Testing

With the wireframes built, I brought them into Maze and wrote the test plan. The only problem was that my language needed to be clearer to help the users. In hindsight, a formal user test should have been conducted.

Accessibility

Accessibility Human

Color

I only tested for color blindness, and the colors showed enough contrast, which was great! In the future, I should also test  to ensure it works for a screen reader.

Color blind testColor blind testColor blind test

Hi-Fi & Testing

shiny phone illistration

Figma

I needed to make the prototype scalable so people could test it on any phone size during the capstone show. I found scaling up easy but scaling down difficult, so I should start with the smallest screen in the future. After all the hi-fi work, a walk-through flow was created from frames one to thirty-two to simulate the apps use during the capstone show.

Final Frame Screen ShotFinal Frame Screen Shotgif of a screen flow
woman with a text bubble

Testing

Another Maze test! How I wish I did a live user test instead... However, two responses showed positive feedback and a wish for this app to be real.

“Yes, I could’ve used something like this when I was first starting college. I like that the tutors/teachers on this app have specific specialties, for example not just design but branding.”
“It is great!”

Conclusion

puzzle

Final Thoughts

I loved this project even though it resulted in many late nights! It has flaws; much work is needed to make it a reality. If I could only choose three actionable items to improve, it would be a design system, better user testing, and building a site map before the User Story Map. If I could highlight three successes, it would be the ecosystem map, user story/MVP, and the quotes from the final testing.

Render of prototype in useRender of prototype in useRender of prototype in useRender of prototype in use

The Assets

Man juggaling project assets