Guru Profiles

The fluid marketplace.

Uguru started out of UC Berkeley where most tutor-student transactions were through their app, where customer growth came primarily out of word of mouth or social media. When I was hired, they were building their user interactions to be completely in-app: students could look for their tutors in one place, tutors could market their specific services in a dynamic fashion.

Profile Preview

Click any of the the category icons below to experience the final live prototypes. You can also skip ahead to view more about the profiles and play with the tile animations.

  • Photography
  • Academic
  • Baking
  • Household
  • Tech

Existing Framework & Planning

  • Home Dashboard
  • Category Menu
  • Guru Pairing
  • Guru Profile
  • Session Request
  • Confirmation

In this case study, I will be highlighting the guru profile flow at the center of the user story. I needed to create an interface that was customizable, but also cohesive the interaction across the app.

There are five category profiles: Academic, Baking, Photography, Tech and Household.

Style Guide

  • Typography

    The “Source Sans Pro” font family is represented with weights varying from Semibold to Black.

    • Academic

    • Baking

    • Photography

    • Tech

    • Household

  • Color Scheme

    These are the accent colors in Uguru’s style guide, chosen to fit a flat-design aesthetic. Each category’s color palette derives from one of these colors.

Internal Guide

A sample of the internal branding guidelines for designer use, featuring many of the graphic elements I illustrated.

User Personas

A composite of e-mail interviews, first-hand research, and user behavior with students from UC Berkeley. Internally, I wrote user personas for each type of profile.

Academic Persona: You can ace this class because I aced this class.


On a typical school day, you can catch Kelly at the library or computer lab. She likes to get the most out of her school resources. If you look over her should in class, she has flawless notes. She enjoys tutoring because it is another way to master the subjects in her major.

Kelly's biggest challenge is managing her packed schedule. She likes to be involved in her school, organizations, and stay on top of her assignments. If her schedule becomes too hectic, tutoring becomes less prioritized. Her biggest annoyance are students who only seek solutions but not to learn how to solve the problem.


An easy way to integrate her tutoring sessions to her Google Calendar.



Working in Sketch

Guru Profiles

These were the final mockups for the profiles. Many of the visual assets made it into the live profile, coded by Gabrielle Wee. Additionally, I planned and coded the animations for each profile. You can see them in action when you press the play button next to the category tile.

  • Photography

    The Photography personality is artsy. Neutral colors drove the palette to highlight the guru's original photographs.

  • Pellentesque ornare sem lacinia quam venenatis vestibulum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Lorem ipsum dolor sit amet, consectetur adipiscing elit.

    Formal Events

  • Urban Symmetry


  • Academic

    This guru has the highest demand. I was inspired by textbook designs, think 90s Scholastic or McGraw-Hill, with the rectangular motif. The live component (seen below) was changed from a darkened cerise to a contrasting gray to highlight the entering animation effect.

  • $10/hr

    Chem 133

    Organic Chemistry

  • Everything You Need to Know About Gases


  • Baking

    Rounded edges, bold stroke-widths, heavy font-weight. I wanted the components to have a sense of softness that coincides with the soft, doughiness of the Baking Guru's baked goods services.

  • Peach Pancakes

  • 100 Muffins in 100 Minutes


  • Household

    Suds was the name of the game when creating these tiles, which are cartoonishly framed within bubbles. Originally, the Household tiles looked too similar to the Photography tiles because of the white border. My solution was to take Household in a more soothing, friendly direction.

  • Shiny Floors

    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • How to Make Your Plants Live Longer


  • Tech

    For these tiles, particularly the cardlet, I wanted to bring a wired theme using drawn-in borders as well as an electric feeling animation for the date.

  • $12/hr

    Mobile Water Damage

  • Best Apps of 2016



The desktop profiles are the project that I am the most proud of from my time at Uguru. User research, interface planning with the developers, and designing assets for animation culminated in a keystone experience within the overall Uguru framework. The category-based assets challenged and elevated the Uguru style guide. This informed the direction for designing the rest of the workflow, as well as extending the profile interface to be responsive for mobile and tablet.