Pedaler_Final Thesis Project

Page 1

PEDALER | FINAL THESIS PROJECT

WEB DEISNG & NEW MEDIA


PEDALER | FINAL THESIS PROJECT

Table of Contents 1 Project Overvview. . . . . . . . . Autobiography. . . . . . . . . . . . . . . . 02 Résumé . . . . . . . . . . . . . . . . . . . . 03 Statement of Interest . . . . . . . . . . . . . 04 Elevator of Pitch. . . . . . . . . . . . . . . 05 Thesis Abstract . . . . . . . . . . . . . . . . 06

2 PROOF OF CONCEPT . . . . .

Target Audiences. . . . . . . . . . . . . . . 46 UX Testing Timeline . . . . . . . . . . . . . 48 Card Sorting. . . . . . . . . . . . . . . . . 50 Low-fidelity Wireframes 1. . . . . . . . . . 54 Low-fidelity Wireframes 2. . . . . . . . . . 58 Low-fidelity Wireframes 3. . . . . . . . . . 59

6 UI PROCESS . . . . . . . . . .

Concept Video. . . . . . . . . . . . . . . . 16

App Ideation. . . . . . . . . . . . . . . . . 61

Prototype . . . . . . . . . . . . . . . . . . . 16

Moodboard 1 . . . . . . . . . . . . . . . . . 61

Information Architecture. . . . . . . . . . . 17

Visual Inspiration 1 . . . . . . . . . . . . . . 62

Task 1 . . . . . . . . . . . . . . . . . . . . . 16

Moodboard 2 . . . . . . . . . . . . . . . . . 62

Task 2 . . . . . . . . . . . . . . . . . . . . . 18

Visual Inspiration 2 . . . . . . . . . . . . . . 62

Task 3 . . . . . . . . . . . . . . . . . . . . . 26

Logo/Identity. . . . . . . . . . . . . . . . . 63 Color Palette & Typography. . . . . . . . . 66

3 MARKET REASERCH. . . . . . Cycling Market Analysis. . . . . . . . . . . 31 Outdoor Participation Analysis . . . . . . . 32

Design Guideline . . . . . . . . . . . . . . . 67

OVERVIEW

Style Guide . . . . . . . . . . . . . . . . . . 68 Assets . . . . . . . . . . . . . . . . . . . . 69

Mobile Usage Research. . . . . . . . . . . 33

4 STRATEGIC PROCESS. . . . .

7 TECHNICAL PROCESS . . . . . Data Diagram. . . . . . . . . . . . . . . . . 72

Unique Position . . . . . . . . . . . . . . . 36

Open Source Specification . . . . . . . . . 74

Competitive Analysis . . . . . . . . . . . . . 37

Technology Used. . . . . . . . . . . . . . . 78

Competitive Analysis Matrix. . . . . . . . . 44 Inspiration Products. . . . . . . . . . . . . 44

5 UX PROCESS. . . . . . . . . . Experience Map. . . . . . . . . . . . . . . 45 User Research. . . . . . . . . . . . . . . . 45

8 CONCLUSION . . . . . . . . . . Thesis Process Conclusion. . . . . . . . . 80 GDS Journal Highlights . . . . . . . . . . . 81 Bibliography. . . . . . . . . . . . . . . . . 82

Content Map. . . . . . . . . . . . . . . . . 46

WEB DEISNG & NEW MEDIA


OVERVIEW

FINAL THESIS PROJECT | PEDALER

ABOUT ME

PORTFOLOP

AUTOBIOGRAPHY For me, life is always fill with creatives and adventures. My name is Joe. I was born and raised in south part of China. I completed my bachelor degree from Art Education department in Guangzhou Academy of Fine Art (GAFA) in 2010. I have graphic design background so that I am familiar with branding,

to communicate information in the next five years. In the future, I hope I can focus my time and energy on not only learn about aesthetics but also improve my technical skills. I am looking forward to complete my final thesis project with all my passions and efforts.

printing, and package design. I was thinking to be a professional graphic designer would be my future career path. After I graduated in 2010, I worked as a graphic designer in an advertisement company. I was in the E-promotion department and this was my first time to learn how to design a website. I was in this position two years and I found that new media is becoming more popular and more functional than printing media. In future, new media has a huge potential market and play an increasingly important role. Whereupon, I changed my career path and decided to be an UI/UX designer. At the same time, I realized that I am lack of design skills and knowledge of web design and new media, so that I came to San Francisco and continue my education in Academy of Art University. During these years studying in AAU, I learned user experience concept, web technology and motion graphic. Meanwhile, I began to interesting in mobile application development, because I think that mobile application will be the most important bridge

2

3


OVERVIEW

4

FINAL THESIS PROJECT | PEDALER

5


OVERVIEW

6

FINAL THESIS PROJECT | PEDALER

7


OVERVIEW

8

FINAL THESIS PROJECT | PEDALER

9


OVERVIEW

FINAL THESIS PROJECT | PEDALER

RESUME

EXPERIENCE 2010 - 2011

PingCheng Internet Genius (China) Project: ChemeLong Hotel Website User Interface design

http://www.chimelong.com/clHotel/

Project: ChemeLong Amusement Park Website

2014

AAU WNM - Trail’s End Ranch RadioProject: ChemeLong Hotel Website User Interface design

http://www.chimelong.com/clHotel/

EDUCATION

Graphic design/Interaction design

2006-2010

Project: Medicine Website

Art Education/Graphic Design (Bachelor of Fine Art)

Graphic design/Interaction design http://www.lizhudele.com/

2012 - 2013

Freelance (China) Project: IKEA Event Video Director

https://vimeo.com/121208905

Project: PEPSI Event Video Photographer

https://vimeo.com/121210822 2014.5 - 2014.7

Cheetah mobile Project: Clean Master Internship https://vimeo.com/121208905

10

ACHIEVEMENT

Guangzhou Academy of Art (China) Guangzhou, China 2012-Present

Academy of Art University Web design & New Media (Master of Fine Art) San Francisco, CA

SKILLS Adobe After Effects Adobe Premiere Adobe Photoshop Adobe Illustrator Adobe Dreamweaver Adobe Lightroom Adobe Indesign

LANGUAGE Cantonese / Mandarin / English

11


OVERVIEW

FINAL THESIS PROJECT | PEDALER

ELEVATOR PITCH

other users experiences.

PEDALER is an application, which provides a platform for long distance bike journeys. It helps users to plan and give an over view of their bike journeys base on distance, speed, date, and description. Meanwhile bikers can track and share their cycling experiences. More than a navigation tool, PEDALER offers an interactive map for users to

easily record their own trips and view other bikers’s

Two roads diverged in a wood, and I— I took the one less traveled by, And that has made all the difference.

Robert Frost

adventures.

STATEMENT OF INTEREST Why I love cycling so much? Why am I so compulsively drawn to it? Why does cycling makes me happy in a way that perhaps tennis, or swimming, or footy can’t? As a sport, cycling boots both physical health and mental health. When I am biking, I have to keep my body balance and step on the wheel to make it move that is a great exercise for practice my body. Meanwhile, I experienced amazing views and met many other bikers during my cycling trip. For me, cycling is a not only a sport but also gave me a broad range of positive emotions when I ride. Welling, peaceful, curious, and excited. The most important is that cycling helps me to re-create myself and re-think the current life I have. While cycling helps me to release any pressures from study or work. What kind of life that I truly expected; What’s my mission and goal in my entire life.

12

13


OVERVIEW

PEDALER | FINAL THESIS PROJECT THESIS ABSTRACT / PROJECT DESCRIPTION PEDALER, which means a person who rides a bicycle. As a pedaler, I think if we have a healthy orientation to cycling we feel a broad range of positive emotions when we ride. Joy, contentment, absorbed, satisfied, accomplished, alert, calm and peaceful, confident, powerful, excited – happy. It just feels great to be on the bike! One of the most important things cycling can facilitate is meaningful contribution to something larger than you or I. More than a sport, cycling is an adventure to explore uncertain things. The number of bicyclists is growing rapidly from coast to coast. The National Household Travel Survey showed that the number of trips made by bicycle in the U.S. more than doubled from 1.7 billion in 2001 to 4 billion in 2009. After I did research about cycling marketing, I realized

PROOF OF CONCEPT

that there is a potential market to create an app for pedaler. However, the most of current outdoor social networks only have websites instead of mobile apps. It’s inconvenient for users to get information about bicycle or invite people to join their journey. Therefore, PEDALER provides an easy, convenient, and interactive way for users to upload and track their own bike adventures. Users can also invite other people to join their planned journey or browse

14

WEB DEISNG & NEW MEDIA


PROOF OF CONCEPT

FINAL THESIS PROJECT | PEDALER

INFORMATION ARCHITECTURE Introductory page

2

PROTOTYPE:

2

Explore Planning

Planning Planning

12

Log Planning in / Sign up

2

2

Planning Map

2

Planning Profile

Planning Setting

Name Filter

Location

Near by Basic Infor

Speed/Time Prepare

Pedaling

Complete

Check list Previous

Upcomming

Description

Save Basic infor Speed/Time Check list

3

16

Save

Detail Page

4

Description

CONCEPT VIDEO:

BG Image

Recording

Near by

4

Path

17


PROOF OF CONCEPT

FINAL THESIS PROJECT | PEDALER

PROOF OF CONCEPT 01. Route Tap this area to read the route

TASK 1

detail.

EXPLORE AND JOIN IN Pedalers’ ADVENTURES

Explore journals created by Pedalers’ of

02. About the trip

adventurers from around the globe. Take a look

Tap the button to read the

of the datail pages and join in the upcomming

whole content for journery

journery.

description.

03. Check List Tap the button to read more detail of the equipment check list.

04. Paths Tap the button to read more detail of the equipment check list.

18

Login

Explore

Activity

Activity

Login with Facebook or enter your email and

Explore journals created by Pedalers’ of

Click the photos on explore and get into the

Scroll to read more informations for the journerys.

password to login

adventurers from around the globe.

activity page to read the journery’s datail.

19


PROOF OF CONCEPT

20

FINAL THESIS PROJECT | PEDALER

01. Route

01-1. Route

Tap this area to read the route detail.

Tap the button to read the gradient

02. About the trip

03. Check List

04. Paths

04-1. Paths

Tap the button to read the whole content

Tap the button to read more detail of the

Tap the button to read more detail of the

Tap the button to espand and read the

for journery description.

equipment check list.

equipment check list.

journal upload by pedalers.

21


PROOF OF CONCEPT

FINAL THESIS PROJECT | PEDALER

TASK 2 PLANNING A BIKE JOURNERY Plan a new trip and publish on PEDALER to attract other bikers’ suggestions or participation.

Explore Explore journerys created by Pedalers’ of adventurers from around the globe.

22

Planning-Location

Planning-Time

Planning-Time-calendar

Planning-Route

Enter the location for your journery.

Enter the start date and planed arrivel

Tap the calendar to selcet the date.

Enter the checkpoint to finish the route

date.

for you journey.

23


PROOF OF CONCEPT

24

FINAL THESIS PROJECT | PEDALER

Planning-Route

Planning-Route

Planning-Checklist

Planning-Background Image

Planning-Description

Activity

Tap the icon to pin the location at map

You can add more locations to complete

Selcet the items for the check list to help

Selcet the images for the post background.

Write some description to explan your

Save and create a new post of your journey.

your route

you or your teammates for packing.

journey.

25


PROOF OF CONCEPT

FINAL THESIS PROJECT | PEDALER

TASK 3 RECORD YOUR JOURNALS Join in and strat your journey. Record your journal by combining your GPS trace, the photos you captured, and text you write in an interactive map.

Join the journey Tap the button to ask for joining the journey.

Join the journey

Join the journey

Start your journey

Recording

Write a message and send to the blogger.

Then wait for the blogger confirm your

Tap the button and turn into the recording page

Your path will show in the interactive map,

requestment.

and start your journey.

and you can also track your teammates locations.

26

27


PROOF OF CONCEPT

PEDALER | FINAL THESIS PROJECT

MARKET RESEARCH

28

Pause and End

Journal

Tap the Pause and End button to arrange your

Take photos and write descriptions for your

journey.

journey.

WEB DEISNG & NEW MEDIA


MARKET RESEARCH

FINAL THESIS PROJECT | PEDALER

20% People

California is one of the popular state for cyclist

21%

ride in California

173,460 People The Self-Supported bicycle Tour (Target Group)

57,000,000

People

had ridden bike in the United States, 2014

30

4,130,000 People

had ridden bike in the California, 2014

826,000 People

like long-distance bike trip, 2014

46% 379,960 People The Guided bicycle Tour

33% 272,580 People The Self-Guided bicycle Tour

31


MARKET RESEARCH

FINAL THESIS PROJECT | PEDALER

Who is bicycling?

Most popular outdoor activities

Long distance bicycle trip, as a percentage of all trips, by Age.

22.4% of people.

Outdoor Participation by long distance bicycle trip

Mobile Usage Research

Bicycling(Road, Mountain, BMX) 41000

40250

11%

22.4%

26%

39500

21%

On March 2015, Mobile web browsing has

climbed to 11.3% and desktop is only 10.6%

77.6%

40%

38750

Google says more people search with mobile than desktop)

Mobile users spent 86% of their time on

38000 (People)

32

15-24

26%

25-39

40-64

21%

65-over

40% 11%

apps on 2014. while only 80% on 2013. That

2009

2010

2011

2012

2013

(Year)

is (86-80)/80=7.5% growth compares to last year

Bicycling(Road, Mountain, BMX) Other outdoor activities

33


MARKET RESEARCH

PEDALER | FINAL THESIS PROJECT Where are people bicycling? Long distance bicycle Trips, as a percentage of all trips, by region.

New England Middle Atlantic East North Central

STRATEGIC PROCESS

West North Central South Atlantic East South Central West South Central Mountain Pactfic 34

WEB DEISNG & NEW MEDIA


STRATEGIC PROCESS

FINAL THESIS PROJECT | PEDALER

Functionality & features

User Requirements

FIND

Users that access this app are probably bikers who

View routes on a map designed for cyclists

are aim at fitness. The total time for cycling is only in

including distance and an interactive elevation

one day instead of outdoor long distances cycling.

profile. •

RIDE

Strengths •

Users can track and share their cycling trip to

by Etsy members. They can get inspirations from

other users. •

as well.

list view. It’s convenience for users to search the

routes.

Who Favorited This View routes with an interactive elevation profile.

Users can tap the gradient line to view the

The UI design and branding are not match this App. •

No Main Menu Bar Some of the buttons and icons are repeat twice which are unnecessary.

Relevance This app is relevant to my project because I was inspired by the interactive function for checking the gradience of the route. The one of main function of my project is to track and share users their own routes. Bikemap would be a great example of how to record user’s trip.

distance of the route.

• •

Curated Collection Two versions with routes, include map view and

Not Consistent

Grid-Based Layout

The users can browse curated collections created the collections and contribute to a community

Who Favorited This The main functions are simple and easy to

TRACK

understand and use.

Record users routes on the go and track distance, duration, speed, elevation gain - even your heart rate (with additional hardware). Users can sync your recorded routes with their route collections on Bikemap.net and add them to their training log

Bikemap Your bike routes

Bikemap assists users with navigation as it shows their current location on an interactive map in real time while cycling on Bikemap routes.

36

to track their progress. •

SHARE Keep users friends posted and share their routes on Bikemap.net, Facebook, Twitter, WhatsApp and email.

Weaknesses •

Request Custom Order The goal of the app is not specific and clarified.

37


STRATEGIC PROCESS

FINAL THESIS PROJECT | PEDALER

Functionality & features •

Explore the most popular segments anywhere

TRACK YOUR RUNS AND RIDES WITH GPS

you go

Follow routes you’ve created or found and view your activity map as you record Get key stats like distance, pace, speed, elevation gained and calories burned

FIND PLACES TO RUN AND RIDE

User Requirements The users of Strava are Professional bikers or the

Relevance Starve is a really great example for my project. Especially the recording page, which has clean and simple UI design. It provides many useful settings for users to record their route instead of too much click through.

people who are interest in to be a professional biker.

Collect heart rate, power and cadence data from ANT+ and Bluetooth LE sensors •

CLIMB THE LEADERBOARDS Set personal records and see how you stack up against friends, locals and pros Join monthly Challenges designed to push you further

Strengths •

Grid-Based Layout Clarified and specific Data relate to users cycling or running.

Curated Collection Nice UI and UX design of recording page.

• •

Strava

FOLLOW FRIENDS Find your friends and motivate them with kudos and and comments

GPS Run and Ride Tracker

Share your activities on Facebook and Twitter

Strava is a health app, which track your runs and

Share Instagram photos from your activities on

rides with GPS, join Challenges and see how your

your Strava profile

Who Favorited This Useful and helpful functions

Weaknesses •

Request Custom Order Some of the pages are too complicated without organized hierarchy.

Not Consistent Users have to pay for some of the functions.

running and riding compares with friends.

38

39


STRATEGIC PROCESS

FINAL THESIS PROJECT | PEDALER

Functionality & features

cycling but also hiking.

Strengths

TRACK YOUR RUNS AND RIDES WITH Schedule your running routes and pass them with a few clicks on.

All in one handy app. It provides topographic

CLIMB THE LEADERBOARDS

maps and turn-by-turn voice navigation to help

Calculate the distance, slope, difficulty and duration of your rounds. •

other runners on komoot. Improved user experience. •

FIND PLACES TO RUN AND RIDE Discover stored & proposed highlights on the map more easily.

users focus on the path ahead. •

FIND PLACES TO RUN AND RIDE Many improvements in usability and performance PS Do you like our app? Give us 5 stars, we are delighted.

Curated Collection Always know user’s speed and distance when

FOLLOW FRIENDS Draw your runs and part your highlights with

Grid-Based Layout

they are on the trip. •

Who Favorited This

Who Favorited This

Available for all devices. Offline maps without internet.

Weaknesses •

Request Custom Order Users have to pay for some of the functions.

Not Consistent The UI design doesn’t match this app.

Relevance Commit has same target audience as my project. This is nice example for me to consider how to help outdoor bikers to plan their trip and explore other

Kommot

users ’s trips.

Experience outdoor adventures komoot is a smart & simple way to experience outdoor adventures. Hikers and cyclists rely komoot, when it comes to topographic maps, precise voice navigation and tips for interesting places.

40

User Requirements Kommot is suitable for all kinds of bikers who ride mountain bike, race bike, and road bike. Not only

41


STRATEGIC PROCESS

FINAL THESIS PROJECT | PEDALER

Yonder

Yonder is an app purpose-built for sharing your red point, single track, pow shot, dawn patrol adventures with a community that’s just as psyched about the outdoors as you are.

Functionality & features •

Discover thousands of geo-located images and videos around the globe

· Share your adventures through photos and videos

· Search or browse our database of over 20,000 destinations

· Explore 25 activities

· Follow bikers, hikers, climbers, skiers and more from around the world

· Browse a feed or explore the map

· Like and post comments

· Share directly to Facebook, Twitter, email, and

Roadtrippers Roadtrippers is an application, which aims to help users to discover the best diners, scenic spots, attractions, hotels, and much more with over a million amazing points of interest.Users can plan a new trip or automatically sync their trips and saved places from their mapping site.

Functionality & features •

- Find amazing places around you, on the road

- Plan complete trip itineraries, or sync your trips

- Save places, trips, and maps for offline access

- Book hotels, and other unique stays right from

or at your destination. planned on our website. and syncing. the app •

descriptions, ratings, reviews, addresses, and

iMessage •

· Keep lists of all your favorite experiences and destinations

Yonder was made for everyone from backcountry explorers to backyard wanderers. They have the same as the target audience as I do. After I played with this App, I refined the concept of my project. I realized that I need to consider what the outdoor bikers they need and what they want to post and record when they are on the road.

42

- View rich place details such as photos, phone numbers.

- Navigate to any place by connecting your favorite navigation app

Roadtrippers includes many outdoor activities, such as camping, hiking, surfing,etc. I was inspired by their wonderful interactive actions. It’s easy and clear to browse different categories with their customized icons. Also, it Alerts you to cool stuff to see on an already planned road trip. Additionally, it shows time and mileage from place to place.

43


STRATEGIC PROCESS

PEDALER | FINAL THESIS PROJECT

UX PROCESS

44

WEB DEISNG & NEW MEDIA


UX PROCESS

FINAL THESIS PROJECT | PEDALER

PRIMARY

SECONDARY

Self-supported

Unexperienced / Unfamiliar

Experienced bikers

Self-guided / guided

There are three main types of bicycle tours. My primary

Some of these people are fit or have day trip experience.

THE GUIDED BICYCLE TOUR

target audience is long-distance and self-supported

Unfamiliar with predesigned cycling path, make tour

Long distance 18-32

any distance 18-32

A guided bicycle tour is a type of bicycle touring

THE SELF-GUIDED BICYCLE TOUR

THE SELF-SUPPORTED BICYCLE TOURA

users. They have long distance or fitness cycling

plans. These people ask others to make tour plan,

in which you pay to be escorted along a pre-

A self-guided bicycle tour is similar to a guided

Finally, there is the self-supported bicycle tour,

experience that familiar with long-distance cycling,

prepare their equipment,etc. Some of them have no

designed path by an experienced bicycle touring

bicycle tour in that the route, lodging and

which requires you to travel alone (without a

pre-design cycling paths, clothes, equipment and are

any cycling experience and are willing to have a long-

guide or company, and your belongings (such as

meals have all been taken care of for you by

guide) and carry all the clothing, tools, and

preparing food.

distance cycling experience.

your food, clothing, toiletries, etc.) are carried in

an established bicycle touring company. The

gear you need to survive for days, weeks, or

a vehicle that meets you at various checkpoints

difference, however, is that on a self-guided tour

months on end. This type of bicycle travel is also

They are looking for an App can help them to plan their

They want to look at finished paths and tour information

along your route.

you will not be joined by an experienced bicycle

commonly referred to as “traditional bicycle

own path and post their created path to invite more

to help them plan and prepare their equipment,etc. Then

Guided bicycle tours range in size from 2 to

touring guide. Instead, you must navigate a pre-

touring” or “fully-loaded bicycle touring.”

bikers join their cycling tour. Also, they can track their

browse current paths posted by experienced bikers and

20+ people, with tour participants often times

designed course on your own, while carrying

While your food, route details and lodging are

cycling process and share information during the tour.

join in-on their tours.

coming from a number of different countries all

whatever belongings you might have with you on

all taken care of for you in advance by a touring

around the world.

your bicycle (although some self-guided bicycle

company on both guided and self-guided bicycle

tours will transport your luggage each day from

tours, self-supported bicycle touring require you

one hotel to the next).

to figure out all of these details on your own – either in advance or once you get out there on the road.

46

47


UX PROCESS

EXPERIENCE MAP

FINAL THESIS PROJECT | PEDALER

Persona 1: Experienced

“My dream is to travel the world by ridding bike. ” LOG IN Name: Alex Robertson Age: 35 Gender: Male

EXPLORE

Occupation: College instructor Location: Berkeley, CA Activities: Hiking, climbing, camping

DETAIL PAGE

User Scenario Alex is a bike riding enthusiast. Work as a geography instructor in the college. He has

PLANNING

professional knowledge about nature and geography. Alex likes outdoor activates, such as hiking, camping, especially cycling. He had many amazing bicycle touring experiences before, so he is planing to have a new bicycle touring during his summer vacation. Finally, he decided the destination is Yosemite. He checked the current paths posted by other users, but he doesn’t like any of them. He wants to create his own path and invite other users to join him. Bike usage: 30hours/week Experience: From San Francisco to Los Angeles

Location Speed/Time Check list Description BG Image Save

DETAIL PAGE

Goals

48

Check current paths and info.

Post new path and invite people to join in.

Meet bike trip folks just like he is.

49


UX PROCESS

FINAL THESIS PROJECT | PEDALER

Persona 2: Unexperienced

Persona 3: Unfamiliar

“I hope I can do something unique that I will be proud of myself ”

“I would like to use camera to catch movement. ”

LOG IN

Name: Michelle Smith Age: 23 Gender: Female

Name: Jack Noble Age: 29

EXPLORE

Occupation: Freelance tattoo designer

Activities: Yoga, Cycling, traveling

User Scenario Michelle loves work out, healthy life style, and willing to adventure something she has never experienced before. As a fitness guider, Michelle always rides

Location: Santa Cruz, CA

CLICK ON FI LTER

Activities: Photography, travling, surfing.

User Scenario Jack is a freelance tatoo designer lives in Los

SORT THROUGH PRE PARE

Angles. He likes traveling and photography. Jack had several wonderful guided bicycle tour

experience a real bicycle tour to Yosemite. However,

for the current designed path and join them as a

EXPLORE

Also, in order to make this tour unforgettable, he

ROUTE

Bike usage: 10hours/week

ABOUT

Experience: From home to dowtown

Goals •

Browse current paths posted by other users

Find a current designed path and join.

Meet experienced “pedalers”

Look for tips and suggestions for preparing

CHECK LIST

ASK FOR JOIN IN

PHOTO

is looking for a way to combine all the photos he

DETAIL PAGE

team member.

RECORDING

wants to challenge self-support cycling this time.

she doesn’t know how to design a cycling path and prepare all the equipment, food, etc. She is looking

CLICK ON START

experiences with his friends before, so he really

exercise bike in the gym but she never has realistic cycling experience. In this summer, she decided to

UPCOMMING JOURNERY

Gender: Male

Occupation: Fitness guider Location: San Francisco, CA

PROFILE

captured and text he wrote during his journey

TEXT

Bike usage: 8hours/week

INFO

Experience: From Santa Cruz to Santa Brabara

Goals • • • •

Find a current posted path and join in Check other user’s posted Info Meet bike lovers just like he is Find a way to record and save those gorgeous memories during the tour

PATH

equipment, food,cloths,etc.

50

51


UX PROCESS

FINAL THESIS PROJECT | PEDALER

PHASE

52

TIME

PARTICIPANTS

PROTOTYPE

Interview

Sep/2014

16 participants (STREET INTERVIEW)

Survey

Paper Prototype (1st draft)

Oct/2014

6 participants (GDS: UX CLASS)

Test with paper

Paper Prototype (2ed draft)

Nov/2014

5 participants (UX WORKSHOP)

Printed wireframes

Hight - Fidelity paperprototype - A

Feb/2015

10 participants (GDS: VISUAL CLASS)

Invision App https://invis.io/B41O5UKHE

Hight - Fidelity Invision - B

Mar/2015

5 participants (UX WORKSHOP)

Invision App https://invis.io/DJ54K4ZB9

Hight - Fidelity Invision - C

Mar/2015

5 participants (UX WORKSHOP)

Invision App https://invis.io/DJ54K4ZB9

Final Testing

Sep/2015

5 participants

Website dazhourong com/Pedaler/index html

53


UX PROCESS

FINAL THESIS PROJECT | PEDALER

MEDPOINT WIREFRAMES

Explore

Activity

Activity

Activity-Filter

Recording

Explore journals created by Pedalers’ of

Click the photos on explore and get into the

Scroll to read more informations for the journerys.

Enter your request to filter more posts.

Your path will show in the interactive map,

adventurers from around the globe.

activity page to read the journery’s datail.

and you can also track your teammates locations.

54

55


UX PROCESS

FINAL THESIS PROJECT | PEDALER

LOW-FIDELITY WIREFRAMES 1

Explore

Activity

Activity

Activity-Filter

Recording

Explore journals created by Pedalers’ of

Click the photos on explore and get into the

Scroll to read more informations for the journerys.

Enter your request to filter more posts.

Your path will show in the interactive map,

adventurers from around the globe.

activity page to read the journery’s datail.

and you can also track your teammates locations.

56

57


UX PROCESS

FINAL THESIS PROJECT | PEDALER

HIGH-FIDELITY WIREFRAMES 2

58

Explore

Activity

Planning-Route

Route

Profile

Explore journals created by Pedalers’ of

Click the photos on explore and get into the

You can add more locations to complete

Tap this area to read the route detail.

Here is the profile page

adventurers from around the globe.

activity page to read the journery’s datail.

your route

59


UX PROCESS

PEDALER | FINAL THESIS PROJECT

UI PROCESS

60

WEB DEISNG & NEW MEDIA


STRATEGIC PROCESS

62

FINAL THESIS PROJECT | PEDALER

63


MARKET RESEARCH

64

FINAL THESIS PROJECT | PEDALER

65


UX PROCESS

66

FINAL THESIS PROJECT | PEDALER

67


UX PROCESS

68

FINAL THESIS PROJECT | PEDALER

69


UX PROCESS

PEDALER | FINAL THESIS PROJECT

TECHNICAL PROCESS

70

WEB DEISNG & NEW MEDIA


UI PROCESS

FINAL THESIS PROJECT | PEDALER

VISUAL DEVELOPMENT

PROGRAMMING

DEVICES

MAP

72

73


UI PROCESS

74

FINAL THESIS PROJECT | PEDALER

75


UI PROCESS

76

FINAL THESIS PROJECT | PEDALER

77


UI PROCESS

PEDALER | FINAL THESIS PROJECT

CONCLUSION

78

WEB DEISNG & NEW MEDIA


CONCLUSION

FINAL THESIS PROJECT | PEDALER

Conclusion More than a sport, cycling is an adventure for exploring uncertain things. The number of “pedalers” is growing rapidly from coast to coast. However, there are just a small group are self-supported pedalers. I think there is a huge potential market to create apps or tools for self-supported pedalers. I hope “Pedaler” would be a truly useful app for users to make their bicycle tour unforgettable. As a pedaler, I have to ride my bike to experience ever moment. Ever step on my way contains joyful, loneliness, and effort. Same as doing my Final project, it has been a Fmemorable process doing my final thesis. I will never forget the days I spent in the lab and the teachers and classmates who gave me a lot of supports and feedback. I am so happy to see the final design. In the future, I will continue refining the app to make it more useful and professional. Also, I hope I can find collaborative opportunity to promote my project and launch it as a commercial product.

80

81


CONCLUSION

PEDALER | FINAL THESIS PROJECT

Bibliography Market Research *thisbigcity.net/green-cities-better-bike-lanes *thisbigcity.net/green-cities-better-bike-lanes *http://bicycletouringpro.com/blog/types-of-bicycle-tours/ Prototype *https://invis.io/B41O5UKHE *https://invis.io/DJ54K4ZB9 Product Site *dazhourong.com/Pedaler/index Concept Videp *youtube.com/lattejoe/244326532

82

WEB DEISNG & NEW MEDIA


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.