Revl_desktop---0902---gps.jpg
foodU-header-optim.jpg
hylothumb_feed.jpg
etsy header.001.png
sizlehthumb.png
DSC09466.JPG
Screen Shot 2015-08-22 at 1.04.37 AM.png
Wearables_Final_render2.png
Revl_desktop---0902---gps.jpg

REVL Content


 

 

SCROLL DOWN

REVL Content


 

 

 

The Revl app uses A.I. and machine learning to make editing easier.

Revl is a smart action camera company. Their first camera, the Revl Arc has 4 built in sensors that can help identify your best moments and instantly create stunning videos for you to share. 

The editing takes place on the iOS app which has four main features:

  • Remote camera control and viewfinder

  • Preview footage on camera

  • Automatic & assisted video editing

  • Action-data analytics

Check out the Camera app at: www.revl.camera

Revl Experiences System: www.revl.com

 
 

 

Edits video for you.

The Revl App uses data captured by the Revl Arc and uses A.I. to automatically find the best few minutes from your hours of video. It also edits videos for you after every adventure.

 
Edit-Hero-Duo (1).png
 
Revl_Hero_v5_r.png
 
 

Action-data monitoring & tracking

Quickly jump to your best moments by accessing the moments bar, navigate your footage by scrolling through your data. Now you can see how much air you got, how fast you were going, and how many rotations you made.

 
 
 

Remotely control your camera

Easily access your camera's controls when you need to, tag a moment, or snap a picture. 

 
capture-fullscreen-iphonex-r.png

 
 

RevlHUB

I helped REVL conceptualize how REVL could expand their presence from mobile to web and further utilize their data and social platform.

revl-hub-Profile-nick-r.png
revl-hub-Gamification.png
 
 
 

Packaging

Designed packaging artwork and form.

 
packaging-duo-r.png
 
 
 

Audi MyMemories

Led design and strategy for a joint venture with Audi AG. Our work visualized how camera and AI software could fit into the Audi car ecosystem. Resulting project was name myMemories.

 
 
 

Process

Unfortunately I cannot show the process behind the creation of this product because it is protected by a non-disclosure agreement. To enter, you must choose wisely...


Key Role: Interaction & Visual Designer

Deliverables: Primary and Secondary research, product concepts, Interaction model, visual design, brand implementation, high-fidelity wireframe flows, engineering spec documents, animated prototype.

Team: Corey Richardson (ID), Bruce Pla (ID)

Date: 2017 -2019

Length: 2 Years

 
foodU-header-optim.jpg

FoodU Content


FoodU Content


 

Food University

Food University is a nonprofit organization which partners with grocery stores with the goal of educating the public on important health information, as well as helping children and young adults learn how to make their own delicious and wholesome meals at home through education, engagement and guidance. 

Our food system is plagued with bad food. Every year 680,000 people die from the food they eat. Many people never have the opportunity to learn how to cook their own meals, or about the importance of eating wholesome meals.

Food University's mission is to educate, engage and guide communities towards adopting healthier lifestyles; by helping them learn how to cook, and to make important health information fun and available to the community at the source of the food. 

 
 
foodUlogo-02.png
reality engine.png
 
 

Mini-Documentary: Understanding America's processed Food System

I created this mini-documentary based on information I found while doing secondary and primary research to help explain the problem we face in a capitalist food system. The documentary highlights how our food corporations are under tremendous pressure to innovate and increase profits using not-so-healthy methods. In our food  system, companies are forced to sacrifice our health for profits, creating irresistible and convenient snacks, treats, and meals causing a pandemic of overconsumption of salt, fat, and sugar.

 
 
 
 

How it works

Food University has two important factors which make it a whole. First, is the in-store service. Second is the smartphone app which helps people at home. 

 
 
 
human-+-tech-r.png
 
 
 

Meet the food Advisor and the Food Mentor!

 
 
 
 

1. The Food Advisor

Answers all your questions about nutrition, cooking, and health. 

Responsible for answering any questions about food and making learning about nutrition engaging and fun for customers.

The Food Advisor has a large tool set of workshops, exhibits, and demonstrations designed to engage the public in basic and important nutritional knowledge. 

They partner with public schools giving children access to education related to food, nutrition, and health. 

 
 
 
 

2. The Food Mentor

The Food Mentor is a combination of a nutritionist and personal trainer.

They teach people how to plan, shop, and cook their own meals at home and guide people through how to adopt a healthier lifestyle with the goal of improving their physical health through their diet. 

 
 
 
 

What it's like to become a member:

This illustrated storyboard is intended to convey the customer journey of how a customer becomes a Food U member and begins to use the service. The main character and quotes are from real stories I collected in my research.

 
 
 
 

The Food U application

With the help of the Food U app shoppers can plan, shop, and learn how to cook a meal with just one app. The food U app makes breaks down the steps of how to cook meals into easy to follow video tutorials. 

 

Set your cooking goals though easy steps

 
 
onboearing3.png
onboarding1.png
onboearding2.png
 
 

Weekly meal planner & curated meals to choose from

Planning meals is extremely important if one is to adopt the home cooking lifestyle. Most people go into the store without any plans and just pick out what is easiest to make, such as frozen meals and packaged food. 

Think of this like Netflix for food. The more you interact with the recipe book, the more personalized your results are. The apps algorithms learn your behavior. 

 
 
 
 

Groceries are magically added to your shopping list

As soon as you have planned out the meals you want to eat, the ingredients for those meals are added to your grocery list.

 
 
 
 
 
 

Your meals, visualized every day

 
 
 
prep.png
 
 
 

Meals broken down into step-by-step video tutorials

Video tutorials visualise exactly how to cook a certain dish. Detailed written and visual instructions are also provided below.

 
 
 
 
 
 
 

Who it's for:

 
frameworks-02.png
 

Who pays for it?

Food U is a not-for-profit organization paid for in part by government, grocery stores, and charity. 

 
 
 
hylothumb_feed.jpg

Hylo Content


Hylo Content


 

Hylo

A new kind of social network that helps real communities create, together.

Hylo was looking for a designer to take on the challenge of redesigning their products user interface, rethinking the user experience, and creating new features for their product.

In order to achieve this, I designed Hylo to be simple, intuitive, and clean. I stripped away unnecessary visual elements, constructed simple intuitive interactions and leveraged animation to guide the user's attention throughout the entire experience. 

 
 
 
 

Animated Prototype

Programs Used: Adobe Illustrator, Adobe Photoshop, Keynote, Premiere Pro. 

 
 
 
 

Community feed

The community feed is where you can see what's going on in your community. See what cool things people are up to, what they need help with, and interesting resources they want to share.

 
 
 
 

Creating a new 'Seed'

I broke this down into two screens in order teach people that there are three options when posting a seed. It mitigates the feeling of being overwhelmed with information as well.

 
 
 
 

User Profile

The user profile was visually designed to maximize storytelling and personalization. Big profile picture so you can recognise the user, short bio, and bite-size information of who this person is.

 
 
Hylo_portfolio-08.png
 
 

Editing User Profile

The profile editing experience was designed to look and feel like a seamless transition from the profile view. This allows all elements to remain in the same place, reducing confusion of the user.

 
 
Hylo_portfolio-09-09-09.png
 
 

Creating a community

In order to avoid overloading the user with forms and information, I broke it down into three steps.

 
 
Hylo_portfolio-11.png
Hylo_portfolio-12.png
Hylo_portfolio-13.png
Hylo_portfolio-14.png
 

Settings


Key Role: Interaction & Visual Designer

Deliverables: High-Fidelity wireframe flows and engineering spec documents.

Team: Edward West (CEO), Ray Marceau, Lawrence Wang, Minda Meyers.

Date: 2014

Length: 4 Months

etsy header.001.png

Etsy Content


Etsy Content


 

Etsy Stories

The Etsy community needed a way to "stand out amongst the millions." Etsy Stories allows crafters to create and share their unique stories through a guided visual storytelling process. 

Etsy (whom we have no real affiliation with) was looking to help understand their competition, their customers, and looking for new and innovative ideas to help scale their business. In order to do this we planned, constructed, and performed:

  • Primary and secondary research for Etsy
  • Customer archetypes
  • Customer & market insights
  • Areas of opportunity for the organization
  • Innovative ideas that would grow their business
  • Video scenario of final Product

The most important thing we learned from our research is that crafters need a way to "stand out amongst the millions" and that their unique stories behind their craft resonated with customers, creating emotional engagement and a motivation to support their business.

Our solution is the Etsy Stories iOS app which was designed to help crafters create compelling short stories by walking them through a guided storytelling process. They can then feature their stories on their store page.

 
 
 
Etsy_redesign-01.png
 

Every item has a story to tell; tell it with Etsy Stories.

The Etsy stories app is an immersive browsing experience, visualizing the unique and authentic stories behind the handmade goods.

Unique and authentic stories create emotional engagement and a motivation for people to support a business, as well as trust that the product is really handmade.

Great stories have the potential to be shared, thus directing thousands, possibly millions of viewers to Etsy and the crafters store.

Provides crafters with a way of differentiating themselves "from the millions" of others selling similar, or the same product.

Validates trust with the customer, seeing that the item really is handmade by this person.

 
 
 

It's easy to get started.

Just enter a title, brief description of the video, tags, and how you want to shoot the video.

 
 
 
 

We walk you through how to tell your unique story.

Etsy Stories app teaches crafters how to make engaging videos with helpful tutorials and great examples.

 
 
Etsy_redesign-12.png
 
 

Easily shoot and edit your video on your phone.

No need to transfer your footage. Etsy Stories has a built-in, easy-to-use, editing and sharing features.

 
 

 

Final Research Readout


 
 

This presentation highlights our research methods and goes deep into explaining what we learned from the process. It also contains our insights, opportunities, design solutions, and value statements. 

View as PDF

 
 
 
 

Online Research

We researched all of Etsy's competitors and placed them in a competitive landscape. We learned interesting statistics, and immersed ourselves into the online maker communities conversation, as wella s contributing to it. 

 
 
 
 

Primary Interviews

We conducted nine contextual inquiries with real customers, we prepared interview guides, had designated note takers, interviewers, and transcribers. We even asked them to draw out certain experiences.

 
 
 
 

Immersions

To really understand crafters we immersed ourselves into the physical marketplace to distinguish the barriers that etsy's online platform creates. 

We learned that people are more likely to buy when they have visually and verbally interacted with the maker, giving the maker a chance to communicate their personality and story behind the craft.

 
 
 
 

Black Market SF Emotional Journey Map

 
 
 
 

Tea-We Tea shop

 
 
 
 

Archetypes + Frameworks

We developed three archetypes that describe Etsy sellers. This can help Etsy understand who their main three types of sellers are and how they can design for them. 

 
 
 
 

Insights + Opportunities

 
 
 

Value to Business, User and Brand

 
 
 
 
Stories are the creative conversion of life itself, into a more powerful, clearer, and more meaningful experience. They are the currency of human contact.
— Robert McKee
 

Class: IXD4: Design Research & Time Studio 2: Storytelling

Key Role: Design Researcher, Interaction Designer, Visual Designer, Co-Director, Co-producer.

Deliverables: Video Scenario, Research Readout, Product Renders 

Team: Tarang Gala, Kelly Stuckey

Date: 2014

Length: 4 weeks


 

Process Highlights

Competitor One-Sheeters

Online Immersive Research

Screen Shot 2016-01-02 at 8.22.03 PM.png

Interviewing with subject matter expert, Julian

Manager of StoreEnvy , maker, and organizer of black market SF. Julian is a huge part of the Bay Area Handmade community and was one of our Subject Matter Experts.  

 

Synthesis of research data

We took all our data and clustered it into themes. We then looked for more complex patterns within the data. We took these patterns and we hypothesized why they were occurring. We then took our answers, wrote them out as insights, and created opportunity statements for each one. 

Developing Etsy's Customer Archetypes

In order to help etsy understand their customers, we developed customer archetypes which categorizes hand-crafters into three categories 

Screen Shot 2016-01-02 at 6.55.53 PM.png

Iterating on archetype frameworks

Rating opportunities & Concept Spectrum: Revolution to Evolution

Video Storyboard

sizlehthumb.png

Sizzle Content


Sizzle Content


 

Sizzle brings the chef to you.

Special occasion? Sizzles got you covered. In seconds, you can book select personal chefs to cook in your own home on the same day.

Sizzle is a new service which makes it easy to book a personal chef for small private events. Sizzle offers select personal chefs whom can be booked via an iOS app in under 24 hours in advance, and come right to your door.

 
 
 
 

Just pick your favorite meal.

Browse through HD video menus and choose from a select group of Sizzle's diverse and experienced Chefs.

Sizzle_UI_flow-02.png
 
Sizzle_visual_final-03.png
 

Book your Chef.

Get the menu details, check out the Chef's profile, nutritional information, and book!

 
 

Tell us when, where, and how many.

It's quick and easy to do the boring stuff. We'll even remember your information for next time.

Sizzle_visual_final-04.png
 

 
 

This in depth presentation outlines the experience and service we provide to our customers. We outline things such as:

  • Who our service is for
  • Qualifications
  • Service offering & differentiation
  • Value Proposition
  • How it works
  • App interaction flow
  • Supplies we provide
  • LIVE cooking demo
  • Chef guidelines
  • Outreach
  • Launch plan (First & Second launch)
  • Future business scaling
 
 
 

Key Role: Creative Director, Interaction Designer, Graphic/Brand Designer, Video Director/Producer 

Deliverables: Video Scenario, Live Experience Demo, Presentation, Framer.js Prototype

Team: Ankita Akerkar, Shue Wong, Maha Almadhi

Date: 2015

Length: 3 Months

 
 
DSC09466.JPG

Sustainability Content


Sustainability Content


 

Designing socially sustainable food labeling.

How interaction design can change the way we eat.

There’s a fire inside me, and it’s what people call passion. I am passionate about helping myself and my people become stronger through the food they eat. “We are what we eat,” is not just a saying, it’s one-hundred percent true. Food is how we transduce the energy given to us by the universe into our bodies so that we can enjoy that which is life. The organic matter that makes up our bodies comes from the food we eat. When we starve our bodies of the nutrients it craves, we limit its ability to grow and function properly.

Sugar from fruit is a great way to provide fast acting and high caloric density energy to our bodies. Sugar also triggers a massive dopamine rush when we taste it. Our brains have been biologically wired to seek out sugar since before we evolved to walk on two legs (bipedal locomotion). Before farming was discovered, food was scarce; sugary fruits were an extremely effective and rewarding way of obtaining energy. The problem we face now, in the 21st century, is that we are surrounded with an abundance of added sugar (sugar added to foods) in our food system. We no longer need to seek out sugary things as we once did, yet we can’t resist the temptation to do so. Our desire for sugar bypasses reason and logic because the primitive part of our brain, the Nucleus Accumbens our pleasure center, is neurologically wired to seek out its reward.

Food corporations are taking advantage of this. Added sugar is hidden in 74% of packaged foods. This pattern needs to end soon or we face huge consequences, for example, 1 in 3 people will be diabetic in 2050 according to the CDC. How can it be 2015 and we still don’t have the recommended daily value of sugar on our food labels? This question is what drove my quest of designing a sugar warning label for the world’s most popular treat, Coca-Cola.

I chose to focus on soft-drinks because 1/3 of all added sugar consumed in the United States comes from soft-drinks alone. Sodas contain a massive amount of sugar and no nutritional value. Soda seemed like a worthy adversary in my quest to expose its dangers. However, I did not arrive at this decision from the start. I explored and prototyped several different food label concepts for which I could design for.

Concept One: Nutrition Labels

Nutrition labels were my original target. I think they are great tools, but not user friendly. An astounding 60% of people have difficulty understanding nutrition labels. My original hypothesis was to create a nutrition label that leveraged visual metaphors to help people understand the information. I started on paper exploring different frameworks and visual metaphors.

I moved to digital once I had an idea I liked. The idea behind these labels was to use triangles to represent the percent daily value. Because of the nature of triangles, a low percent would appear as a lot. The higher the percentage, the less room there appears to be, causing the consumer to become more cautious of how much they are eating. I also added a visual metaphor for the serving size, reworded several phrases to make serving size more understandable. I emphasized calories and added a color code so people can easily find what they are looking for. The feedback I got was that this may be “nicer to look at and read, but I was still manipulating people and not representing accurate information.” I still like the idea as a concept, but the feedback was convincing enough for me to not pursue this route.

Concept Two: Food Score

This food score gives people an at-a-glance guide for a product’s nutrition quality, ecological friendliness, and worker fairness. The food score, located on the front right of all packaged foods, would be supplemental to the nutrition facts that currently exist on the side and rear of packages. The goal of this concept is to help people who have trouble understanding food labels by simplifying it, increase the number of people who pay attention to nutrition, and encourage shoppers to consider purchasing healthier and more sustainable products.

Concept Three: Nutrition Guide

The other concept was a nutrition guide iOS app. Scanning or searching a product results in relevant information such as, ingredient health rating, risks associated with consumption, ingredient information, nutrition breakdown, and articles related to its health risks/benefits and marketing ploys. This product would save hours of time spent researching certain foods by doing the research for you. The feedback I got was that, “I was adding a layer of complexity to the purchasing process and that would likely lead to it not being used.” In hindsight, I realized that I am actually reducing the complexity it requires to become aware about certain foods. It may be a useful tool for people who already are trying to be healthy, but I want to help people that aren’t like me.

Concept Four: Sugar Warning Label

The idea behind this concept was simple. Visualize the amount of sugar in the can, on the can.The label represents the amount of sugar if measured out in its solid state. A simple, yet effective metaphor of what 49 grams of sugar looks like. Everyone I showed this idea to gravitated towards it. There was just something striking about how simple and effective it was at conveying important information. This idea was inspired by people who measured out the sugar and placed them in cups or bags next to the product, surprisingly no one had considered the idea of putting it on the can. It was obvious this was the concept that I was to push further.

Ecosystem Map

Before I started designing the labels I explored the relationships between the actors and objects in the packaging space and designed an ecosystem map. Here’s a fun fact I discovered along the way: the FDA allows a 20% accuracy range for the nutrition facts, so if you are drinking a 100 calorie drink, it might actually be more like 120 calories.

Physical Prototyping

The next step was to create physical prototypes of my concepts. After several user tests and a critique, I gained valuable insights on how to improve the label and further validated that the sugar label was, in fact, the concept that resonated with people the most. People were not able to easily understand that the label represented the amount of sugar, so I revised the wording.

For the second prototype, I decided to make the background have a sugar texture, rather than a plain white. I also added a proactive tip on how to burn off the calories. After testing the second prototype I found that the texture did not come across as sugar, they thought, “it was dirty.” I also got feedback that the wording was still not clear. People enjoyed the tip on how to burn it off because it gave them an idea of the amount of energy in the can. The wording, “you are about to drink this much sugar,” was still not clicking with people.

The final Design

The final design incorporated a less literal texture of sugar, I used a pattern that resembled sugar rather than an image. I also changed the text on the can to say, “This label represents the amount of added sugar in this beverage.” In addition, I visually improved the label and brand by adding more icons and redistributed the text areas.

Screen Shot 2016-01-24 at 12.31.11 AM.png

Going Public

Part of this quest was to actually bring this design out into the public and gather reactions. My goal was to give away 100 Coca-Cola cans to the public containing my sugar warning label. In order to do this I needed to print, cut, paste, transport, and hand out my design.

The Reaction

I can’t tell you how overwhelmingly positive the public’s reaction was. This was information that they wanted to know, and my visual metaphor was extremely effective. Many people were very supportive of my cause; taking pictures of the design as well as pictures of me! Doctors, nurses, and farmers gave me their contact information so that we could stay in touch. I gave lectures to children about the dangers of soda and sugar. I was surprised at how many people were not aware of how much sugar was in soda. From my 2.5 hours in the public, the label proved its value ten-fold. My most successful moments were when several different people came to grab a Coca-Cola, read the label, and put it back! Successful behavior change.

Watch their reactions below.

 
Screen Shot 2015-08-22 at 1.04.37 AM.png

FOPT content


FOPT content


 

Envisioning the future of public transportation.

What could our public transportation system look like if we redesigned from the ground up with modern technology and urban planning trends?

Part of my time spent at frog design was dedicated to this project they had given to us interns. We spent about a month researching and synthesizing current and future trends of public transportation and related fields. We conducted qualitative interviews with a dozen people about what they liked and didn't like about public transportation. The next two months would be spent designing a new system based off our research and ideation. We designed a public system of low cost, networked, and auto-intelligent vehicles. Today's self driving cars only communicate with the environment around it, but what if the cars could talk to each other, a centralized supercomputer, as well as the environment? Well what we learned was that communication was a key variable in the systems efficiency.

 

Presentation


Process


Ethnographic research

Qualitative interview data

2015-06-16 09.28.15.jpg

Early idea mapping

2015-06-16 09.28.54.jpg

Early observations

2015-06-16 09.29.19.jpg

Forming insights

Ideating for each touchpoint & voting

More research

Deciding design principles

Viral crunching the numbers

Brainstorming

Journey mapping

Sketches of potential ID forms

Creating our value proposition

Deciding our deliverables

2015-06-16 09.29.10.jpg
 

Key Role: Interaction Designer & Researcher

Deliverables: Research, Presentation, Storyboard, Renders

Team: Drew Walcott, Cat Lam, Viral Shah, Ingrid Hong, Radhika Agarwal 

Date: 2015

Length: 3 weeks

 
Wearables_Final_render2.png

Wearables Content


Wearables Content


 

Get real-time visual feedback of your workout.

By integrating flex sensors, RBG LED's, and other technology into sportswear we can gather important information that helps improve exercise performance.

This clothing indicates to its user how well they are performing the exercise, provide cardiovascular health, calories burned, keep track of reps and sets, and many more possibilities. 

The design integrates flex sensors into key areas of clothing, it can read the position of our body and determine the quality of your exercise. It keeps track of the number of reps the wearer has completed. The heart-rate monitor keeps track of calories burned and cardiovascular health. Combining this data can provide the wearer with an overall performance score. Individual LED’s are connected to the flex sensor, giving the wearer instant visual feedback on the quality of their exercise.

 
 
 

Proof of concept prototype

 
 

Features & Tech Specs

 
 
Wearables_FInal_pres.018.jpg
 
 

Process

Using state of the art materials, prototyping tools, and fabrication techniques (which I developed), I was able to create a usable and working prototype of my concept. Here are some photos of the process.

 
 
Wearables_FInal_pres.007.jpg
2014-12-02 00.44.43.jpg
Trying it on for the first time!

Trying it on for the first time!


Key Role: Interaction Designer & Researcher

Deliverables: Research, Presentation, Storyboard, Renders

Team: Drew Walcott, Cat Lam, Viral Shah, Ingrid Hong, Radhika Agarwal 

Date: 2015

Length: 3 weeks