Muse Chang Portfolio for UXUI

設計師:黒子 DE SIGNER:KUROKO

MUSE CHANG’S PORTFOLIO

April . 2017 - March . 2019

設計師必須像黒子。

黒 子，歌舞伎中的身著黑衣的人，負 責 轉 換 舞 台 景 並 將 道 具 傳 遞 給 演 員。 在 真實世界中設計師應就像黑子 一 樣，以 隱 形 之 手 將 好 的 設 計 傳 遞 給 使 用 者。 顧 客才是主角，設計師只是從中 默 默 促 使 一 切 發 生 的 人。 Designer has to be like Black Child , which is also called Black Cloth (Kurogo).

In traditional Japanese theatre, it refers to the stagehand who is responsible for stage transition and delivering props. In reality, desinger is also the invisible hand who deliver design to the user.

Muse Chang +(886)918153233 musechangtw@gmail.com medium / l inkedin / portfolio

兼具感性及理性，勇敢的探險家，在學時期靠接案練習設計並賺取旅費的設計系學生。 認為做個好的傾聽者，是設計師的職責之一，也相信設計師能為「社稷」帶來改變。 Sometimes rational, sometime emotional. A brave explorer. A design student who take freelance jobs to earn travel expense. Believe in being a good listener is one of the responsibilities of a designer.

我是設計流派中的雜家，對於不同媒材抱 持著開放學習的態度。從大學注重於以邏輯思 考解決問題的創新設計，到研究所強調設計師各人哲學抒發的感性創作。曾嘗試從概念 設計、互動設計、文化設計、使用者體驗設計等多元的角度切入自己的設計作品。 I am open to learn different style and material. From university, where logic thinking is most emphasized to solve problem innovatively; To research institute, which encourages emotional creation with one s own design philosophy. I have designed products from many different angles - ideation, interaction, culture and user experience.

Graduation

EDUCATION & EXPERIENCE

National Chiao Tung University

Get the award Display at exhibition

2019

September 2015 - January 2019

UX Design Intern

Institute of Applied Art Industrial Design

GK Design Group, Tokyo Shinjuku July 2018 - August 2018

M.A. / Academic Excellence Award / GPA 4.0

Composed a project proposal for UX improvement on Shinjuku station's navigation from scratch. Held vision ideation with a team. Conducted survey, interview, user research and user journey map. Presented the proposal to top management in English and was recognized as a potential project.

Tokens of Love, solo exhibition

Chiba University, Japan April 2017 - April 2018

College of Design Culture Plan & Design

2018

UI/UX Designer

Exchange Student

DesignAct, Taiwan Taipei April 2017 - December 2018 2017

iF Concept Design Awards

Completed 2 website designs, along with logo packs and posters design with design team. Used Sketch and wrote website wireframe.

Designer Scenario Lab, Taiwan Hsinchu

TOKYO DESIGN WEEKS

2016

September 2016 - October 2016

Work with the client in the role of the designer and conduct user research in“Yutu Pencil Fatory”project.

LEXUSE Design Award

Product Researcher Industrial Technology Research Institute, Taiwan Hsinchu

National Cheng Kung University

January 2016 - July 2016

September 2011- June 2015

College of Planning & Design Industrial Design B.S. / GPA 3.5

SKILLS

2015

Completed a user research project about Dementia with a team. Conducted user research, case study and contextual analysis. Proposed 5 viable products with full design and documentation.

Prototyping tools

Design

Soft Skills

Invision Sketch 3 Adobe Creative Suite

User-centered Design Industrial Design Visual Design

Leadership Communication Skill Empathy

UX methods

3D Modeling tools

Languages

Persona Storyboarding User Research Contextual Inquiry

Solidworks Fusion360 Rihno Keyshot

Mandarian _native English _fluent Japanese _conversational Taiwanese _fluent

Contents

PROJECT 1

Renting House System for Co-living Space : 9floor.co UI Design

PROJECT 2

UX Design

COMUSIC Guide APP for the Confucius Temple User Study & Research

PROJECT 3

UX Design

UI Design

Foldable Whale Chopsticks Sleeve for Whale Restaurant Culture Design

Product Design

PROJECT 4

Passenger Friendly UX in Shinjuku Station : Rethinking of oor marking in station

Environment Design

PROJECT 5

Design Research

Noise Collecting Barriers Environment Design

APPENDIX

UX Design

Design Research

List of Design Works 2012-2019

Industrial Design

Project.1

Renting House System for Co-living Space : 9oor.co UI Design

UX Design

Mockup for 9floors.co website

Project.1

我們相信

「 房子是用租來的，但生活不是。 」 我們希望

能提供在外的單身遊子 也能有像家一樣的生活 我們提供

社群經營與空間營造以及 方便的租賃系統

Design with 9floor and DesignAct team.

Project.1

Undesrstanding

我們的顧客

「 房子是用租來的，但生活不是。」 成 立 於 2 0 1 5 年 ，租 不 到 像 樣 房 子 的 台 北 ，玖 樓 開 始 改 造了1 0 間 老 公 寓 ，打 造 客 廳 、廚 房 成 為 類 似 咖 館 的 半 開 放 空 間 ，簡 約 的 設 計 吸引百 餘 位 來 臺 北 尋 求 夢 想 的 學 生 、上 班 族 、自由 工 作 者 、國 際 人 士 。 新 穎 的 物 管 模 式 ，也 吸 引了許 多 屋 主 合 作 ，掀 起 老 屋 欣 立 的 新 風 潮 。玖 樓 相 信 人 們 不只在 都 市 工 作 創 業、上學實習，更應該「住」進一個社群，因著室友的 共同生活互動，共享空間、知識、經驗與快樂。

什麼是共同生活空間 (co-living space)

打 破 傳 統 的 租 屋 模 式 ，我 們希望在都市裡租屋的獨 身 之 人 ，也 能 擁 有 舒 適 的 客 廳 ，偶 爾 可 以 下 廚 的 廚 房 ，甚 至 有 好 的 室 友 。因 此 希 望 透 過 我 們 的 平 台 ，為 些 顧 客 媒 合 室 友 ，並 打 理理想的共同生活空間。

Project.1

After Interviewing the Owner

Insights

根據顧客提供的服務 提出可行的體驗

1.社群開放權限/會員制度 2.租賃服務系統電子化

A 共生空間

1.公共空間的活動展 覽與不定期派對 2.合作夥伴招募 擁 有 輕 鬆 溫 暖 的 氛 圍 ，同 時 備 有 咖 館 的 工 作 生 活 機 能 。不只是 物 件 的 冰 冷 堆 疊 ，我 們 在 最 愛 的 角落 放 上 一 盞 落 地 燈 、植 入 綠 意 、以 及 能 與 室 友 分 享 私 房 菜 的 大 。簡 約 的 設 計 風 格 ，乘 載 平 凡 生活的更多樂趣。

C 日常支援

1.網上輕鬆繳水電費 2.每十日清潔打掃與每週 兩日

處理

3.損壞家具網上報修 例行公共區域清潔與 清 運 服 務 ，家 事 分 工 免 煩 惱 ，生 活 品 質 不 打 折 。雲 端 系 統 即 時 通 報 ，不 論 設 備 、還 是 生 活 ，都 貼 心 地 幫 你 定 一 切 。

B 便捷租約

1.網上預約看房 2.直接網上簽合約繳租金 訂 閱 式 的 線 上 繳 租 ，讓 租 房 跟 聽 S p o t i f y 一 樣 簡 單 。一 張 帳 單 、線 上 刷 卡 ，一 次 解 決 所 有 費 用 。不 管 是 實 習 外 派 ，還 是 留 學 交 換 ，最 短 一 個月的 彈 性 租 期 、便 利 人 性 的 入 住 流 程 ， 再也不用被合約綁住精彩的 人生規畫。

D 社群生活

1.入住前從網站預先 挑選室友類型 2.會員制社群交流區 一 個 人 的 視 野 有 限 ，多 元 的 社 群 卻 是 無 界 無 邊 。調 酒 師 、小 資 族 、自 由 工 作 者 ，無 論 你 從 裡 來 ，都 能 在 玖 樓 找 到 歸 屬 的 落 處 。小 聚 、 早 午 、泳 池 派 對 ，開 放自由 的 氛 圍 ，跨 界 的 文 化 交 流 ，與 室 友 一 起 認識城裡最棒的人事物。

Project.1

Trying To Fnd Out Target User

Persona

Target User

NAME AGE JOB COOKING FREQUENCY INTERESTS LIVING HABITS

Secondary User

Tertiary User

Steve 29

Dorian 32

Tanya 20

office worker

Freelancer

Student

Simply cook

Simply cook

Eat Outside

Movie, Gyming, Investment,Game

Party, Hiking, Sketching

Reading, Movie, Jogging, Food

Go home very night everyday. likes to watch TVon weekend

Usaually work at home.

Go outside on weekend. Travel a lot.

Like to cook in weekend. Enjoy sharing food with friends.

Project.1

Competitor analysis

類似訴求之 網站分析

優： 1.地圖搜尋很直覺 2.結帳資 清楚 3.可以直接在卡片上的照片滑左 滑右瀏覽照片

優： 1.按捷運搜尋租屋 2.有新聞與資 menu的選單 3.房仲介紹清楚

缺： 1.房源篩選條件太複雜，且位於 上方需要長長拉到上面調整 2.無法將價格由低至高排列 3.搜尋器上的文字導覽太不明確 無法讓顧客打入關 字 4.活動體驗部分很棒，但台灣地 區無法使用 5.服務設備icons分太開，且要 開收起部分才看得到

1.跟Airbnb一樣房源卡為橫式 長方形，視覺上資 拉太長 2.搜尋設定很詳細，但是線上太 過雜亂

缺：

3.一定要與房東用電話聯絡 4.社群網路分享列位於上方太 過顯眼位置

2

Design Solution

Improve In Our Ui

在條件搜尋基本選項 點開選單

1 房源卡片從橫幅式的改為正方塊式，以圖為 主的卡面，內容文字資 可以少一店可以 讓使用者一次多看幾個卡片。

Before

After

即可進階搜尋

Project.1

Solving Problems

Function Map

第三方金流 會員登入

搜尋房源 首頁

登入

2

申請 條件搜索 1

地図搜索

3

進入社群

繳費 設備報修 社群聊天

房源介紹

加入最愛

設備功能

預約看房

室友介紹

4

訂房繳費

線上客服 報修表單 聊天群組 成員搜尋 5

Email確認

線上洽談 入住守則

6

線上合約簽署 7

認識9floor

共居日誌

Design Solution

Wireframe

理念 團隊介紹 媒體專區 洽談合作 Medium網誌

線上繳租金與押金

Email 有別於舊網站的新功能

Project.1

UI Design 1

4

5

3

室 友 基 本 介 紹

2

6

7

線上合約簽署：直接連結Surveycake填寫表單，不需要 再像以前必須下載多份Word表格填寫再回傳。 線上繳租金與押金：透過第三方金流，線上繳費更方便， 更無爭議。

Project.1

Design Solution

Icons Design

Special Part 由廁所配置探討各國預測文化不同 瓦 斯 爐 、電 磁 爐 、電 鍋 、基 本 具 、洗 衣 機 、烘 衣 機 、洗 碗 機 、 箱 、滅 火 器 、煙 霧 偵 測 器 、熱 水 壺 、微 波 爐 、吹 風 機 、浴 缸 、投 影 機 、戶 外 陽 台 、工 作 空 間 、網 路 書 、單 人 床 、雙 人 床 、上 下 舖 、衣 櫃 、置 物 櫃 、衣 架 、 燈 、遮 光 窗 、浴 廁 、夾燈。 從 業 主 那 裡 拿 到 的 ic on s 清單中，包含了浴廁( 空間) 跟浴缸( 設施) 。 經 過 思 考 後 ，發 現 各國文化對於浴廁的定義不太一樣，所以將選項調整 為：淋 浴 、浴 缸 、馬 桶。 浴室基本配備

升級配備

台灣

廁所＋淋浴

浴缸

日本

淋浴

浴缸

Learning New Skill

Material Design

Before

After

Project.1

Mockup for Icons system

Project.2

COMUSIC Guide APP for the Confucius Temple User Study & Research

Mockup for COMUSIC APP

UX Design

UI Design

Project.2

專業語音 導覽

台南孔

導覽旅程 優化

稀有古文物 探索

導覽APP

在台南讀了四年的書，大家都很愛相約去孔 很少真的進到孔

參觀。然而真正拜訪孔

的文物所吸引。孔 APP的導覽能讓孔

附近走走，卻 內，被其樂器庫

是以前莘莘學子讀書的地方，希望藉由 的魅力與內涵被大家知道。

Project.2

TASK:發掘台南孔

對參觀導覽者的魅力

Trying To Fnd Out Target User

Persona 我很喜歡來孔 ， 古代的絲竹樂器都保存的很好， 如果能在導覽的時候聽到它們 彈奏起來是什麼聲音就好了 ！ Linda Shen, 20

Linda Likes to sketch in Confucius Temple, And she likes to collect stamp when she visit a new place.

Project.2

User Research

使用者研究 Product & Target activity

We Found

Reading information board in instrument room of Tainan Confucius Temple

Potential problem Information board can not provide sufficient information to visitor who visit instrument room in Tainan Confucian Temple.

Objective of the study

& PSS value

1.Easy understanding the information 2.Interesting visit experience 3.Visit directions

Observation Four of us took a trip to Tainan Confucius Temple with cameras to recordthe behavior of tourists. We spent couple of hours staying in the room, observed target groups s interaction between information boards. Then we did some work models to find information board s break downs.

Reasearch questions 1. How do you read information when you visit instrument room?

2. What information on board you cannot understand?

3. What information do you want to know after visiting instrument room?

Conduct Interview

Project.2

User Research

使用者研究

1Work models vs Sequence Model Title: Understand instruments used in Taiwan Confucian Temple Intent: Visit Taiwan Confucian Temple s instruments room.

Trigger: Want to know Instruments used in Taiwan Confucian Temple

Go to 大成門 Intent: Want to know where is Instruments room BD: No signs or maps can tell nearby

Ask ticketing staff Go to instruments room See a sign after entering the room Intent: To understand what is the sign talking about

BD: The sign height are too short that it is inconvenient to standing read BD: Information on the sign are too messy and difficult to understand

Squat to look closer Intent: To understand what is the sign talking about

To read signs beside instruments Intent: To understand the name of the instrument and it s story BD: Some signs are blocked by artifacts

Read signs from a different angle Leave

Project.2

2

Work models VS Artifact Models

1. Information board s height is too low. It s inconvenient to read that vistor have to squat to read.

2. Information boards are blocked by artifacts that vistor have to constantly adjust the viewing angle.

3. Information boards are placed messy and the sight are not level. It s not easy for visitor to find information boards and sometimes miss them.

4. The information on boards are too difficult to understand, and words are too little to read.

Visitors are always filled with questions.

3 Work models VS Physical Model 1. Information boards hinder access and make entrance narrow.

2. Information boards block artifacts.

Tourist

Entrance Information board

Artifact

Project.2

User Research

使用者研究

Break downs 1. Information Content are poorly designed.

2. Existing information boards are in a bad reading height.

3. Information boards are placed badly.

Design Solution

Solution For Physical Product

We integrate all small information board into a big board and place it on the background in case of being blocked by artifacts. New board make all infor mation on the same eye level so that people can easily to find them and read. New board looks more tidy and comfortable. Besides, we put a new small board on the glass in fornt of each artifact. There is a pattern on it and tell people use smartphone to induce it. Each samll board has a sensor and it s for our app service system.

(

)

古樂器名 形狀似虎 以木雕製 背上 有齟齬二十七個 使用時先敲擊 首三下 再刷 背三次

Yu Ancient instrument, shaped like a tiger, woodcarving, there are twenty-seven discord on its back. First hit the head three times, then slip the back three times.

鎛(

)鐘

鏞(

)鐘

垂花

古籍載 祭孔大典用於每一樂章起頭 示意節奏開始

鐘的一種 體型特別大 懸掛於紅色木 架上 為祭孔大典中最大的鐘 迎神與送神 鐘鼓齊鳴

屋簷下懸掛在半空中的短柱 此末端雕 成蓮花形式 主要的功用在承受屋簷的重量 以及裝飾

Bo bell For each scared music start, the bells mean rhythm begin.

Yong bell

Chuihua

A bell, the size is particularly large, hanging on a red wooden, sacrifice for Confucius largest bell. Towards God and to allay, bells and drums.

Under the eaves hanging in midair short columns, carved lotus form this end, the main function to withstand the weight of the roof, as well as decorative.

Project.2

User Research

Research For The Official Website

You can hear the real sound of the instrument on the official website.

Project.2

Design Solution

Solution For APP Function Map

現場導覽

首頁

語音導覽

場次搜尋

場次說明 導覽員介紹

QR Code 掃描

展品語音介紹

地図(顯示定位)

方向引導

導覽預約

文物進階導覽

官網介紹

Wireframe

導覽員

QRCode掃描

Future Goal

A game using those sounds of instruments to compose a Pop music.

地図(顯示定位)

場次搜尋

登入頁面

樂器試聽

導覽員評分

場次說明

參加導覽活動

導覽回饋

Project.2

Design Solution

UI Design

Project.3

Foldable whale chopsticks Sleeve for whale restaurant Culture Design

Product Design

Design with 千葉大学文化計畫研究室 南房総市万祝班 合作對象：日本千葉南房総市政府

Project.3

受千葉縣南房總市政府委託設計 給鯨魚料理店 袋 日本 千 葉 縣 的 南 房 總 地 區 擁 有 百 年 的 萬 祝(漁師傳統和服)、木雕文化，但近年來面 臨傳統文化的沒落， 些文化也慢慢地消 逝中。有 鑑 於 此 ，千 葉 縣 政 府 邀 請 文 化 設 計研究室長期到南房總進行研究，重新 掘

些 文 化 的 魅力，提出設 計 方 案 ，再 透

過與廠商媒合的發表會，讓好的概念被生 產，並回饋到南房總的店家與居民上。

Project.3

Survey & Interview

Stakeholder 所有關係人中，有市政府派來協助的研究員、顧客、當 地居民，到他們家中與他們深入訪談，想拼湊出南房総 的文化魅力。

Designers 學生

Customer 櫟原さん, 65

Researcher 押元さん, 45

Resident 美術館館長, 67

Resident 漁師さん, 78

Resident 國府田さん, 58

KJ 法 田野調查後，從KJ 法的激盪統整出南房総的八個魅力因素。

2 1

3

1 2 3

從無形的文化才看出被忽視的漁村

萬祝上各式各樣的圖騰是有意義的

南房総存在很多觀光資源， 個答案

Project.3

4

5

7

4 5 6 7 8

6

8

當地居民將資源活用的方式非常創新

現在還有許多元素可以讓我們一窺昔日的南房総是什麼風貌 從古文物中可以看出先人的智慧

當地的居民因為要定期舉辦祭典而彼此密切聯繫 南房総是一個充滿工藝技術的地方

的文化

可以繼續研究

案是肯定的。

Collecting「MAIWAI」Datas

Project.3

Collecting Datas

圖騰的digital化

Project.3

漁師の晴れ着「万祝」の図柄

Project.3

Define - Deliver Develop

Develop Idea

在 廳裡提供的鯨魚萬祝 在吃鯨魚肉大 前，藉由

袋，除了能帶領客人欣賞萬祝之美， 個動作將 袋 成鯨魚，表達出對鯨魚的感謝。

WHY HOW WHAT

提倡珍惜鯨肉的文化

以萬祝上的鯨魚圖騰為傳遞

讓顧客藉由飯前

的行為表達祝福

對日本人來說，鯨魚是神給的禮物。 所以在南房総

裏，每年殺的26條鯨魚，

從頭到尾、從裡到外都會被很珍惜的用在各種地方。 甚至鯨魚肉店家的庭院裡也都會祭拜「鯨塚」。 P.S以

袋

架，是很多是本人在食事上的習慣

。

Step fo Origami ①

⑤

②

⑥

③

④

⑦

Project.3

Prototyping

Try different ways

Interview

Bring prototype to Our Customers

我 們 總 共 拜 訪了當 地 的 三家鯨肉料理店，我們帶 模型去拜訪，想要知道他 們對於產品的回饋。

3. 道の駅

1. くじらのたれ

2. ぴ∼まん

The real feedback from customers make us design better.

「 個設計很好，但 是我不會用。因為 我們在做賣鯨魚料 理， 樣做讓我們 很難堪。」櫟原さん 櫟原さん認為，殺生是不得已，並不想藉由設計 來表達對殺生的哀悼，他們不會想要 樣做。不 過我們也向 解釋，對於吃警魚肉該抱持著感 恩的念頭，其實才是我們真正的用意。

Display to our customer

鯨魚料理

廳

Project.3

Design Solution

Presentation & Finding Vendor 南房総市地域資源再発見プロジェクト漁師の晴れ着 万祝」の図柄を生かした提案

在 展 覽 的 最 後 ，我 們 找 到 了 廠 商 願 意 生 產 產 品 。去 年 年 底 開 始 ，在 南 房 総 鯨 魚 廳 裡也能用到 些產品了。

Project.3

Project.4

Passenger Friendly UX in Shinjuku station : Rethinking of oor marking in station Environment Design

Intern project in GK Design, Tokyo

UX Design

Information Design

Design Research

Project.4

Do you really think you we always following the oor marking in the station?

Project.5

Noise Collecting Barriers Environment Design

Design Research

Design with Shin Shiang Lin, Chia Ho Lin

Industrial Design

Project.5

Improving from small, bring inovation to the world.

Appendix

Industrial Design

UIUX Design

Culture Design

Product Design

Graphic Design

Survice Design

Interactive Design

Art Installation

Food Design

Appendix