SEVA by Chi1918

SEVA

Mindful Business Trip

CONTENTS

About Me Autobiography Resume

UX Process 02 03

Thesis Abstract Thesis Abstract Motivation Elevator of Pitch

34 35 39 45 49 53

Technical Buildups Development Framework Timer Tracking Chart

59 59 59 60 61

07 08

Strategy Process

Assets

Visual Design

Problem Discovery Research I The Problem

Solution

11 13

Proof of Concept Task Flow-1 Task Flow-2 Task Flow-3 Proof of Concept Q&A

Target Audience Persona Competitors Inspirations Testing Research-2

Coding Development

18 23 27 31

Moodboard Design Guideline Typography Text Buttons

57 58 58 58 58

Sitemap Thesis Highlights Bibliography

62 63 65

Autobiography

My name is Chi Zhang, I like to be called Chi in US. I was born and raised in Dalian, a beautiful coastal city in northeast China. I have been fond of art from a very young age, and I got my bachelor degree in Industrial Design in a famous Art Academy in Northeast China. When I came San Francisco in 2012, I was first inrolled in Industrial design Department in AAU.It was all because of a lecture I have attended talking about User Experience Design made me realized my fatal interest in this new, human-centered design combined with artistic skills. And I finally decided to devote the rest of my life to become a UX designer.

ABOUT ME

1 1

2 2

Resume

Chi Zhang UX(UI) designer (+1)415-463-9567 www.cathy-zhang.com

RESUME

Education

Skills

Academy of Art University

Launguages

Master of Fine Arts in Web page, Digital and Information Resource design

09.2013-present

Luxun Academy of Fine Art Bachelor of design in Industrial Design 09.2008-09. 2012

Experience Creative UX designer Intern FreshDigitalGroup.llc Conducted user research, user scenarios, user testing for mobile app design projects with UX researcher, visual designers, and developer team. Connected and interviewed audiences to redesign and test the usebility of the apps. 06.2015-09.2015

3 1

4 2

Thesis Abstract

SEVA is a meditation app that aims to release the stress of the business trips. By meditating on the brakes of business travelings, you get a refreshing mind, and better relationship with your business partners. After the meditation section you can evaluate your feelings and your evaluations would be stored in the tracking pannel, which allows you to come back and check what your meditation effectiveness.

Meditate SEVA is designed especially for businessmen and women to develop a peaceful mind on their business trips. Meditate is the part you self meditate with. In Track section you can check your progress visually. Get connected with friends by inviting them to the app.

Track

Connect

Motivation Meditation is a way to reach a better mood state, and it worked perfectly for me for 4 years.In 2010,Richard, my English teacher, who holds a masters degree in psychology from University of Missouri, encouraged everybody in his class to try meditation when we felt tired. “Many people just think sleeping is the best way to relax, but meditation is actually much more effective, he said.”

Elevator of Pitch In 2016, a conference called Wisdom 2.0 stressed the importance of having an meditation app for social engagement, and well being for entrepreneurs. Conscious business become a hot topic among successful business entrepreneurs after world famous entrepreneurs gave several lectures.

When I was preparing to become an international student, I was facing leaving all my family and my country with few familiar people,meditation became my best friend. It gave me a peaceful mind, and relieved my stres. I joined many meditation groups in San Francisco, where I have been for the last four years—and I made many friends through them.

The speakers including Karen May, Vice President from Google, Stewart Butterfield, Co-founder of Slack, Tony Hsieh, CEO of Zappos, product manager at Facebook etc . In the spiritual lectures of the meeting, they believed meditation is a way to make people do extraordinary things.

Technology is our friend, and spiritual journey made by mobile devices is a delightful way to get rid of negative feeling of business trips.

Problem Discovery

STRAETEGY PROCESS

9 1

A business man/woman is a man/ woman who is good at dealing with business and financial matters, and works in business. A business trip is a trip undertaken for work or business purposes, as opposed to other types of travel. A business traveler is someone who travels for business purposes and paid by the business he works for.

Business men and women are in need of stress relief. From an article of Harward Business Review conducted by Michael Segalla, Ph.D. and Catalin Ciobanu, Ph.D. Dominique Rouzies, Ph.D. who are human management & product innovation experts from France, business travels build sales but also stress.

10 2

From the chart based on the same research done by CWT(Carlson Wagonlit Travel) 2012 booked flight database, business travelers of each level have stress, regardless of the role they are taking.

Research I

On the other hand, female business travelers are encountering as much as three times of stress than businessmen through all stages of the business travel. On pre-trip phase, we can spot that female have a remarkably high pressure level, which is about 4 times of men at same phase. This gave me the initial motivation to target my users on businesswomen.

Based on the income report by Harward Business review, every $1 spent on business travel can generate $9.50 in revenue and $2.90 in profits.Surveys among 7000 business managers reported their stressful levels over a business trip. The highest stressful report is shown in the departure, on flight and post trip stages. Business trips are tough tasks for people and even who meditate to get back their peaceful feelings as a habit in daily life.

Problem

Factors causes stress on business trip My target audience are businessmen and women who do meditations. Or we can say, “meditate business people”. SEVA is useable for SEVA meditators, and could be businessmen & women across the world, as long as they can get access to apple store to download SEVA app with their smartphones. This app will target feeling of “Negative Emotions”. in this unique group of users.”

When doing business trips, businessmen and women visit their clients, companies, attend meetings, and marketing products. All these processes require a lot of efforts. Therefore, they regard the business trips tiring and stressful tasks. The physical and mental effects often cause unpleasant emotions and feelings which lead to unexpected results, even business failures. Long Haul Flying

Unpleasant Amenities

Schedule Change

Solution

Proof of Concept

PROOF OF CONCEPT

Task Flow-1

Goal

Trying out SEVA for the first time.

Finish the first time meditation.

Launch

Read Tutorial

Set Time

Finish Meditation

Rate Feelings

Set Music

New User

Proof of Concept

Proof of Concept Task Flow 1 Olivia's First Trial with SEVA

The walkthrough is a simple 4-step introduction for users to quickly understand how to use SEVA. Each of the page has a title and one sentence to describe how to use the app. Here in my 3 user task flows, I included 3 users: Olivia, Susan and David. There will be a detailed page about them in the next few pages.

Tap / Swipe

1-1 LAUNCH 1. Olivia enters the landing page 2. Olivia read the introduction sentence 3. Olivia is taken to the tutorial page

1-2-1 TUTORIAL 01 1. Olivia looks at the icons 2. Olivia read about the tutorials 3. Olivia swipes or skip between the the tutorial pages.

1-2-2 TUTORIAL 02 1. Olivia looks at the icons 2. Olivia read about the tutorials 3. Olivia swipes or skip between the the tutorial pages.

1-2-3 TUTORIAL 03 1. Olivia looks at the icons 2. Olivia read about the tutorials 3. Olivia swipes or skip between the the tutorial pages.

1-2-4 TUTORIAL 04 1. Olivia looks at the icons 2. Olivia read about the tutorials 3. Olivia swipes or skip between the the tutorial pages.

Proof of Concept

Proof of Concept Task Flow 1 Continuance Olivia's First Trial with SEVA

When the first time user tries SEVA, he will be immersed into the simple, clean user interface design and the user-friendly functions. It takes 6 steps for a new user to reach the final step on the first task flow.Music is picked from the of top ranked meditation music websites, and is arranged by click-through rates. A selection of Religious muic, music of nature or human-voice tutorals are provided, based on a user's own preference. 2

Tap / Swipe

1-3 HOME PAGE

1-4 SET MUSIC

1. Olivia enters the home page 2. Olivia selects an emotion 3. Olivia is taken to the meditation page

1. Olivia set a meditation duration 2. Olivia choose a music from the list 3. Olivia starts meditation by activating the start button.

1-5 DONE MEDITATION 1. 8mins passed this page pops up 2. Olivia chooses Done with today

1-6 DONE MEDITATION-1 1. Olivia finishes her first meditation 2. Olivia is asked if she wants to register 3. Olivia taps on Continue Meditation, So she is taken back to Home page

Proof of Concept

Task Flow-2

Goal

User Susan wants to continue using SEVA.

Keep track of the current mood with Track section.

Tap / Swipe

1 2 3

2 4

2-1 CHOOSE A FEELING 1. Susan goes directly to meditate page 2. Susan just finished a meeting, she presses on Tired & Stressful

2-2 CHOOSE A MUSIC 1. Susan choosed a 8mins meditation 2. Susan is a buddhist, so tapped on buddhist Zen 3. Susan presses on the Start button

2-3-1 EVALUATION-1 1. Susan evaluates her feelings 2. Susan chooses 4 for Happiness, 3 for focusing and 4 for mindfulness 3. Susan presses on Submit button

Proof of Concept

Proof of Concept Task Flow 2 Continuance Olivia's First Trial with SEVA

As a returned user Susan has been using SEVA to help her meditation since March 2016. Before March 20, she has been using SEVA as a guest. On March 20, she registered her own SEVA account. So her mood data will be recorded in Track pannel, by a line chart, and by numbers as well.

2 2

2-5 DONE MEDITATION 2-4-1 EVALUATION-2

1. Susan's meditation has been finished 2. Susan presses on Login

1. Susan finished her evaluations 2. Susan presses on Submit

2-6 REGISTER 1. Susan log herself in with her registered username and password 2. Susan clicks on Submit

2-7 CHECK TIMELINE 1. Susan is taken to the Track section 2. Susan can check her progress in this timeline. 3. Susan presses on Check it out to see her detailed mood records

2-8 TRACK MOOD 1. Susan is taken to the Track section 2. Susan can check her progress in this timeline. 3. Susan presses on Check it out to see her detailed mood records

Proof of Concept

Task Flow-3

Goal

Susan returned and tried to invite friends in Group section.

Invite new friends to Group section.

Returned User-2

Tap / Swipe

Check Track Section

Tap on Group

Check Groups Invite friends from contact

3-1-1 CHECK GROUPS 1. Susan taps on the Group section 2. Susan taps on the notification dot

3-1-2 GROUP MEMBERS 1. Susan clicks on the red dot 2. Susan checks the group members in Marketing Hero group 3. Susan wants to add a new group member, so she licks on the icon inside the group

3-2 ACCESS TO CONTACTS 1. The dialog window pops up to ask Susan to access to her contact list 2. Susan presses on OK

Proof of Concept

Proof of Concept Task Flow 3 Continuance

Add Groups

Olivia's First Trial with SEVA

3-3 ADD FRIENDS 1. Susan taps on the add friend button on the right side of each friend list

3-3-1 FRIENDS INVITED 1. The Add Friends buttons turned less greener after Susan clicked on them. 2. Susan clicks on the check mark on top of the page

3-3-2 GET NOTIFIED 1. The confirmation page jumped out and noticed her invitation has been sent.

3-4-1 ADD GROUPS 1. Susan returned to the first page of Group section 2. Susan pressed on "add" to add a friend in the "Marketing Hero" group

3-4-2 SELECT FRIENDS 1. Susan selected two friends from contact 2. Susan presses on the checkmark to confirm her selections

3-4-3 CONFIRMATION 1. On the last step, Susan gets a notice telling her invitation has been sent. 2. Susan presses on the grey area, she will be taken to home page

Proof of Concept- Q & A Q &A What populates the list of emotions on the home page? The user’s preference would be recorded into the database, and next time the music list would be ordered by the order of his “Most clicked rankings”. When meditation is finished, the user evaluates his feelings with the rating page, where there are three evaluation options. Based on his current feeling, the user selects a feeling from the range of 1 to 5, 1 means smallest feeling, and 5 means max. After evaluation the user clicks on “submit” button, so the system will record the data and show a graphic chart in “Track” section.

How does the tracking section work? The user’s preference would be recorded into the database, and next time the music list would be ordered by the order of his “Most clicked rankings”. When meditation is finished, the user evaluates his feelings with the rating page, where graphic chart in “Track” section.

What does it mean for the values to go up or down? The evaluation numbers are sorted from bottom to top, increasing from 0 to 4. When the line starts to draw, it means SEVA has started to input your feeling evaluation data and output them into the charts.

In general, the line goes up while user chooses a higher score, and the line goes down while the user chooses a lower score. For instance, on March 14, a user meditated twice, on the first

time he chose “3” for mindfulness, “2” for happiness and “1” for focusing. And the second meditation on the same day, he chose “4” for mindfulness, “3” for happiness and “3” for focusing. Then the deep green line, mindfulness will go up from 3 to 4, the light green line, happiness will go up from 2 to 3, and the pink line, focusing, will go up from 1 to 3.

What populates this list of emotions? Which research? Why? Does it change, or is it fixed? Psychologically, colors can harness the positive effects to our emotion. Emotion is a person’s feeling in the sense of an affect. Emotions are complex things. According to plutchik's wheel of emotions, they are a state of feeling the results in physical and psychological changes influence our behaviors, thoughts and emotions, and to be aware of the impact they have.

feelings are best understood as a subjective representation of emotions, generally last for much longer durations than emotions and are also usually less intense than emotions. Affect is an encompassing term, used to interchangeably with emotion. Therefore, it is important for us to recognize and identity, describing the topics of emotion, feelings, and moods together, even though it is commonly used.

Target Audience

UX RESUME PROCESS

SEVA targets on its audients to businessmen and women between 25-35 years old who meditates to release tiredness in a daily basis. It is also a place to save all your group meditations which you joined, and allows meditation while they are away from their groups.

Persona

Persona Persona 1

Background Olivia Martin is a business woman, a dance lover, and a translator. She owns a small business company and traveling is both her hobby and she travels for job purposes. She has always trying to meditate but haven’t successful because the insecure and stressful feeling has always around her during business travel. She expects to find a way to enhance her mind to a peaceful state.

A persona is a representation of a type of customer. Personas answer the question, “Who are we designing for?” and they help to align strategies and goals to specific user groups. Gettinng the right group of persona gives SEVA a better target and user experience.

Need Olivia Martin is on her trip to meet her client today. She feels the stressful feeling affects her constantly and she wants to meditate on this trip.

"I hope I can have less stressful feeling and feel safer on the plane."

Name: Olivia Martin Age: 30 City: San Francisco Occupation: Dance Studio Owner

Persona

Persona Background

Background

David Clark is a Certificated Massage therapist. He owns his business which is called 4 Bliss Located in San Francisco. He offers Corporate Chair Massage & Corporate Yoga Instruction for companies in the Bay Area. David also offers Yoga, Meditation and Traditional Thai Massage in retreat settings throughout California and the states. When first heard about my app concept, he showed a great interest. He feels meditation is definately something for business people.

Suzanne works with entrepreneur's to help them build their businesses form a spiritual foundation. Suzanne leads her clients in a journey of internal healing that results in relief from the symptoms of anxiety,trauma and depression. With her background of psycology, she has always use meditation to rest herself.She recommends her business partners to start their meditation as well.

Need

Suzanne is the group leader of the Conscious Business Group. She maneges her group meetings and reminds her group members of the coming meetups. She wants to use an app to manage them easily, and also keep in touch with her groups while she cannot present in the meetings.

"I can forsee it to become a great app. is it possible for a 'Group Meditation' option?"

Name: Suzanne Katanic,CHt Age: 34 City: San Francisco Occupation: Psycological therapist

Something simple but effectively let he calm down to meditate, which also help him to interact with his customers.

Name: David Age: 39 City: San Francisco Occupation: Yoga therapist

"Talking with my customers about meditation always brings me surprises."

Competitors

Simple Habit Simple habbit is an app designed to let people meditate in busy life. It tells stories about stress relief, and provides tutors that teach you session by session. It aims to let you form a habbit to meditate every day.

Useability

Cons

Relationship with SEVA

This app was designed by a group of scientists & psychologists.It is designed very user-friendly. Users understand how to use it even for the first time. The list of meditation sections are ordered by week, for a seven-day series you have different meditation themes to meditate with with a tutor.The tutors are different persons, and you can choose the one you like from its list of tutors. Users can see their progress by a very simplified timeline design on the bottom of the page.Famous sayings are provided on the home page for you to learn more about meditation, and it helps to calm you down better.

This is the most competitive meditation app as a competitor to SEVA. However, after 3 sessions trial, Simple Habit requires a $9.99 monthly subscrition.

This app is designed for someone has an interest with meditation, and like to learn about it. It is a quite competitive competitor, but SEVA is mainly for young business people.

Competitors

Headspace Headspace is a meditation app released in 2015. It has been quite popular so far for its pretty illustration design and simple way of use.

Pros

Cons

Relationship with SEVA

The flat designed and llustrations gives users a delightful feeling. It has been switched into a pale orange color pallet Smooth user function. All make this app popular. It is Ranked 4.5 stars on Apple itunes store. Overall a very competitive competitor. However, it still focuses on lots of meditation practices, instead of self-driven meditations.

One of the cons found by headspace customers is the app has nearly half of the functions need to pay. For people who do not meditate often, this would lose their potencial user immediately.

This app is designed for everybody who wants to learn meditation and have a fun experience at meditationing. Overall it is an app focuses on self meditation. SEVA focuses more of meditating together and how it helps to stay together with meditation groups.

Competitors

Smiling Mind Headspace is a meditation app released in 2015. It has been quite popular so far for its pretty illustration design and simple way of use.

Pros

Cons

Relationship with SEVA

Smiling mind is originally designed for teenage meditators. It provides meditation learners with different projects and categorizes them into different age groups. The colorful and cute user interface makes young people want to return and use it again and again.

As explained in Pros section, users need to make a serious of selections from start using the app. The eealuation toogle doesn't make much sense because there is no such page to show them visually to the user.

This app is designed for someone who wants to learn meditation and wants to let their children try meditation too. SEVA benefits from the app as it provide friends section, which allows parents discuss about their childrens' achievements. The secone version of SEVA features a design of meditation group chat.

Inspirations

Worship Together Worship together lets you learn to pray with by mindful songs.

Pros

Cons

Relationship with SEVA

Simple.Clear. Easy to understand. Clean design. A nice and cool app about pray together with tutor though audios.The side menu makes it more organized to find items you want.

Worship together has some technical bugs. Also, there is no such area to let users listen to bible audios even though it has two sections about choosig a background music to meditate with.

Inspirations

Buddhify Worship together lets you learn to pray with by mindful songs.

Pros

Cons

Relationship with SEVA

Buddhify is a meditation app that help users to meditate while users can visualize their progress with a live chart. The interaction is smooth and user friendly on the "Choose emotion" page. Plus, the latest version doesn't have technical problems since the first version has been published on Apple store in 2013

Buddhify is an app designed by a small design group. So far it has been maintained well, but in the future we are not sure if it can still be stable and up grading the app is still free.

Buddify is a inspirational app for it is the first app that gives a evaluation chart for me to think about when starting to design SEVA. The color wheel is creative, because color is such a good way to stand for a specific mood.

Testing

Menu Bar

Meditate there. Fact have been not necessary, since users are already experienced meditators who already know the benefits of meditation very well.

The first version of SEVA has four functions, which are Meditate, Fact, Ambience and Track. After three rounds of user testings, I put Ambience into Meditation section and left only three functions

Since each user has his own cultural background, the list of music let him choose one that he wants to meditate with by press on the "+" button.

The second version of SEVA featured a separation of meditation duration, and a list of music has been added based on user's own preference.

Testing

Track

Track since users' feel Efficiency is an option that is hard to evaluate, I downsampled them into three selections, which are Happiness,focusing and Mindfulness.

Version 03 of SEVA featured a simplified user evaluation form. It has been modified from question forms to muiltiply choices, and

progress. The Mindfulness, happiness and Focusing are colored with Deep green, light green and pink, with each of their psycologocal effect to human emotion.

During the modification and testing process, tracking section has envolved from a star chart to a line chart. With color coded numbers, it is easier for users to visually evaluate their

Research - 2 The evaluation metrics What color should I use?

Color

Color Name

Colors are used to differ the three different metric. To some extend they are all related to what the metrics are. They are used to let users recognize better. a desaturated, pale green color pallet is used in SEVA evaluation chart, aiming to help my users get an experience of calm and peace. Psychologically, colors can harness the positive effects to our emotion. There are six psychological primary colors - red, yellow, blue, green, violet and pink.

Red

Positive Affects Positive: Physical courage, strength, warmth, energy, basic survival, 'fight or flight', stimulation, masculinity,

Yellow

Positive: Optimism, confidence, selfesteem, extraversion, emotional strength, friendliness, creativity.

Blue

Positive: Intelligence, communication, trust, efficiency, serenity, duty, logic, coolness, reflection, calm.

Green

Positive: Harmony, balance, refreshment, universal love, rest, restoration, reassurance.

Violet

Positive: Spiritual awareness, containment, vision, luxury, authenticity, truth, quality.

Pink

Positive: Physical tranquillity, nurture, warmth, femininity, love, sexuality, survival of the species.

As discussed above, mindfulness is a continues joy. Here, deep green line is used for the deep green color has an emotional affect on generating joy & emotional strength. Because deep green contains more blue color inside, thus, besides the basic meaning of green, the impact of blue color is stronger indicating the Mindfulness contains more coolness, serenity and calm. For happiness, light green is applied for it is a brighter green with more yellow added compared to deep green, meaning that the yellow is playing the role of adding the optimism, confidence and creativity, which are reasons of happiness.

VISUAL DESIGN

VISUAL DESIGN Visually showing the application's interface is effective and exciting for users always come back to SEVA. SEVA has been revised 4 times from the very begining, in terms of the visual designs.

55 3

56 12

Visual Design

Design Guideline

Moodboard

Typography

Colors

CURRENT TEXT STYLES OF SEVA

COLOR PALLET OF SEVA

h1 SEVA Heading 1 Quicksand Bold 40Px

PRIMARY COLORS

SECONDARY COLORS

MENU(414 Ã&#x2014; 76px)

ICONS

h2 SEVA heading2Quicksand Bold 26px h3 SEVA heading3Quicksand Bold 25px h4 SEVA heading4 Quicksand Bold 20px h5 SEVA headin5Quicksand Bold 12px

Text

76px

26px

132px

26px

132px

82px

414px

26px

132px

26px

132px

BUTTONS

SEVA is currently using Quicksand as the system fonts. Quicksand Bold is used for headers, texts of the tab bar and sub menus, in various weights, for blocks of text and single text.

SEVA is currently using a pale light green color pallet, for the reason that green gives people a calm, refreshing feeling. Yellow and light purple are the secondary colors which stand for optimistic emotion and physical tranquility.

TECHNICAL BUILDUPS

Development

CODING DEVELOPMENT

Framework

HTML5

Bootstrap

CSS3

Jquery UI

Visual Development

Howler. js Jquery Mobile

Chart.js

AI Sketch Adobe XD

59 3

TECHNICAL BUILDUPS Timer

Tracking Chart

SITEMAP

DESIGN HIGHLIGHT Choose Time Duration

Meditate

Choose Current Feeling

Start New Meditatio n

Choose Music NO

YES Walkthrough Tutorial

FinishFinish Meditatio n Meditatio n

Timelin e Happiness

Track

Dashboar d

Focusing

Mindfulness

Submit Rate Feelings

Retake

Group 1 Group

...

Group Members

Group n

Meditation Durations

Next Meditatio n Time

Add Friends

Add Groups

BIBLIOGRAPHY Michael Segalla, Catalin Ciobanu, Dominique Rouzies, Ph.D. Vincent Lebunetel. "Global Business Travel Builds Sales and Stress. "September 2009. Business intelligence - business analytics. <http://whatis.techtarget.com/definition/PlutchiksBrenner, Joanne. (2013) "Pew Research Center's Internet & American Life Project." http://pewinternet.org/Commentary/2012/March/PewInternet-Social-Networkingfull-detail.aspx

Colour Affects, 908 Keyes House, Dolphin Square, London.

Margaret Rouse. "Plutchik's wheel of emotions. "September 2012. Business intelligence - business analytics. <http://whatis.techtarget.com/definition/PlutchiksWheel-of-Emotions>.

Bricker, Jonathan B. (2008) "Who Has Air Travel Stress? Demographic Differences in Air Travel Stress. International Journal of Applied Aviation Studies. US Federal Aviation Administration Academy. Oklahoma, OK. Vol. 8, Number 1, pp. 21-35.

THANK YOU.