Catch

Gift to his heart

MOBILE UX/UI DESIGN | 4-WEEK COURSE PROJECT FOR INTERACTION DESIGN OVERVIEW | 12/2014
with Chien-yu Chang, Yujing Tian, Chase Wennick

What is Catch

Catch is a mobile app we built for a course project that explored the product concept of a gift purchase planner for male clothing. Our team played around the idea of personalized gift recommendation based on accessible social media information of the gift receiver which also would be fine-tuned by the gift buyer’s input. Our design language attempted to reflect the sense of style of the demographic who were more likely to be attracted to such personalized gift shopping experience.

Problem & User Research

Buying the right gift for the significant ones has never been easy. Gift givers often seek for certain personal touch that can be delivered with a special item to the gift receivers. However, not every gift giver has such instinct or the faintest idea for gift purchase.

In order to better understand the user need, each member of the team conducted 1-2 face-to-face interviews with young females in their 20s and 30s. Here are some of our key findings:

Persona

Based on our research findings, we developed a persona to communicate the needs we want to address and the design goals the group agreed to achieve:

Storyboard

Each team member created a storyboard to illustrate their ideas of feature for the app.

Mood board & Design language

We created a mood board to express the feeling we want to deliver through the visual design. Because this app targets at young professional women, we wanted Catch to convey the feeling of urban and sophisticated.

Moodeboard

We abstracted the mood board and created this beautiful color palette to reflect the style we envisioned for an online (selected/boutique) clothing gift shop for men. We chose the mellow colors to deliver the urban and cozy lifestyle. The simple lines and shapes were aimed for creating a modern and clean layout.

Design Language

Wireframing & Iterations

The interface design begins with quick sketches of the key interaction to illustrate user experience. We had several iterations of the paper prototypes within the group. It helped us consolidate the initial conception and communicate within the team.

One key challenge was how to present gift recommendations that are attractive to the users and also give users the ability to customize their search. Our solution was to arrange the gift ideas by important dates with countdowns. The solution to customization was to allow users to add tags to refine their search.

Sketches

Wireframes

UI Iterations & Final Design

We incorporated our design language to our wireframes and created our visual interfaces. We fine-tuned the details according to the iOS Design Guidelines to make sure all margins and clickable areas are appropriate.

Iterations

Final Design