Portfolio2020

Yanwei Miao - User Experience Porfolio | 2020

- 2020 -

GlocalMe

/ Needs Analyse

/

User Experience

/

/ /

Interaction Design

/ Iteration

GlocalMe

GlocalMe Connect

GlocalMe and GlocalMe Connect are two main mobile applications of uCloudlink that aim to provide GlocalMe portable Wi-Fi device and GlocalMe inside mobile phone holders a more convenient service that keeps them under control over their devices and internet usage.

App Store

I t e r a t i o n s

GlocalMe

GlocalMe Search

GlocalMe Balance

Device

Remaining

888GB

Tools

Package

Recommand Recommand

Account

Store

Destination Local

Search

Device

Settings Home

v1.0

v2.0

Device

v3.0

ProďŹ le

R e p o n s i b i l i t i e s

As the only interaction designer in the team, I had to take the lead in addition to the output of the interaction design. The requirements from all departments come to me through the product manager, I also take some of the responsibility for analysing the requirements, finding the best way to realise them, and pulling the various departments together before proceeding to the design. I've been involved in 3 big versions of the app, from the initial v1.0 basic monitoring app, to v2.0 tool-based app with device full management functionality, to the v3.0 open market app that can gradually support the company's marketing business.

F u n c t i o n a l i t y

Search destinations

Small network tools

Buy data packages

Sign up / sign in

Monitor data usage

GlocalMe v3.0 Manage account

Monitor internet status

Switch data packages

Manage device / Initiate connection Manage orders

GlocalMe app / GlocalMe Connect app

Promotions

Developing Developed

M a i n

F l o w Guide to buy a package

START

Bind device

Signed in?

Select destination

See available data packages in this destination

Y

Enter device IMEI and PWD

Select a suitable data package

End

Device in the account

Signed in?

Y

Bound a device?

Y Y

Sign in / sign up

Device uses data package

End

Connected to device Wi-Fi?

Y

Guide to bind a device

Device is turned on and in the destination?

Manage the device

Data package in the account

End

Pay

Connected device

2

Data protection

On

Slot management

VSIM

Reboot device

S o m e

I n t e r a c t i o n

D e s i g n s

Turn off device

Factory reset

Device name

Manage Device

My U2

Authentication

My U2

VeriďŹ ed

User Manual IMEI

The app communicates with the device through the WiFi signal sent by the device.

893737382374353095

Unbind Day Pass for Austria

802MB

Home

Remaining

Online

Wi-Fi name

Wi-Fi password

Pay as you go

Connected device

Data protection

50%

GlocalMe_0001

123456

On

2

On

Device

ProďŹ le

Data Package Demonstration Austria Card design that shows only the

Unlimited data package

information users care most of a data package: 1. Types of the data package 2.

Data volume 3. Validity 4. Price

Package Detail

Promotion

Day Pass

Monthly Pass

10GB high speed

10GB high speed

EUR 0.99 EUR 1.99

EUR 0.99

Online Support

Day Pass for Austria (10GB High Speed/Day) EUR 0.99 EUR 1.99

Data

10GB high speed

Validity

1 day

Yearly Pass 10GB high speed/mo

‌

Promotion

EUR 0.99

%

High speed data package 5GB

10GB

7 days

30 days

EUR 0.99

EUR 0.99

Regional data package Europe 10GB 7Day Package

Global 58 Countries 10GB 7-Day Package

EUR 0.99

EUR 0.99

50% Off on Mother’s Day

Amount

1

Coverage Europe: Austria

Regulations Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.

Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Duis aute0.99 irure dolor in reprehenderit in voluptate EUR Buy Now velit esse cillum dolore eu fugiat nulla pariatur.

Excepteur sint occaecat cupidatat non proident,

O u t p u t

- 2016 -

Enabling trust in Autonomous Vehicles

/ Research

/

User Experience

/ /

Interaction Design

This project was a collaboration with Jaguar Land Rover in developing a concept on how to enable trust through interaction design regarding autonomous driving. Many predict that full autonomous vehicles are something that we will expect to see as mainstream on roads by 2030. During the next five, ten and twenty years, there will significant research and development advancement into how this will look and feel. This is a group project with a multi-cultural team, we were all involved in every stadge of the research and design delivering process.

R e s e a r c h

M e t h o d s

Secondary

Primary

Visit to JLR

Survey

Focus Group

Interviews

Research

Research

Dealership

Target Users

Discussion

Target Groups

Online research and subjective group research into the automotive industry and future trends

Contextual, qualitative research

Visit to Sturgess Jaguar Land Rover dealership interviews with staff members and experienced the latest JLR vehicles

Quantitative Research

Semi structured group discussions with our target user age group

Eight Interviews conducted with both target group and expert researchers within the field autonomous vehicles

Data Analysis

Userbility testing

Interview with experts

Visit to JLR dealership

I n s i g h t s

t o

O p p o r t u n i t i e s

Insights

Humans are bad passive monitors

Opportunities

To design a system which communicates clearly and qucikly trust and security

In L3 - You are taking the primary control

To ensure the system is ahead of and more

away from the human

intuitive than the user

Keeping the driver aware is one of the main

The driver needs to see only critical

challenges

information, leave out the rest

Users are discouraged in systems too

Use heuristic principles to help users feel

technical, they want to take control back as

more familiar with real world objects, to

that feels more familiar

enable feelings of control

P e r s o n a

2016

2030 (Future Projection)

Michael - Student

Michael - Haptic Programmer

21 years old

35 years old

Needs: Strong wifi signal

Frustrations: Slow drivers

Frustrations: Slow drivers

Experience Goals: To be able to work from

Experience Goals: To buy his own car

his car during his journey into work.

S c e n a r i o s

As we learned from JLR, they are trialling an autonomous L4 car using a designated autonomous lane.

As we were aware that this was a reality, it was safe to assume that an autonomous lane will be in place and used in L4 vehicles by 2030. With this in mind we devised a scenario whereby the driver of an L3L4 vehicle can move in and out of the autonomous lane.

1.

2.

3.

4.

The use of a physical button

The introduction of a

There needs to be a

Once a driver is back within the

helps the driver feel more

handshake - a communication

handshake principle again

manual lane, there will be a

connected and in control of the

between two vehicles much

when the car wants to move

take-over-request (TOR),

vehicle when the driver

like a computer system is

out of the autonomous lane,

needed so the driver is fully

changes the mode from

needed so the process of lane

back to the manul lane and

aware of the current situation.

manual to autonomous driving.

moving becomes in sync with

also a level of security so the

all the other autonomous

driver knows that this process

vehicles around.

is about to happen.

Driving in manual mode

Change to manual mode ( auto mode is off )

︎System sensors identify hands on the wheel

︎Remind to change back to manual mode

Driving in manual lane

︎Moving to manual lane

︎Waiting for changing lane

︎Communicate data with other auto cars

︎Remind to take it over

︎Detect the distance to the end of auto lane

Driving in the auto lane

︎Moving to auto lane

︎Read data ︎ plan route

︎Communicate data begins with other auto cars

Driving in auto mode

︎Display feedback ( reminded to loosen his hands )

︎Auto mode now is on

︎Initialising auto mode (countdown from 15 sec)

Driving in manual mode

︎Set up map ︎Start

︎Plan route

SYSTEM

︎Leaves the motorwayL

︎Continues to drive in manual mode

︎Interface informs him that manual mode is now activated

︎Holds the steering wheel with both hands

︎Is informed by a countdown that he needs to prepare to take back control of the driving in xxx seconds

︎Feedback and interface visibility that the car is changing lane, out of autonomous

︎Put his work aside ︎ prepare to take it over

Receives feedback that autonomous lane will end soon

Skype meeting with his boss

Check his e-mail

See the car is changing lane

Relax and loosen his hands from the steering wheel

Receive the feedback ︎ wait for auto mode countdown

Press the physical auto button

︎Auto lane is available on route - switch to auto mode

︎Arrive at the motorway

︎Drive away from the house

︎Confirm destination ︎ route

︎Input the destination - office

︎Still like to feel in-control of his vehicle. For ︎Michael the car should work with him, this makes him trust the car more

︎Is tech savvy so will enjoy to use in-car features to help him feel more productive and the car and features more fun

︎It is important to ︎ichael that he trusts and feel safe whilst driving his car

︎Is a family man ︎ has two children

Michael

U s e r J o u r n e y

PERSONA

HOME OFFICE

LEGEND MANUAL MODE

AUTO MODE

STRESS

AWARENESS

RELAX

KEY SYSTEM STAGES

AUTO-LANE SECTION ON JOURNEY

C o n e c p t

Switching to Auto Mode User flow

Switching to Auto Lane User flow

1 4

TA

3

GA Driving in Manual Mode

Initialise Autonomous press button on

1

TA

SA

Countdown to autonomous mode from 8 seconds

1

Interfaces remind to loose hands

Moving to Autonomous Lane

All Interfaces consistent and displaying that auto mode is on

Autonomous mode now working & on

2

SA

SA

IA

Interface/steering wheel reminder by blue light going around car will be initialising auto mode

Take Over Request (TOR) is currently 5-8 seconds We have emphasised this for trust purposes

2

Countdown to autonomous lane from 8 seconds using dashboard Interface and steering wheel

Interface confirms autonomous lane has been alerted to you moving into it

(This is to show there is communication between autonomous cars see lane map)

SA

Car moves into auto lane

Auto Lane Displayed

(Feedback - reinforces trust and safety) 4

GA

IA

No.2 Acknowledges the information and interface alerts user to new lane configuration

4

IA

3

Handshake

Comupter no.1 sends information to conputer no.2 indicating a move to autonomous lane

Current Lane positioning

SA

Interface displays a planned route

GA

Interface displays the auto cars around you

1

TA

3

1

(Usability principles Affordance)

2

SA Interface displays the computer is changing data with others now

Deactivate autonomous mode by turning button anti-clockwise to off

(Feedback - reinforces trust and safety)

1

No.1 is alerted to no.2 reducing speed

Safe distance is acknowledged on both of the cars interfaces

(Usability principles Affordance) 1

SA

Moving back to Manual Mode User flow 2

2

TA

TA

Handshake of communication process begins to happen to the car behind and also to any car in the manual lane which has gone into autonomous mode

Countdown to manual lane from 8 seconds using all dashboard interfaces and steering wheel

1

Car moves into manual lane

Manual Lane Displyed 3

GA Interface reminds that it is nearly the end of autonomous lane (Usability principles Visibility)

Handshake

HANDSHAKE

3

Moving from Autonomous Lane back to Manual Lane

No.2 Decreases speed to allow safe distance (3 chevrons) for no.1 moving into auto lane

4

IA

Hands are detected on steering wheel

Manual Mode is Activated

3

GA

2. SYN/ACK Computer acknowledges the information sent from no. 1

SA

No1

1. SYN Send information to computer no. 2 3. ACK Computer acknowledges computer no. 2 by conirming acknowledgement back

No2

TA 3

4

IA

GA

Initialise Manual press button to off The second method to change mode (User Control)

2

4

IA

Interface reminds to put hands on steering wheel

GA

SA

1

4

Key SYN - Synchronise ACK - Acknowledge

HANDSHAKE

IA

Situation Awareness

How the interface is communicated directly with the driver

Temporal Awareness

How a situation is changing, paired with situation awareness

Goal Awareness

How the interface alerst the driver to the overall aim and intention

Identity Awareness

The key things the driver needs to be aware of

Switching to Auto Lane

Moving back to Manual Mode

Prototype at https://www.behance.net/gallery/38197819/Autonomous-Driving Full booklet at https://issuu.com/yanweimiao/docs/booklet_blu.telescope_group_3

- 2017 -

VivaCity

/ Research

/

User Experience

/ /

Interaction Design

/ UI Design

Viva City is an app that offers global software service to help Chinese tourists enjoy dinning exerience with their most familiar habbits and languages. During the time, it focused mainly on providing services for searching, booking, ordering and sharing restaurants in London, Manchester and Birminghan. Viva City is a start up company based in London, I had close contact with the co-founders, Sam and Szelee.

I later moved to Augsburg, Germany where I worked remotely from there. We often had online meetings and used Slack to manage our tasks and to hand in our work.

App Store

M a r k e t

A Survey of the Users

&

• Ou r “V

U s e r

ivacit trans y ” ca n he lated lp Chin Wou ese m you find ld yo the p u be enu, and opula satis share fied a in additio with n, yo r restaura nd a othe ttrac u cou nts in r frie ted b Thank you very much for taking your time to complete this survey for us! the U nds? y the ld also b Ka o se fu • nctio ok a rese nd provid rva ns an e you d with be w tion thro a u illing • In o app to do gh our ap app “ Vivacity” rder w p. n to im load down o p ur ap ro load v p our a e your d inin pp? tourists This survey aims to help us understand the Dining experience in the UK for Chinese and g exp erien students, in order to make our app “ Vivacity” ( Now available ce in • in app store for iPhone ). All the the U K, w h information will be kept confidential.

• Will at oth you b er op ook a tions would reserv ation attra ct yo befo u to re go • ing?

Personal Information • Und er wh at cir cum stanc • es w ould • Gender you re serve a tab le in a res taura nt?

•

• Age

• • Occupation

Other Information

• • Have you ever traveled abroad?

• • If yes, could you tell me the inconveniences you have encountered when dinning aboard?

•

“

Vivacity” app

app

R e s e a r c h

I n s i g h t s

The way Chinese people travel has changed for the good. More and more of them are becoming FIT (Free Independent Travel) travelers instead of Group travelers. So they have different expectations now.

The problem is that the restaurants are not Chinese FIT ready.

FIT wants to‌

The problem is‌

Read content in own language

No Chinese Content & tranlate menus

Explore local cuisine

No marketing on Chinese social media

Plan & book themselves

No Chinese friendly booking platform

Pay with Alipay & Wechat Wallet

No Alipay & Wechat Wallet payment facility

C o n c e p t

Search for restaurants

VivaCity London

View menu offer

Checkout

Search for the dish you want Select all

Searach within the area Local speciality

All

Make real time booking

Hidden gems

Asian food

Michelin

Restaurant Name Name of the Product 19. Apr. 2017

Romantic

Afternoon tea

Great Views

Entertainment

Child Friendly

19:30 x

3

x

3

x

3

£ 9.00 £ 15.00 Name of the Product 19. Apr. 2017

Name of the Deal

What’s popular

A brief introduction about the deal they provide here.

£35

19:30

£ 9.00 £ 15.00

£50

Info

Menu

Restaurant Name Name of the Product 19. Apr. 2017

Cheese Burgers 1km

19:30

£ 9.00 £ 15.00

A brief introduction of the product here.

Anything the chef wants to say.

I have a Discount Code

Restaurant Name

12km

A brief introduction of the restaurant and their most popular dishes here…

Home

Near Me Deals

Discover

More

Restaurant Name British Open untill 23:00 Average Spend £25

Profile

Lemon Cola

ENTER DISCOUNT CODE

A brief introduction of the product here.

Anything the chef wants to say.

Total: £ 54.00 More

484.58

Pay Now

Pay with Alipay

ENGLISH

SIGN IN

非凡都市

Postcards

Dine like a local.

FIND A RESTAURANT

LONDON

MANCHESTER

EDINBURGH

CURATED COLLECTIONS OF RESTAURANTS

RESTAURANT NAME A brief introduction of the restaurant

VIEW MORE

Promo cards

Your UK Dining Guide Gurantee a special experience with instant booking Google Play

App Store

Viva City Follow the UK’s best dining guide and Win exclusive prizes

CONTACT

BENEFITS

FEATURES

GET APP

ABOUT US

Greeting cards