Portfolio dan wu

Portfolio

Dan Wu

Portfolio by Dan Wu

My Brief Introduction

Portfolio by Dan Wu

Newly graduate from MSc Human Centred Systems in City

University

Worked in Alibaba.com(Equivalent to Ebay) as a junior product

manager for one year

Exposed to a stat-up of fashion and brand

A junior user experience designer with analytic insight, curious

mind and easy-going personality

See LinkedIn references

uk.linkedin.com/in/danwu101

Project Menu

Portfolio by Dan Wu

• Commercial experinece-Alibaba.com

• University project-tfl.gov.uk usability evaluation

• Star-up project-fashion and brand start-up

• University project-UCD mobile grocery shopping list

Alibaba.com

Portfolio by Dan Wu

Background

Worked as a junior product manager

for one year in product

management of search centre in

Alibaba.com

My role

Evaluation

Manage product development

Product strategy

Product marketing

Analyse product requirements

user research

Stakeholder meeting

Achieve

Knowledge of digital products

Experience of product

development

Ability to manage project

Alibaba.com

Portfolio by Dan Wu

Product development

User interview and survey

Design questionnaire

Writing reports

Work across different team

Communicate with

different teams

Organize project kick-off

Sketch skills

Create wireframe to

illustrate ideas

• User feedback

• Schedule presentation

• sketch

TFL Usability Evaluation

Portfolio by Dan Wu

Background

Evaluate if TFL (Transport for London) website was ready for 2012 Olympic games to serve services

for London tourists

Website: http://www.tfl.gov.uk/

My role

Plan and conduct test

Conclude results

Write reports

Achieve

Experience of usability testing

Ability to conclude and present usability problems

Ability to provide design recommendation

http://www.tfl.gov.uk/


Portfolio by Dan Wu

Results

All 3 tasks’ completion rate are 80%

But it took more effort to find ticket price and road information (Page view

numbers > Standard setting)

Goals

To find out usability problems

To increase user experience

Test

Journey plan

Ticket inquiry

Road information

Metrics

Task completion rate

Page view numbers

Satisfaction rate

Method

Think aloud

5 participants

Participants characteristic

Experience in London Transportation:

number of times

English level: Basic communication

Technology level: 3 years computer

experience

Living Region: Inside and outside

London


Portfolio by Dan Wu

Explanations

Participants made twice page

view numbers as it’s required on

task 2

Participants’ subjective rating

was lower than average on task

2

Participants who live outside

London confused by oyster

card

Participants who travel London

infrequently had no knowledge

of jargon, like zones

Two Participants tried to check

ticket fare from journey planer

• TFL ticket pages

Problem 1- Participants found it difficult to find ticket fares for

different travel options


Portfolio by Dan Wu

Recommendations

Integrate fare information

with journey plan function, in

which case user can gain

knowledge of ticket price related

to transportation options.

Replace static table on the

fare pages to dynamic search

functions so that user can filter

criteria to find results

Refine label of ticket pages to

be more targeted and clear to

help visitors navigate

• Sketch of recommendations


Portfolio by Dan Wu

Explanations

2 of the 5 participants made 11 and 14 page views compared to the standard number 5

Participants’ subjective rating was 2 on task 3 which was the lowest of all the tasks

More than half of the participants had been lingering the website to find targeted

information

Numbers of clickable links displayed on one page and disordered information structure

caused participant’s time to look for information in need (task 3.1, participants felt

frustrated in looking for congestion fee)

Problem 2 - Participants found it difficult to navigate through the website to

look for information (Graph indication on next page)


Portfolio by Dan Wu

Recommendations

Structure the information

reduce clickable text and refine label

names

Analyze data to find out most used

information and prioritize the content

by lifting display position and design

highlight

Suggestions

• No.1 shows information to different audience is placed under the same category--Suggest to remove the sub-category to a particular developer page

• No. 2 shows category and its sub leads to same page and applies same function--Suggest to remove the sub-category and rename the category as “search for a tube station”

• No 3 and 4 show similar contents take part of majority places--Suggest to restructure the sub-category and integrate similar content on one page

• No 5 shows the problem of necessarity to expand all the sub-categories that less frequently used--Suggest to hide the sub-categories.

• TFL ticket pages

• Recommendation indication

Back to Menu

Fashion and Brand Platform

Portfolio by Dan Wu

Background

This is a project for a start-up dedicated to introducing British brands and selling British products to Chinese market.

Content oriented ecommerce website

My role

To establish key audiences

To validate the value proposition

To prioritize products features

To design a wireframe

Works

Chinese customer survey and market report

User persona and scenario

Report of comparison of online shopping design between China and UK

Low and high fidelity wireframe of the website

Achieve

Skills of Visio, Axure, Photoshop

Experience of business development

Knowledge of fashion and brand


Portfolio by Dan Wu

To establish Key audiences, I have done

market research

Customer survey research

Search and translate authorized reports

Modify personas and storyboard

Value proposition

What’s new in the market and also matches my style?

How can costumers purchase it?

Persona Professional Chinese woman aged from

25-35

• Research reports and consumer feedback

Portfolio by Dan Wu


• Scenario of meeting with people

3 Scenario

Browse content in time

clip (Picture content)

Purchase inquiry and

decision ( Product

purchasing information)

Share content and

inform friends (Social

networking function)

Portfolio by Dan Wu

Homepage

Wireframe

Carousal banner

Picture oriented

content

Picture content

detail

“Like it” to

collect

Making list while

there is function

to share on social

networking


Banner

Product

Line

• Interaction prototype of homepage

Portfolio by Dan Wu

Product detail page Social elements and lifted

selected comments encourage

social interaction

Buying information: hyperlink

of “where to buy”


• Prototype of product detail

Portfolio by Dan Wu

High fidelity wireframe Homepage

Picture Content oriented

Red and grey colour scheme

Dual language on main navigation

Social elements


• High fidelity wireframe of HP

Portfolio by Dan Wu

Article pages Comment can be shared

within social networks

conveniently

Single Brand page With brand story

Related articles

Related videos

Introduce brand insight to

audiences


• High fidelity wireframe of article page

Back to menu

UCD design of mobile grocery shopping list

Portfolio by Dan Wu

Background

This is an individual final project for master degree to design an application to facilitate

grocery shopping. I designed a mobile wireframe for creating shopping lists. This project

achieved 62 marks.

My works

User centered design

User research

Conceptual design

Wireframe

User testing

Achieve

Skills of user research

Experience process of user centered design

Skills of mobile design


Portfolio by Dan Wu

User Research

Method

10 female shoppers

Age 25-50

All shoppers went to supermarket

3 had experience on grocery online shopping

Qualitative one to one interview

Conducted in shopper’s home or new supermarket

Semi-structured contextual research


Portfolio by Dan Wu

Discovery – Online Shopping Situation

All the interviewers had one or two preferred supermarkets which they visited

most frequently

Online grocery shopping is not a primary choice

Conclusion: Deficiency of business service cannot be effectively solved by UI design

solution.

―I probably should do that on line but for vegetables things like that, it’s

not always what you pick up‖---Participant 4

―I don’t like the slot of time for waiting. I think it’s not convenient.‖ ---

Participant 2


Portfolio by Dan Wu

Discovery – Goals for Shopping

Most grocery shopping was prepared for meal and they find it’s a bit

troublesome to plan all the meal for everyday

Conclusion: Insufficient inventory is a trigger of grocery shopping behaviour that closely

relates to everyday meal

―I should do better organise for planning what we are going to eat and buying

ahead. But again sometimes it defeats me I can’t think that ways. How can I

find what we are going to eat every single day? It’s probably why I end up

doing it every day‖--- Participant 4

―I don’t make shopping list before going shopping. Why not? Because I eat

very boring food, I eat same things all the time‖ ---Participant 5


Portfolio by Dan Wu

Discovery- Plan before Shopping

Most of shopper’ shopping was routine and regular

Plan before shopping in order to save time and avoid unnecessary spending

Conclusion: In the process of grocery shopping, plan is an important part

―I look up the fridge and cupboard to check before I confirm the order. I need

to visualize my stuff at home and I need to think what I want to cook for my

kid. I need to think about what they had and what they will have next‖—

Participant 8

―If you haven’t got a list, you are wandering around the shop. You buy things you

don’t need. Then I choose to buy extra stuff on my decision‖ ---Participant 6


Portfolio by Dan Wu

Discovery – Usual Products

Every time on regular grocery shopping, there are recurred items on shoppers’

lists

Conclusion: Usual products recur on shopping plan/ list

I have a lot of regular food, like rice, bread, eggs – Participant 2

I will do the cleaning, detergents, toilet roll , tins of food these sorts of things on big

shopping. Unless I see things I like I would buy it, it is just tea, coffee, sugar normal

things. It’s just regular things on my list – Participant 6

Portfolio by Dan Wu

Discovery – Mobile

Shoppers will choose the most convenient form at hand to make note

Shoppers will use audio to input items on the phone when they are in rush

Shoppers use shopping list as external memory

Conclusion: Mobile device is a convenient option to use shopping list and audio

input can be used to reduce input effort


―5 minutes before I going out in case I forgotten. Just before I got into the car or sth like

that.(Just want to mark down something quickly) Or my son will do it. Here I am going

to shopping and he might need something and he just talk to the phone.‖ --Participant 4

―I made on the piece of paper or made on the phone.‖--- Participant 6

―In the shop, I will look at my list on the phone and then put it back. And I shop eggs,

coffee, tea and then I look at it again. If I forgot something I just come back to it‖ ---

Participant 6


Portfolio by Dan Wu

Design solution

Design a mobile app to input, store and read shopping list conveniently

Features

Priority functions

Usual products list

Recipe search- standardize items

Share

Incentives

Offer information

Add value

Audio input

Portfolio by Dan Wu

Task Analysis

Analyse user tasks

Use Visio for flow drawing


Portfolio by Dan Wu

Wireframe

Shopping list

Create shopping list

View and edit history

shopping list by

occasion

Smart input grocery

items


• Steps to create shopping list

Portfolio by Dan Wu

Usual list

Input items by usual list

(usual products stock page)

Usual list is maintainable

Usual list is able to

accelerate shoppers input

speed and help shoppers

maintain lists easily


• Steps to add items from usual list

Portfolio by Dan Wu

List page

Tap the item once

for check out

Tap the item twice

for product detail


• Display of list

• Display of product detail

Portfolio by Dan Wu

Meal Plan

The navigation flows from high

level information to detail.

By providing recipe content, the

app help users to make better

meal plan.

Picture conveys rich information

of ingredients and what the dish

looks like. It is important to

show despite the limited space.

Elevating cooking time is able to

reveal the degree of difficulty of

making a meal.

UCD design of mobile grocery shopping list • Steps of browse recipe

Portfolio by Dan Wu

Recipe Items

Standardize and integrate ingredients

on each recipe

Shopper can easily add items to

shopping list


• Ingredients display of recipe

Portfolio by Dan Wu

Offers

Offer is on list display and this

page highlights the relevant

discounts

Users can add offers to

shopping list and they will

display as normal item.

Users can select supermarket

to receive offers by setting

Providing offer information is

an additional incentive for

users to use this product


• Steps of choosing offers

Back to menu

Thank You

Portfolio by Dan Wu

Portfolio dan wu

Documents

Transcript of Portfolio dan wu