Portfolio_Review_201901_template.png

Overview

Design an eye-opening experience for students to discover orientation events.

2019 / Private Project / 1 Week

What I did
I redesigned a School Event Search App for new students. The feature of this app is to recommend events using user’s preference and intention because new students are overwhelming about a lot of school mails and event information and cannot judge what is a valuable event.

  • Role: UX Researcher, UX/UI Designer

  • Deliverable: High fidelity mockup, Visual design system

Why I did
This is a private design challenge to apply for a school job. I designed for Android (Pixel 3XL) to show a capability of cross-platform design. I set the situation that the orientation team are looking for designing an eye-opening experience for students to discover orientation events.

  • Category: Sole Project

  • Contribution: Research, Concept, Design, Build

How I did
I was supposed to finish this project within a week.

  • Design Approach: Design Thinking

  • Method & Tool: Depth Interview, Online Survey, Persona, User Journey Map, Card Sorting, Storyboard, Content Map, Paper Prototype, Wireframe, Sketch, Adobe XD

 

Understand

Investigated current user’s opinions and a process flow.

Using the Design Thinking methodology, I started with the process of Understand. However, I was supposed to finish this project within a week. Therefore, based on the time restriction, I decided to use an online survey and text-based depth interview to gather students’ opinions of why/what/how to join school events.

I gathered opinions from a total of 9 people in a day and categorized 3 fundamental motivations to participate in join school event: Skill up, Networking, and Entertainment.

 

Defined current user’s typical process and pain points.

From the data I gathered, I visualized a typical persona and As-Is user journey to share the image of target users with other stakeholders and clients.

 

Analyzed competitive services to understand best-practices and new opportunities.

At the same time, I researched on experiences of the current school system and Eventbrite to understand pros and cons of the current services and commercially successful factors. Successful services support not only a searching function but also the entire experience such as searching, browsing, applying, scheduling, and joining.

Current School System

Eventbrite (for Public Events)

Picture22.png
Picture21.png
 

Research-driven assumption is the seed of innovation.

Based on the UX research, I made an assumption that the following 6 elements are influenced in decision making to join the event. Before thinking about functions and interactions, it is essential to ponder WHY students use the event App and want to join events.

 

Explore

Now is the time of turning user insights into viable functions.

Based on the understanding to users, I started to come up with ideas about HOW and WOW to provide these 6 information to users. Through the process of ideation and storyboarding, I visualized the experience I was imagining.

I think storyboarding is the most important part in the design process because storyboards have the power of converting words into sequential scenarios. These vivid scenarios enables us to communicate with other members of the project and convince clients with clear images. Designers need to convey how people’s experiences and values change with a lively resolution.

Picture15.png

After making story, I developed the To-Be Journey map, content map, and user flow to narrow down ideas into feasible functions.

Picture7.png
 

Prototype

Verify my solution through iterative prototypes & tests.

I added login and onboarding screens and created a first paper prototypes from searching, browsing to applying and managing.

Picture8.png

Additionally, I conducted a usability test with two classmates in person for 1 hour at that stage. It is crucial to test as early as possible. If we made mistakes at the early stage, we can fix them easily. We cannot modify profound problems after we are in the development stage.

  • Applied their feedbacks into the next iteration.

Key Findings

  • Career related information is more motivating

    • Event Category is general. Focus on more student goal

    • It is more beneficial info such as UX related alumni took this lecture

  • Information tied with classes of this term is helpful

    • It is more helpful such as this event relate to Tuesday class

    • I need school calendar. It contains event and class schedule

Picture9.png
 

Improve resolution from paper prototypes to wireframes.

My concept of showing the 6 elements of decision making worked. So I updated the entire process according to the user’s feedback.

Onboarding

Personalization

Event View and Manage

 

Finalize

Keep consistency from the beginning strategy stage to the final surface stage.

  • Created the visual design of the entire process using Sketch.

  • Summarized design elements as a visual design system to keep consistency and manage easily.

  • As a next step, an iterative usability testing and making motions should be conducted.

I followed the Brand Guideline of Parsons School of Design and Google Material Design Guideline to design for Android devices.

Picture13.png

Initial Visual System

  • Created the initial color/type system to design visual elements consistently and quickly.

  • Used symbolic pantone red of The New School as a primary color.

  • Used the online service to make a natural gradient: http://www.0to255.com/E82E21

Final Design

Picture1.png
Picture2.png
ezgif.com-optimize (1).gif

Design System

Picture5.png
 

Learning

  • Design end to end with keeping consistency according to 5-Planes model of UX Design by James Garrett

  • Design is a creative and logical journey to find an appropriate journey

  • All deliverables are tied consistently from the beginning strategy to the final surface page.