Line Cafe Redesign

Prototype &User Testing

Paper PrototypeR e d e s i g n P r o c e s s

During the redesign of LINE Café, the whole workflow of this application was studied. Based on the main target users and predesigned personas and scenarios, I made some changes focused on not only my designed user tasks but also the system optimization.

I Redesigned/01 Information structure 02 Action Sequences of Post, Comment, Open a café and Join a cafe.03 Buttons mapping and information layout.

01

- 01 -

Paper PrototypeInformation structure02

New LINE Cafe/

New Posts/ Posts List

Functions/ Search Refresh Enter posts

Explore/ Popular Cafes Cafe Categories

Functions/ Search Cafe Search Posts Enter Cafes

My Cafes/ Cafes I joined Cafes I opened My Posts My Replies Replies Noticces

Functions/ Open A Cafe Close A Cafe Manage Cafes

More/ Settings My account Help Session

Functions/ Log In Log Out

Starting with the system structure, I combined the Popular and Café Lists tabs to a new Explore tab. In the existing LINE Café, the contents of the Popular and Café Lists tabs overlapped each other. Users are able to find both contents in each tab. I also clarified the stucture of the My Cafe Tab.

- 02 -

Paper PrototypeMajor interfaces03

1 Categories make it difficult for users to enter cafes.2 Unclear navigation bar.

1 Search Button2 Browse by categories3 Cafes List

explore - Existing Version Explore - My design

- 03 -

Carrier 12:00 PM

EXPLORE

Cafe Name

Cafe Name

Cafe Name

Cafe Name

Cafe Name

iCARE

New Posts EXPLORE My Cafes More

1

2

1 2

3


1 Cafe images are hard to remember.2 Only able to disply one post with a lot of useless information

1 Search Button2 Refresh Button: or users can drag the post list to refresh.3 Post List: gives users clear intros about the post and displys four posts in a screen.

New post-Existing Version New post-My design

- 04 -

1

2

1 2

3

Carrier 12:00 PM

New Posts


Post TitleCafe Name Post TimeUser Name

Comment Amount


Comment Amount


Comment Amount

Meeting TimeiCare 8 hours agoJulia

1 reply


1 The switch tabs are not comprehansive enough to cover all sections in this tab, such as manage user’s cafe.

1 Manage Cafes2 Manage everything related to user’s posts.3 Open a cafe.

My Cafe-Existing Version my cafe-My design

- 05 -

1

1

2

3

Carrier 12:00 PM

My Cafes


Cafes I Joined

Cafes I Opened

My Postes

My Comments

Reply Notices

Open A Cafe

Paper PrototypeVersion NO.1 04 Pa p e r p r o t o t y p e

Focusing on three main functions in this application, I redesigned the action sequences of three user tasks listed below.

User tasks/ 01.Comment after a post 02.Join a cafe 03.Open a cafe

- 06 -


- 07 -


- 08 -

Paper PrototypeUser testing05 results and suggestions

- 09 -

Mia Song

20-30Visual Effects student

Felix Liu

20-30AnimationDirector

Rachel O’Connor

20-30Art History student

Karen Brizendine

20-30Animation student

Paper PrototypeUser testing05 results and suggestions

Feedback/

> The position of the open cafe button> The search Icon> Done button should be put at the bottom of the interface instead of the right top corner.> Add categories to explore tabs like Pintrest.> Tab shading.> Users s hould be able to comment after a specific reply by just typing the reply itself. > Comment button should be visibile.

- 10 -

Paper Prototype06

Based on the feedback I got from users, I changed the button mapping and some action sequences.

User testingresults and suggestions

Search Section/Users are able to search freely from both cafes and posts.

- 11 -

Paper Prototype05 User testingresults and suggestions

Done Button/Change all DONE buttons at the botton of the interface.

- 12 -

Paper Prototype05 User testingresults and suggestions

Tab Shading/Shows the current tab.

Comment/Able to comment after replies;Button kept visiable all the time.

- 13 -

Line Cafe Redesign

Documents

Transcript of Line Cafe Redesign