CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations...

41
CASE STUDY THANITA PHAKCHAROEN

Transcript of CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations...

Page 1: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

CASE STUDYTHANITA PHAKCHAROEN

Page 2: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

OverviewProblemPoint Of ViewSolution

User TasksLow-Fi WireframesUser TestingIterationFinal Design

ResearchCompetitive Analysis

Logo GuideColor SchemeTypographyIcons And IllustrationsButtons And Components

QuoteTarget AudiencePersona

SketchesPostersSocial Media Billboard Ads Ads

01INTRODUCTION

04ITERATIVE DESIGN

02RESEARCH

05 BRANDING DEVELOPMENT

03TARGET MARKET

06ADVERTISEMENT

TABLE OF CONTENTS

Page 3: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

INTRODUCTION

Page 4: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Anten is a water emergency smart wristband working with the Anten mobile app to help people when they have a water emergency including three main functions: tracking, notification, and dashboard information.

Introduction

OVERVIEW

04

Page 5: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Introduction

04

Water emergencies are unpredictable. Many people drown and die in the water because they have a false sense of security. Also, it’s quite hard to help each other in those situa-tions.

PROBLEMS

Page 6: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Introduction

04

Investigate a way to keep ourselves safe from water emergencies by using wristband which contains a floating device and GPS inside to connect with mobile devices to noti-fy to other people.

SOLUTIONS

Page 7: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Tracking

Track where you and your friends are and what you and your friends feel when water

emergency’s happened.

Notification

Notify to other people when you have a water emergency

throung Anten’s app. Also, you can get notification to update

your friends status.

Dashboard

Dashboard information of you and your friends to get to know the basic information

and situation.

Introduction

04

KEY FEATURE

Page 8: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Introduction

04

PRODUCT

Page 9: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

WORKING PROCESS

Page 10: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Working Process

04

RESEARCH

According to research, drowning causes death that essentially happens in a very short moment. The number of drowning victims is around 10 people a day, especially chil-dren and people who love doing water sports. The main factors are having a lack of swimming skills, obstacles, or accidental injury. In general, people have a reaction of time about 20-60 seconds before sinking under water. When this emergency happens, screamimg as loud as they can to get attention and trying to control their movements are the best statesies they can do. However, most people are paniced when they are in an emergency. Controling themselves is the hardest thing they can do. Thus, having a life jacket or a floating device are the best prevention even though they have good swimming skills or there are many lifeguards around.

Page 11: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

The first step of the design process is asking questions such as what is the problem I have and need to solve. Then, I also asked people with the same question to get more ideas. Thus, I picked an idea to help people when they have a water emergency by connecting a smart wristband with other devices. There are drown-ing wristband devices which can help people float in the water when they have a water emergency. How-ever, these devices have some issues such as they can’t connect and notify other people, and they have a limited time to float. In an emergency, help may not arrive in time. Thus, I decided to improve this idea by creating an app which will connect to a smart wrist-band to access basic information espeacially when a water emergency happens.

Secondly, I brainstormed and created hand sketches in my notebook to collect ideas and functions.

Lastly, I transferred the ideas from hand sketches into digital ones. Also, I have arranged and adjusted digital sketches to the final design and created a mock up by using Adobe Photoshop, Adobe Illustration, and Adobe After Effects. The three design decisions I have for this app are to present them in the calm tone and contrast them with bright color such as orange. Seconly, I would like to create a simple but useful interface. Lastly, It should be easy to access.

Working Process

04

WORKING PROESS

Page 12: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Working Process

04

BRIANSTORMING

Page 13: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Tools I have used during this whole project including hand sketches, wireframe design, final design, and creating a mock up.

Working Process

04

TOOLS

Page 14: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

TARGET MARKET

Page 15: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Target Market

04

TARGET AUDIENCE

Mother and daughter Water sport lover

Page 16: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Target Market

04

PERSONAS

Lisa & Alice

ABOUT

BEHAVIOR GOALS FRUSTRATIONS

“Alice is my heart. She loves swiming and playing at the beach. We always enjoy our weekend there”

Age: Lisa - 35 years old /

Alice - 10 years old

Gender: Female

Location: Miami

Education: Master’s degree in Nursing /

Elementary school

Occupation: Nurse and freelancer /

Student

Income: 130K per year

Lisa and her daughter, Alice, live in Mi-

ami with family. Typicallty, after work,

Lisa waits for Alice learning to swim

at her school. Alice loves swimimg so

much. Almost every weekends, Lisa

brings Alice to the beach near their

house to play and relax.

1. I would like my daughter and I to be

safe when we go swimming, playing at

the beach, or taking water cruise.

2. I would like to know immidately if my

daughter has an accident whether swim-

ming in a pool or in the ocean.

3. I would like the fastest way to prevent

water accidents.

1. Alice is too young to take care of her-

self.

2. There are few lifeguard at thebeach

compared to people at the beach.

3. I don’t think I can hold my daughter

for a long time if we have an accident.

Page 17: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Target Market

04

PERSONAS

Andrew

ABOUT

BEHAVIOR GOALS FRUSTRATIONS

“Surfing and water sports are my life. It’s so much fun, but at the same time it can cause an injury. Also, an accident can happen at anytime.”

Age: 29 years old

Gender: Male

Location: Los Angeles

Education: Bachelor’s degree in Engi-

neering

Occupation: Senior Industrial Engineer

Income: 108K per year

Andrew is a senior industrial engineer

living in Los Angeles. Everytime he has a

day off, he usually goes surfing at Malibu

beach with his friends.

1. I would like to be safe whenever I surf

or do water sports.

2. I would like my friends or people know

if I have an accident and to help me as

fast as they can.

1. When I had an accident, there was no

way to contact people on the beach. I

could only wait for someone to notice me

in the ocean. Fortunately, lifeguard at the

beach saw and quickly help me.

2. Sometimes, help is slow.

Page 18: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

ITERATIVE DESIGN

Page 19: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

INFORMATION ARCHITECTURE

Page 20: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Working Process

RESEARCH

STORY

Andrew wants to connect with his friends because they are going

to do surfing in an hour. He would like to add them by using their

number.

Home Click Add button Find Friends

Add them Click Done Button

CommunityPage

Page 21: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

SKETCHES

Page 22: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

SKETCHES

Page 23: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

WIREFRAMES

Page 24: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

WIREFRAMES

Page 25: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

WIREFRAMES

Page 26: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

WIREFRAMES

Page 27: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

FINAL DESIGN

Page 28: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

FINAL DESIGN

Page 29: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

FINAL DESIGN

Page 30: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Iterative Design

04

FINAL DESIGN

Page 31: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

BRANDING DEVELOPMENT

Page 32: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Branding Development

04

LOGO

BASIC LOGOTo present the Anten logo, we combined three key ideas including a swim ring, a pin icon, and a lower case ‘a’ together. The swim ring represents a floating device which can help people when they have a water ?emergency. The pin icon covey location of emergency. The lower case ‘a’ came from the Anten. Also, we use orange color for the Anten logo which means warmth and balance. On the other hand, the orange color was inspired by an emergency swim ring and life jacket.

KEY IDEA

Swim ring Pin icon Lowercase ‘a’

Page 33: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Branding Development

04

LOGO

Page 34: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Branding Development

04

LOGO

Page 35: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Branding Development

04

TYPOGRAPHY

TYPEFACE

Typography is an essential part of Anten. We use Archivo typeface, bold, to express the feel-ings of being strong and secure. We also use Karla typeface, regular and bold, to communi-cates the feeling of friendlyness and calmness.

Page 36: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Branding Development

04

COLOR

COLOR PALETE

Anten uses orange as the primary color of the logo and components to emphasize important elements. The secondary color is a blue gray tone. We use this tone to calm our feelings.

Page 37: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Branding Development

04

ICONOGRAPHY

Page 38: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Branding Development

04

ILLUSRATIONS

Page 39: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Branding Development

04

UI ELEMENTS

Page 40: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

Branding Development

04

SOURCES

- http://connectedarena.com/e-fun-launches-nextone-hrm-enabled-fitness-tracker/

- https://www.cdc.gov/homeandrecreationalsafety/water-safety/waterinjuries-factsheet.html

- https://en.wikipedia.org/wiki/Drowning

- http://www.designindaba.com/articles/creative-work/kingii-water-wearable-can-save-you-drowning

https://unsplash.com/

Page 41: CASE STUDY THANITA PHAKCHAROEN · Final Design Research ... Typography Icons And Illustrations Buttons And Components Quote Target Audience Persona Sketches Posters Social Media Billboard

THANK YOU