Hsu Li-Wen | Design Portfolio 2020

Page 1




CONTENTS

UI UX Design 10 40 60 98

Sweet Land Dessert making experience design Ainimal Pet-raising dating app

NCKU Student APP Redesign A case study practice

Stew & Heal VR game for Chinese medicine promotion

Animation 84 89

What If 2019 NCKU ID grad exhibit concept video Great Designs NCKU ID week promotional video

Side-Project 132 136

4

T-shirt Design

Business Card Design


5


Hello, I'm Li-Wen Hsu. I'm a student of industrial design and now minoring in psychology. I've found it very exciting to study people's mind and behavior , and it is interesting to apply what I've learned to design. To me, design is fascinating, because it does not have a correct answer and a clear path to its solution. Consequently, I can always try different ways to resolve the problems and put effort to improve the answers.

許力文 / Li-Wen Hsu

strength622@gmail.com +886 919459489 6


Education

2015-present 2018-present

Software

2D 3D Filming Prototyping Animation

Experience 2018-2019

2018/07-08 2017/07-08

National Cheng Kong University BA in Industiral Design National Cheng Kong University Minor in Psycholog y

Adobe Ai / Ps / Id Cinema 4D / Solidworks / Ke yshot Adobe Pr Adobe Xd / Proto.io Adobe Ae / Cinema 4D

National Cheng Kong University Visual Cognition and Modeling (VCM)Lab Kadan Mobile UI Design Intern

B.House Product Design Intern

Extracurricular Activities 2018-19 2018 2017-18 2016

Awards 2019 2018

2019 NCKU ID Graduation Exhibition Multimedia Director NCKU Industrial Design Week Multimedia Director TEDxTainan Photographer

NCKU ID Camp Artistic Designer

Taiwan Festival in Japan-VR Golden award

NCKU Outstanding Student For the Academic Achie vement 7


8


H su Li -W en Port foli o

UI UX DESIGN

2020

10 40 60 98

Sweet Land Dessert making experience design Ainimal Pet-raising dating app

NCKU Student APP Redesign A case study practice

Stew & Heal VR game for Chinese medicine promotion 9


Sweet Land

Dessert making experience design Sweet Land is an innovative recreation for collaborative dessert making. Using gamification as a strategy, we guide customers to put their ideas in cakes with the instructions on the tablet. By doing so, better interaction and connections are also created.

10


Designer

Li-Wen Hsu Wei-Ting Chang Meng-Shuan Tsai Shuan-Min Hsu

Category

Ser vice design UI UX design Product design

Duration 6 months

11


12


Can dessert making become an innovative recreation ?

“Collaborative dessert making�has become a common phenomenon in the DIY baking house. However, the service provided now is mainly designed for one person. Hence, we want to make dessert making a brand new recreation for friends.

13


Design Background

Collaborative dessert making I n A s i a , D I Y b a k i n g h o u s e i s a r i s i n g b u s i n e s s m o d e l t h a t p r o v i d e s i n t e g ra t e material and equipments for customers to enjoy making dessert on their own. Through obser vation, we found out that customers often choose to make dessert t o g e t h e r i n o r d e r t o h a v e a m o r e i n t e r e st i n g e x p e r i e n ce a n d s p a r e t h e co st . “ C o l l a b o rat i v e d e s s e r t m a k i n g � h a s b e co m e a co m m o n p h e n o m e n o n i n D I Y ba k i n g h o u s e s . H owe ve r, t h e s e r v i ce p rov i d e d n ow i s m a i n l y d e s i g n e d fo r o n e participant. And the true need and expectation haven't been satisfied yet.

Interview & Insight In order to get deeper understanding of collaborative dessert making, we inter viewed people who have been to DIY baking house in pairs. We've got insights from the inter views. Customers have to follow the fixed procedure the baking house provides, s o t h e c a ke s t h e y m a d e l a c k va r i e t y. Also, their creativity is stifled . O n e p e r s o n b e co m e s i d l e d u r i n g t h e process of making dessert . Moreover, it lacks interaction and connection between two people.

14


Goal & Strategy Design goals After having inter views with the target users, we found their needs and defined our goals. We want to develop a recreation for friends to engage together. It has to be both fun and interesting, and also be able to guide participants to p u t t h e i r i d ea s i n t h e ca ke . L a st b u t n ot l ea st , i t c reate s b ette r interaction and connections between the participants.

More fun

Closer

- Unique experience - Interesting process

- More interaction - More connection

More Diversity - Encourage creativity - More choices & possibilities

Accomplishment Meaning

Ownership

Scarcity

Empowerment

Avoidance Unpredictability

Strategy In order to enhance customers'interaction and the fun of the experience, we use ga m i f i cat i o n a s o u r st rateg y. Accomplishment, meaning, and unpredictability in the gamification octagon are involved.

Concept W e u s e sto r i e s to g u i d e c u sto m e r s i n a n ea s y w a y, st i m u l at i n g t h e i r c reat i v i t y a n d h e l p i n g t h e m p u t t h e i r i d ea s i n t h e ca ke s . A l s o, w e e n d ea v o r to i m p ro v e t h e w h o l e experience and work out the details, like space planning, user interface of the tablet and mementos for customers.

15


SERVICE DESIGN Bussiness model Expense

Income

Ingredient & Equipment

Dessert selling

Software development

Dessert making

Consumer

Labor cost

We will outsource the application de velopment . There will be two full-time staffs to maintain the operation. There are two parts on the revenue side. One is the expense from the customers who come to make the cake, the other one is the cafe'. We provide drinks and limited cakes for our customers.

02

07

04

03

06 01

05

08 06 Photo zone

01 Counter

Space planning

03 Ingredient & utensil

05 Working area

07 Dish‑washing zone

02 Toilet

04 Oven & mixer zone

08 Dining zone

At first, customers will select the theme they are interested in and pay. Next, they will get a tablet with the stor y and all the instructions in it. They will follow the steps on the tablet to make the cake in the working area. After the cake is done, they are free to enjoy their work in the dining area. 16


The cake making process & Mind map

Choosing theme Payment

Meaning

Empowerment

Choosing characters

Making batter

Unpredictability Empowerment

Unpredictability

Choosing baking mold

Placing cake in the oven Washing dishes

Empowerment

Empowerment

Peak-end Rul e

Cake decoration

Taking photo with cake at the photo zone

Accomplishment

Washing dishes

Peak-end Rul e

The picture above is the cake making process. The title on the far left means the rule of gamification we use in that step. Also, by adding some games into t h e ste p s , w e b r i n g m o re f u n i n to t h e ex p e r i e n ce fo r t h e pa r t i c i pa n ts , a n d trigger a discussion between them. Futhermore, we use "peak-end rule". The peak–end rule is a psychological heuristic in which people judge an experience largely based on how they felt at its peak (i.e., its most intense point) and at its end. In other words, if the user's feeling during the “Moment of Truth”(the peak & the end) is positive, the users may leave a good memor y of the experience.The gray block represents the emotion cur ve of the users. 17


18


INTERFACE DESIGN

In our design, all the stories, re c i p e s , a n d ga m e s a re p ro v i d e d through the tablet. Via different decisions from customers and the unpredictability in gamification, they can make t h e i r o w n u n i q u e c a ke a n d h a v e more interaction with friends. 19


20


Chooseing charactors Meaning

Choosing characters can make customers get into the spirit of the stor y more easily and make the experience more interesting. There are four c h a ra c t o r s f o r c u st o m e r s t o c h o o s e , a n d e a c h charactor has the skill which match to him/her. The skill can be activated during the process later on and customers can get the bonus then. 21


Chooseing cake flavor Unpredictability

Empowerment

I n t h i s s e ct i o n , c u sto m e r s w i l l fo l l o w t h e sto r y l i n e a n d a l s o d e c i d e t h e plots. Different decision they make will lead to different ending of the stor y and the flavor of their cake. W e u s e t h e co n ce pt o f m i n d m a p to g u i d e c u sto m e rs . O n e q u e st i o n w i l l correspond to three answers, and each answer will lead to another three answers. And then there will be three flavors which fit the image of the ending. Next, customers will choose one flavor out of three to be their cake flavor. 22


The mind map concept used for choosing flavor. 23


1

words & phrases

category 1

category 2

KJ method concept used for choosing baking mold.

24

category 3


Chooseing baking mold Unpredictability

Empowerment

In this part, we use the concept of KJ method to help customers decide the baking mold. Customers have to sort the words and phrases the y chose previously, and then decide the mold they want. T h e i n te r fa ce w i l l s h o w a l l t h e d e c i s i o n t h e y m a d e i n l a st s e ct i o n , a n d customers would drag the volcabularies and drop them into the categories t h e y f i t . A f t e r f i n i s h i n g s o r t i n g t h e w o r d s a n d p h ra s e s , c u st o m e r s w i l l choose the categor y which has the most volcabularies in it. Next, they will pick one of three shapes as their baking molds.

25


Choosing cake filling Empowerment

I n t h e sto r y, t h e f r u i t s o l d i e r s w a n t to h e l p m a i n characters to defeat the dark force. And then customers have to decide which fruit they want. Each of the fruit soldier will introduce theirself when tapping on it. Customers can choose the filling depend on the words fruits say or their own preferance.

26


27


Decoration

Empowerment

In ordinar y DIY baking houses, customers can only use the the fixed ingredients in cannot ask for changes. There are also the pictures of standard decoration for cu made by many customers are ver y similar and not creative. To encourage people to decorate their cake more creatively, we let them to choo will. The presentation of the ingredients is designed as color palettes. Customers c cakes and choose the ingredients according to their colors. 28


n the recipes, and customers ustomers to follow, so cakes

ose decoration ingredient at can preview the colors of the

29


Certificate

Accomplishment

Taking photo at photo zone

Certificate will be printed out 30

Also will be sent to customers by email

Many interviewees said that because cake would be eaten, so they want something can be perser ved.Consequently, we design the certificate for them. After finishing the cake, customers will bring their cake to the photo zone to take pictures with it. T h e p h oto w i l l b e ta ke n w i t h t h e ta b l e t , a n d t h e n i t w i l l b e m a d e into a certificate. Next, the photo and the certificate will be sent to the email adress of customers. The sta f f w i l l a l s o p r i n t i t o u t fo r t h e customers as a memento.


Choosing theme Payment

Meaning

Empowerment

Choosing characters

Making batter

Unpredictability Empowerment

Unpredictability

Choosing baking mold

Placing cake in the oven Washing dishes

Empowerment

Old end Empowerment

Peak-end Rul e

Cake decoration

Taking photo with cake at the photo zone

Accomplishment

Washing dishes

Peak-end Rul e

New end

A new end of the journey - Peak-end rule According to Peak-end rule, people judge an experience largely based on how they felt at its peak and at its end. In the old process which hasn't been redesigned, the end of the journe y is washing dishes - the lowest point of the journe y. Hence, customers will feel upset and judge the whole journey a bad experience. In order to improve this situation, w e s et t h e d i n i n g zo n e a n d l et c u sto m e r s e n j o y t h e i r ca ke a n d re ce i v e t h e ce r t i f i cate after finish washing dishes. Then, the journe y will end at the higher point , making the experience more positive. 31


PRODUCT DESIGN Twogether is a set of pastr y tips that contains two pastr y tips and a connector. We added more unexpected fun to decoration, considering it as the most impressive part of dessert making for most customers. 32


33


Prototyping

W e to o k l ots o f t i m e t r y i n g to m a ke t h e co n n e ct i o n m u c h smoother and also the better shapes of the paste. Whether the cleaning is easy and the production is possible are also the issues we concerned. Through actual tests with a number of prototypes refined, we finally confirmed the size and the details inside the product.

34


We expected users to enjoy the teamwork of using it and the a cco m p l i s h m e n t o f m a k i n g a n i ce - l o o k i n g w o r k . T h e f u n n y ex p e r i e n ce during the process is also an important goal we wanted to achieve.

35


USER TESTING Testing

W e i n v i t e d s e v e ra l pa r t i c i pa n t s t o co n d u c t a c t u a l t e st s , d u r i n g t h e process, participants were asked to follow the tablet to make their cake. The space configuration, equipments, and the procedure were as similar to our design as possible in order to get the real feedback. After the tests, we had inter vie ws with them to find out what can be improved and check if we achieve the design goal set in the beginning.

36


Interview

A f t e r t h e t e st s , w e h a d i n t e r v i e w s w i t h t h e p a r t i c i p a n t s . T h e process of the tests and the inter views were filmed, and then we made them into a video to demonstrate our performance.

Exhibition experience

During the exhibition, we set an experience zone where they can follow the tablet and make cakes. To enhance the authentic, we made myriad models of cakes, ingredients, and decorating items. It helped the visitors to understand the process i m m e d i ate l y. W i t h i n f i f te e n minutes, they can build their own cake and experience the concept of our project. 37


38


39


Ainimal

Pet-raising dating app

Ainimal is a pet-raising dating app. We analyze users' personalities through the pet-raising game, and then we use the results to do matching. Thus, users can have a better understanding of themselves and others, improving the quality of making friends.

40


Designer

Li-Wen Hsu Yu-Chen Pai

Engineer

Wei-Ting Cheng Je-Ming Wu Ji-Yuang Huang Chio-Xing Huang MIng-Xian Huang Goodideas Studio

Category

UI UX design

Duration

12 months 41


42


Can dating apps be more unique & positive?

Although dating apps are getting more and more popular, some people still assume they are negative. Some people also think the the functions of dating apps on the market are too similar and have little differences.

43


BACKGROUND RESEARCH

"Why do people have negative opinions on dating apps?" Common but negative

Dating apps have become to flourish these years, and many people are used to develop relationships through dating apps. However, according to the sur vey, roughly 56% of adults view dating apps and ser vices as either somewhat or ver y negative; their unfavorability persists across age groups and gender.

Some users are too aggressive (45%)

Hard to understand other deeply (51%)

Results of making friends are not significant (48%) Reasons why people view dating apps negative.

Interview

To understand the anticipation to dating apps, we carried out inter views with users.

Jason, 24 y

Medium-frequency dating app user

"I want to be friends with people whose characters are close to mine." Mindy, 20 y

Newcomer to dating app

"It would be great if dating apps can be both entertaining and cute." 44


SOLUTION We used a pet-raising game to enhance the level of entertainment and uniqueness, and then we can analyze the properties of users through the data from pet-raising. Next, users can match friends base on the results of analysis rather than appearance. This method can make users value internal traits more and able to know others more deeply. To make the app more entertaining

Pet raising

Character analysis

Not based on appearance

To deepen understanding & optmize matching mechanism

To eliminate prefudice and lower aggressiveness

Mechanism

Pet ra isin g ga m e

C haracte r anal y s i s

M atchi ng

45


TYPOGRAPHY & COLORS

Noto Sans CJK TC Bold

ABCDEFGHIJKLM NOPQRSTUVWXYZ

#fbb03b

#fcca72

ICONOGRAPHY

46

#f9f8c5

Medium

ABCDEFGHIJKLM NOPQRSTUVWXYZ

#9fdce2

Regular

ABCDEFGHIJKLM NOPQRSTUVWXYZ

#efefef

#c9caca

#7a6a56 #47280a


Style

In order to match the style of the pets, we chose bright and warm colors to be our app's primar y colors, like orange and yellow and used grey and dark brown as secondar y colors. The icons are also round and cute to fit the overall style.

47


FLOW CHART

48


WIREFRAME

49


UI STAGE

Pet-raising Screen

36

PET POS. USER POS.

Users can tap the chatting icon to chat with their pets, and the pets will response base on the attitude of the sentence. For example, if users appraise their pets, then pets will judge it a positive sentence and answer a positive sentence and give users "likes", and vice versa.

Anteater

Anteater has a narrow face, so it can't take a sefie of its whole face.

50

Cabybara

Cabybara is everyone's good friend, and it likes to go to hot spring.

Racoon

Racoon is a clean freak , it washes its food ever ytime before eating!


Closet Screen

Users can use "likes" which they gain by chatting with their pets to buy costumes in the store and help pets put on clothes in the fitting room. Af te r c h a n g i n g c l ot h e s , p ets w i t h n e w co st u m e w i l l s h ow o n t h e p etraising screen.

51


Profile Screen

52


Collecting conversation

We collect conversation between users and pets for analysis.

@#%$!*&

Pos.

Analysing materials

Neg.

W e t ra i n e d co m p u t e r s t o j u d g e the properties of sentences and volcabularies.

Personality results

Calculating the scores of the properties and turn them into the personalities.

W i se

Rom ant i c

C al m

Wild

E ne rget i c

Generating avatar

Each personality has an avatar along with the pet which users chose.

53


Chat & Matching Screen

54


Mechanmism

Matching

Every user can match 3 friends per day. The y can adjust the filter base o n g e n d e r, c h a r a c t e r, o r a n i m a l . T h e a d va n ta g e o f t h i s m e c h a n i s m i s t h a t i t can avoid choosing friends just by their appearances.

55


COMPETITION & PROMOTION

Start up compaign

After our product was mature enough, we participated in the competition held by Transfer and Business Incubation Center in NCKU. Our goals were to make our product more complete and check whether the public like our concept . In this period, we built our business model base on the circumstance of the market of apps and had discussions with many mentors to refine our app. Fortunately, our team won the popularity award in the competition.

56


2

1 3

1. 2. 3. 4.

4

Introducing our product to visitors. Vistors voted in the popularity competition. Wining the qulification of pitching on stage. Introducing our product to the principal.

57


58


59


NCKU Student APP Redesign A case study practice

N C KU St u d e n t A P P wa s l a u n c h e d i n 2 0 1 5 , a n d i t i n teg rate s va r i o u s functions which relate to the campus. However, there is still some room for improvement and redesign.

60


Designer

Li-Wen Hsu

Category

UI UX design

Duration 3 months

61


62


Can we improve user experience of using student app ?

The student app plays an important role in integrating information on campus. An excellent student app can assist students to get the information they want immediately. On the contrary, a bad one would make them frustrated and miss important information. Hence, we have to get insights into students' habits to do the redesign.

63


Design Background NCKU Student APP NCKU Student APP was launched by NCKU Computer a n d N e t w o r k C e n t e r i n 2 0 1 5 . I t i n t e g ra t e s va r i o u s functions which relate to the campus, so almost ever y single student in NCKU has downloaded it. By u s i n g t h e a p p, st u d e n ts ca n v i e w t h e i r t i m eta b l e s , grades, campus news, and other information.

Why Redesign?

64

Old UI trend

Unneccesary fucntions

Since the old student app was launched in 2015, neither the UI style nor the trends are attractive or appropriate now.

There are too many functions that students seldom use on the main pages, making users hard to find what they want immediately.


Bad user experience S o m e l a yo u ts a re n ot f r i e n d l y to m o b i l e d e v i ce users, making them hard to view the information. Some layouts are not clear enough to guide users to the right direction, making them feel frustrated.

Old UI screens

65


Research "Hoping the app could meet students' needs more, and have the characteristics of NCKU." On one hand, there are some functions that students seldom use in the app. On the other hand, some frequently used functions are not well designed. For example, students can't see credits and GPA from "Grades", so we have to look up the information from school's websites by themselves. Also, making students have bonds with the student app is a good idea.

Frequency of functions used In order to find out what is essential for users, we investigated which functions on the menu of the app were used by students most.

Grades

Timetable

Safty

Lost & Found

WIFI

Calendar Library

Student ID Page

Payment

Map

My Box

NEWS

Scholarship Moodle

Third Party APP

Activity

Larger circles represent more frequency of fuctions used by users.

66

Dorm Info

Other Units


Design Goal

New UI style We will design the new UI base on the latest UI trend. For instance, using flat elements and illustrations to make the interface younger.

Eliminating unessential functions B a s e o n t h e r e s ea r c h , w e w i l l ke e p t h e i m p o r ta n t functions in the student app and discard unessential ones. Howe ver, the y still can use these ser vices by websites.

Improving user experience Because the bad user experience resulted from the mess of information structure, the first priority is to redesign the structure of the app.

Adding NCKU elements P u tt i n g s o m e e l e m e n ts w h i c h N C KU st u d e n ts fa m i l i a r w i t h i n to t h e d e s i g n wo u l d m a ke u s e rs fe e l s u r p r i s i n g and interesting. Also, users would have a sense of belonging, enhancing the will to keep using the app.

67


NEW FLOW CHART

68


69


NEW WIREFRAME

70


71


72


73


COLORS & ILLUSTRATIONS

#fca163

#f9e6c2

#fc5447

74

#80a7e5

#efd5d5

#f9e6c2

#ab6cad


2

#a7cc8f

#cce8ba

#eaddea #f2f2f2

#999999 #4d4d4d

75


Campus Pages

76


77


News Screen Displaying Photos

Showing pictures on the page can attract users to the news.

78


Old UI

Not visually attractive

Linked to external websites which were hard to read on mobile devices

79


Calendar Screen Larger Calendar

Swipe left and right to browse more months.

Connections to Calendar

Using colors to let users easily connect the information to the calendar above.

80


Old UI

The calendar was too small to read on mobile devices. Hard to connect events to the calendar.

81


Study Pages

82


83


Timetable Screen

Classroom & Instructor

Tap the course for more information clearly.

84


Old UI

The names of the courses were divided into too many lines, making them hard to read. The bricks were crowded with the information.

85


Grades Screen

Viewing Grades

Tap on the semester or swipe left and right to browse smoothly.

Catagories

Using different colors to mark the catagories of courses.

86


Old UI

Need to search grades by year and semester.

Did not show the credits of each course separately.

87


Library Pages

88


89


Guide Screen

Viewing Library Information

Tap on the tabs or swipe left and right to browse the information smoothly.

90


Old UI

Need too many steps to get the information

Hard to look up for the information(open hours,floor plan location ...) of one library quickly

91


Reservation Screen

Status and Colors

Using different colors to show whether the book is availible for users to pick up.

92


Old UI

The titles were divided into too many lines, making them hard to read. No visual hierarchy, making users hard to find out the information they need.

93


About Me Screen

94


Colors of College

Each college has its representitive color, helping people to identify easily.

Bioscience and Biotechnology Engineering Science Medicine Electrical Engineering and Computer Science Social Science Management

95


96


97


Stew & Heal

Chinese medicine promotion VR game

Stew & Heal is a VR game of which goal is to promote Chinese medicine culture to the Japanese at the Taiwan Cultural Festival in Sendai, Japan. Through this game, players will have a better understanding of Chinese medicine by making decoctions themselves.

98


Designer

Li-Wen Hsu

Engineer

Hoa-Yu Wang

Text

Yu-Chin Tsai Wan-Ting Lin

Translator

Yi-Lin Chiang

Category

UI UX design Modeling

Duration 7 months

99


100


Can we promote Chinese medicine to foreigners through VR games ?

Chinese medicine is an ancient wisdom of traditional Chinese herbal therapy, which most of the Chinese and the Taiwanese are familiar with it. However, foreigners know little about it. Thus, through VR games, they can learn about the herbs through the 3D models we built and also experience the process of making herbal decoctions in the game.

101


Design Background

Chinese medicine

Chinese medicine has evolved over thousands of years. Its principal is using different natures of herbs to treat different diseases. For instance, Hot and warm herbs are used to treat cold diseases, while cool and cold herbs are used to treat heat diseases. Many Taiwanese and Chinese are familiar with Chinese medicine, and some of them would turn to it when they feel ill. In fact, people can take Chinese medicine in their d a i l y l i fe e v e n i f t h e y a re n ot s i c k , fo r s o m e o f t h e h e r b s ca n b e u s e d a s fo o d o r materials for Chinese cuisine.

Chinese pharmacy Chinese pharmacies were ver y popular a long time ago in Taiwan, although their popularity has declined gradually due to the advance of modern medication. The picture on the right is the famous Chinese pharmacy, called Y i - C h u n p h a r m a c y , i n Ta i n a n which is no longer open now.

102


Goal & Strategy Design goals

We defined some essence of Chinese medicine, and set goals for our players. After finishing our game. Foreign players would: Know the concept Chinese medicine

Since most of foreigners are not familiar with Chinese medicine, the first priority is to let them get the insight into it .

Learn about herbs and their effects

We expect players will learn about some famous herbs in Chinese herbology and understand their effects on human body.

Understand the process of making Chinese herbal decoction

It is also quite important to know the combinations of herbs and how to stew them.

Learning about herbs

Strategy W e u t i l i ze d t h e st re n g t h e s o f virtual reality to make Chinese medicine easier to understand. By seeing the 3D models of herbs and making medicine themselves, foreign players could learn and enjoy with Chinese medicine.

Understanding the process

103


Design Process Storyboard

Before starting building the game, we created a simple stor yboard. At first, some introduction of Chinese medicine showed. And then, the tutorial of making the herbal decoction started. Players would follow the instructions and made it step by step. After the tutorial finished, the game would begin.

104


Building VR game in Unity

We used Unity to develop our game because it is free and novice-friendly. It took us a great amount of time to settle all the models right in their places. A l s o, w e e n d ea v o re d to d ea l w i t h t h e t u to r i a l pa r ts m a k i n g t h e m ea s y to understand.

105


106


Modeling in Cinema 4D I used Cinema 4D to model the herbs and the characters. Interestingly, it was my first time t o u s e M i x a m o t o b u i l t m o v i n g c h a ra c t e r s which were able to import into Unity.

107


Concept "Learning Chinese medicine through matching patients to herbal decoction" The concept of the game is making herbal decoctions for corresponding patients(NPC). Players have to pick up the elements to make soup healing the patients. The y can learn about the effects of each decoctions for different patients and the ingredients.

108

Patient

Herbal decoction

Children

Improving nutrition

Men

Improving renal functions

Ingredients

Dong-Gui & Rib

Sea horse & Chicken


Patient

Herbal decoction

Ingredients

The elderly

Enhancing memory

Tian-Ma & Fish

Boosting blood flow

Jujube & Pear

Women

109


Stage design

In each stage, players would learn and make one new herbal decoction, and they a l s o h a v e to re m e m b e r t h e d e co ct i o n i n p re v i o u s sta ge s . Fo r exa m p l e , i n sta ge 3, players would learn the decoction for the elderly, but men and women would appear here, so players have to make three kinds of decoction in this stage.

110


111


Presentation at Kaohsiung Software Technology Park

At the end of the semester, we held our final presentation at Kaohsiung Software Technology Park. Also, experts in culture and VR games were invited as judges, ranking our projects. The top three groups would be able to go to Sendai, Japan to participate in the Taiwan Cultural Festival in October.

During the presentation of our group, both audiences and the judges were amazed by the 3D models of herbs and the characters we built. T h e j u d ge s a l s o a p p re c i ate d t h e l e ve l o f co m p l et i o n o f o u r ga m e s , including the sound effect and the animation. In the end, our group was honored to win the first prize, earning the qualification for the Taiwan Cultural Festival.

112


Re ce i v i n g 1 st p l a ce t ro p h y f ro m t h e w i n n e r o f A ca d e m y A wa rd fo r Te c h n i ca l Achievement, Wan-Chun Ma.

113


Exhibition at Sendai Mediatheque Making our works visible to the world

W e h e l d t h e Ta i wa n Cu l t u ra l Fe st i va l at S e n d a i M e d i at h e q u e w h i c h i s a m i x e d - p r o g ra m p u b l i c fa c i l i t y co m b i n i n g l i b ra r y and art galler y functions. Our main goal of the exhibit was to p ro m ote t h e t ra d i t i o n a l c u l t u re to fo re i g n e r s t h ro u g h o u r games, making them to have a insight of Taiwanese culture.

Fo r t h e d u rat i o n o f t w o - d a y e x h i b i t i o n , m a n y J a pa n e s e a n d people from other countries came to experience our VR games and activities. The y all enjoyed the games and showed great interests in our culture.

114


Game experiencing Many visitors came to experience our game in the ex h i b i t . B e ca u s e o u r ga m e wa s e n te r ta i n i n g a n d friendly, people of all ages were welcomed to play.

115


116


117


118


119


120


H su Li -W en Port foli o

ANIMATION

2020

122 126

What If 2019 NCKU ID grad exhibit concept video Great Designs NCKU ID week promotional video

121


What If

2019 NCKU ID grad exhibit concept video

"What If" is an animation made for the promotion of 2 0 1 9 N C K U I D g ra d ex h i b i t . We use Cinema 4D and After effect to accomplish the task. In the animation, we apply fantastic and mysterious stlye and mix 2D and 3d animation together to demonstrate infinite possibilities of "What If".

122


3D Animation Li-Wen Hsu Yu-Chen Pai

2D Animation Po-Yun Zhang

Category Animation

Duration 2 months

123


124


What If - concept video

There are possibilities ever ywhere in our life. Design makes ever y possibility turn into a whole new world . Through desconstruction, transformation, and reorganiztion we can find a new order, and then we are able to start a better life which we have dreamed of.

125


Great Designs NCKU ID week promotional video

"ID week" is an activity which works to promote industrial design, making general public have a better understanding of design. The theme this year is "Great Designs", and we make plenty of classic designs throughout the historic into merchandise. Also, we attach its story and introduction to the merchandise, so people can understand the meaning behind it.

126


Animation Li-Wen Hsu Yu-Chen Pai

Art Director Chien Chiu

Category Animation

Duration 2 months

127


Great Designs

I n t h i s a n i m a t i o n , w e i n t r o d u ce s e v e n ce l e b ra t e d d e s i g n e rs a n d t h e i r c l a s s i c d e s i g n s . W e a l s o q u ote t h e i r fa m o u s s a y i n g to m a ke a u d i e n ce a p p r e h e n d designers' attitude toward great design. During the activity, we put our products in capsules, so we also have a capsule vending machine in the animation.

128


129


130


H su Li -W en Port foli o

SIDE PROJECT

2020

132 136

T-shirt Design

Business Card Design

131


PTT x Tainan T-shirt Design

Introduction

PTT Bulletin Board System is the largest terminal-based bulletin board system based in Taiwan, and "Tainan board" is the most popular local board. This T-shirt was designed for Tainan board as a memento.

132


Design concept

Beef soup

Tainan is famous for beef soup, m a n y t ra v e l e r s e v e n l i n e u p at 5a.m. to eat the first batch of soup.

Drinks

Tainan citizens have a fancy for drinks, especially sweet drinks with great amount of sugar.

133


ID Camp T-shirt Design

Introduction

PTT Bulletin Board System is the largest terminal-based bulletin board system based in Taiwan, and "Tainan board" is the most popular local board. This T-shirt was designed for Tainan board as a memento.

134


Design concept

" As we work harder, our livers become more fragile."

Introduction

The pen is a symbol of the level of our earnest. A larger pen m ea n s w e a r e m o r e h a r d - w o r k i n g . A s w e w o r k h a r d e r, o u r livers become smaller. It implies that if you want to succeed, you have to make efforts to improve our skills.

135


136


Business card design

I used the initial letters of my name to design the logo. Transfering the cur ve o f " S " i n to p o l y l i n e m a ke s i t co o l e r and simpler.

137


許力文 / Li-Wen Hsu

strength622@gmail.com +886 919459489




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.