HNH LUU - Portfolio Interaction Design and Graphic Design

Page 1

From :

O I L O F T R PO

U U L H HN n g i s e D I UX/U

c i h p a Gr

To :


Hi my name is Luu. Now my main research direction is interaction design. My design philosophy that I want to point at is human-oriented design, focusing on the overall design process, especially the research on user experience. I think design is not just about the product itself, but about studying user behaviour. Therefore we need to deliberate on the details to develop a reasonable and positive solution.

CV


Coursera Online Course

Google UX Design Professional Certificate


01

8

Interaction design / Mobile App Design / Packaging / Illustr Typography / Brand D Animation / Digital


/ Visual Design / Photogra ration 35 Design / TABLE OF CONTENT l Art


INTERACTION DESIGN

Accessabiliy

Save Most Arrived Places

01-19

Mobile Application

SUMB

Indie Book Summary App

20-22

Mobile Application

BUSS

Bus Service App for the Elder


23-28

Web Design

LP CLUB RECORD Record Store Ecommerce

29-34

Web Design

YOUTIME

Time Control Website


01

Sumd - Indie Book Summary App Mobile Application Design

Introduction

Aim

Sumd is an app that summarizes the insights

The purpose is to connect readers to more indie

and ideas of books, the main message or plot of the book by indie writers in many different kinds of genre, in the form of listening or reading with an average time of 15-30 minutes.

01

writers and they can get more exposure to the indie community which meet the needs of both sides: writers who need more readers and the reader can meet their favorite writer by this app.

Scope of Work UX/UI Design, Research, Testing

Start 12.9.2021 - End 15.10.2021

Tools Figma, Adobe Illustrator

Personal Project


Background

Indie readers do not trust the reviews and ratings Why?

Number of book read in a year

Rate of dropping out of reading midway because of not research the content of the book carefully

30%

60%

20%

40%

45% Participants drop out of reading midway

10%

20%

Readers can be overwhelmed by the volume of books to read. Be

0%

Number of Books

4

5

6

sides, people have less time to

0%

7

Pages

100

200

300

400

read, plus the attention span goes down, so time to choose a quality book to read is limited.

Type of Survey

Online

Number of Participants

42

Date

09.2021

Age

18-32

02


Scope of Work

Users provide feedback about Sumd then make changes and improvements

TEST

An early model of Sumd that demonstrates its functionality by creating wireframe and low-fidelity prototype.

PROTOTYPE

I came up with as many solutions as possible by using crazy 8’s method.

IDEATE

From empathy map creates user persona and define the problem.

DEFINE

EMPATHIZE

Understand users’ needs, thought & feel to get a clear picture of who users are and the challenges they are facing

Week 1

Week 2

Week 3

DESIGN THINKING PROCESS

03

Week 4

Week 5


DESIGN THINKING PROCESS

Learn about users through testing

Empathize to define the problem

EMPATHIZE

Test creates new ideas for the project

DEFINE

IDEATE

PROTOTYPE

TEST

Learn from prototypes to spark new ideas

Test reveals insights that redefine the problem

EMPATHIZE

DEFINE

IDEATE

PROTOTYPE

TEST

Foundational Research

Personas

Design Ideation

User Flow

What Works

Interview

Pain Points

Competitve Audit

Information Architecture

Role Play

Survey

Problem Statement

Data Gathered

Wireframe

Understand Impediments

Empathy Map

Goal Statement

Mockups

Research

04


Motivation

User Personas

Social

Learning

Hoang Hapee

Age:

Address:

Employment:

27

Ha Noi

Bank Manager

Mastery

Achievements

Operability

Description Appearance

Read 1-2 books in about half a year Join a lot of book review group Usually searching book on amazon

Problem Statements Goals & Needs

Pain Points

Increase the number of book read in a year

Choosing a suitable book in a short time

Save as much time finding book as possible

Finding a consistent format to read summaries

Hoang Hapee is a casual reader who needs to find a faster, more efficient way to find books that fit his needs because it is very difficult and time consuming to find books.

05


Motivation

User Personas

Social

Learning

Kaze Ha

Age:

Address:

Employment:

27

Ha Noi

Bank Manager

Mastery

Achievements

Operability

Description

Surfing social networks

Weekend reading at spiderum

Read detective & love stories

Read 1-2 books / 1 year

Goals & Needs

Pain Points

Create habit reading books

The length of a book.

Find the right book

Find the right book

Save time in choose books

Left a lot of books he was reading halfway through

Replace petty information with valuable knowledge

Appearance

Problem Statements

Kaze Ha is a non-reader who wants to start a reading habit and needs a more consistent way to build that habit because his current habit is eating up his energy and distracting him from his desire to read.

06


Goal Statement

1

Sumd app will let users read or listen to key ideas of a book which will affect how people decide whether or not the book is suitable for them by giving them the ability to listen or read the insight of the book in a short time.

2

Sumd app will let users read or listen to short summaries of books which will affect hơw people approach books by giving them an easier time getting the ideas behind the book.

07


Open App

Home Screen

Browse Book

Categories Detail

Select Book

Book Detail

Read Book

Already Member? N

Y

User Flow

Login Register?

Action

Screen

Free First Chapter

Decision

N

Y

Enter E&PassW

Yearly Subcription

Payment Details

Valid User?

Subcription

Select

Y

7 Days Trial

Fill Infor

User Log In Success

Log In Fail

Forgot PassW?

Reading Full Book

Reset Password Add to Wish

N

Y

N

Rate

08


Information Architecture

Home

For You

Explore

My Sumd

Countinue To Read

Search Bar

Profile

Saved

Setting

Select For You

Categories

Personal Information

Saved List

Account

Write an Summary

Create New

Member Supcription

Statistics

Share

Accessability

Edit

Edit

Content

Following

Search

Notification

Following Categories List Add more

Author Author Details Author Book List Best Reading Book

Podcast Notification

Newest Sumd New Book

Trending Trending Top List

Reading List

History

Author Author Details

Download

Author Book List

Highlighted

Book List

Best Reading Book

Highlight Preview

Edit

Highlight Detail

Share

Share Edit

09

About

Wish List


Wireframe

10


User Interface

11



13


14


15


16


17



Final Outcome

19


02

Buss- Elderly Bus Service App Mobile Application Design

Introduction

Aim

Buss is an application provide bus service for

The purpose is to help the elder who suffer

seniors who aged from 50 and above. This app cover from buying ticket to checking bus line, especially let users create health profile, share route for relatives.

visual impairments, health problem with optimize user interface to help them easy to navigate function and utilise app service without help from relatives.

Scope of Work UI Design, Research

Start 19.10.2021 - End 23.10.2021

Tools Figma

Personal Project

20


User Interface Using big bold typeface Steradian and high contrast funny color pallete with optimal function help the elder easily navigate bus service.

Accessabiliy

Key Features

Save Most Arrived Places

Most-arrived place priorities Free ticket profile with health condition easy for bus staffs to take attention for suddenly problem Prioritize sharing route for relatives to remotely keep track

21


Utilise Visual Hierachy

Health profile

22


03

LP CLUB RECORD Website Redesign

The solution I set out to focus my attention on a set of key goals: Landing a smooth and subtle navigation,

Introduction

redesigning a visual layout that supports

Renewing a webshop for buying used CDs, Vinyl with more qualities than being able to convert into sales. A webshop that was “on brand”

big-scale imagery and developing a user friendly experience for music lovers with modern look far beyond trend-driven aesthetics.

and able to transfer the vibe and feel from the physical shops into a digital space. A pure experience for music lovers.

The Problem The overall website performance and feeling

doen’t meet the target user’s- age from 20-30

taste of music.

Start 12.07.2021 - End 28.07.2021 Personal Project Scope of Work UI Design, Research

23

Tools Figma


24




27


28


04

YOUTIME - Time Tracking Website Redesign Web Design

Introduction

Aim

Youtime is the website help users understand

The purpose is to help people understand their

where the time is going while working on computer device and keep track of the time they spend in various activities so they can have an accurate idea of where their day goes.

29

time allows them to take control of it, and find a balance that work for them. The interface mainly focus on the data visualization and subtle color pallete, just make user feel like the ease.

Scope of Work UI Design, Research

Start 19.10.2020 - End 23.11.2020

Tools Figma

Personal Project


30


31


32


Goal Perfomance

33


34


GRAPHIC DESIGN

Selected Design Work & Miscellaneous Projects


Branding | Logos | Stationary

DOJI

JEWELRY

Project Title Topic Year Description

Doji Jewelry Rebrand Jewelry 2020 Hypothesis project for Doji Rebrand with branding poblem


Illustration

CARPE DIEM

Illustrator

Topic Year Description

Illustration 2020 Draw at home by Ananas You Competition


Logos

Logo

Logo

BY RACHEL

BE

UNDER

ACCESSORIES

TECH DRIVE

SHOE STORES

Project Title

By Rachel Logo Design

Project Title

Be Logo

Project Title

Under Logo Design

Year

2020

Year

2020

Year

2020

un d-

under in your life. BY RACHEL

accesories


Editorial Design

THE FOUNTAINHEAD

BOOK COVER

Project Title Topic Year

Book Cover Design The Fountain Head Book Cover 2020

ANY

THE

OVER 5 MILLION COPIES IN PRINT with a special introduction by the author

ANY THE RAND

FOUNTAINHEAD Any Rand’s classic novel has been inspiring readers for over half a century. Rand’s hero is Howard Roark, a brilliant yound architect whose revolutionary building designs lead him to wage a desperate battle against his colleagues, society, and even the women he loves. Roark refuses to compromise.in defe -nse of his selfish choices, Roark stuns hus critics by developing a radical mo -ral philosophy. Any Rand’s classic novel has been inspiring readers for over half a century. Rand’s hero is Howard Roark, a brilliant yound architect whose revolutionary building designs lead him to wage a desperate battle against his colleagues, society, and even the women he loves. “I love you, Dominique. I’ve given you not my sacrifice or my pity but my ego and my naked need. This is only way you can wish to be loved.” THE FOUTAINHEAD, Any Rand

Boni & Liveright Publishers BONI&LIVERIGHTPUBLISHERS.COM Also available as an ebook $ on audio from penguin Random House Cover design: Bui Hanh Luu

ANY THE RAND

FOUNTAINHEAD


Kinetic Typography

DI THEO BONG MAT TROI LYRICS VIDEO

Project Title Topic Year

Di theo bong mat troi Text Animation 2020


THANK YOU FOR WATCHING !


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.