2016. UI.UX portfolio_Po-Yeh Chou

UI.UX portfolio. 16

Po-Yeh Chou National Cheng Kung University

2015-2016

認知、經驗與行為設計研究室 - 研究助理 (2015- 至今） TEDxTainan - 攝影部 （2015-2016）

周伯燁

Po-Yeh Chou

jasonya2002@gmail.com

Laughter_Studio - 動 / 靜態攝影師、設計師 （2014- 至今）

本身對於科技相關產品有很高的興趣。認為科技該與設計一樣，以人為

出發點。除此之外，對於 "Understanding People" 這件事充滿好奇， 於是在大二時就加入行為實驗室擔任研究助理，從如何了解人開始學

習，到現在正在研究，該如何透過科技與設計，來改變人的行為。副業 國立成功大學 工業設計系 (2014-2018)

國立台灣師範大學附屬高級中學 (2011-2014)

是拍片 & 商業攝影師，偶爾會接接荷蘭的案子來當興趣。

學術經驗

得獎紀錄

▖ 2016 台灣人機互動研討會 , 台北

▖ 2016 成大工設期末展 - 冬展

- 海報展示

- 最佳設計

社群媒體相片內容及色彩屬性與情緒的關聯

▖ Multimodal User Interfaces, Journal

A Multimodal Human-Computer Integrated System for Facili tating Water Leak Detection - ( 審查中 )

Around - an app for long-distance family communication ▖ 2015 國立成功大學 104 學年度 書卷獎 ▖ 2015 第 5 屆台南 39 小時拍片競賽 Call me hero 叫我英雄 - 最佳劇情

▖ 2017 DeSForM, Conference

專業能力

between Parents and Their College Children

使用者研究、UI / UX 設計、行為改變策略、商品攝影、影像 拍攝與編輯

AROUND: A Mobile Application for Remote Communication - ( 審查中 )

Photoshop、Illustrator、Premiere、After Effect、 InDesign、SolidWorks、Lightroom

4

around

around

An App for long-distance family communication 周伯燁、徐阡芷、廖思涵、沈萱慈

2017 DeSForM design conference- (reviewing) 2016 成大工設期末展 - 最佳設計

around

" 不管距離有多遠，家人都好像陪伴在身邊 "

No matter how far away, family is always around you

5

6

around

" 家庭成員間互動的溫度，不應該隨著距離而有所消失 " 設計動機 Motivation "around" 是一款針對親子間遠距離溝通所

設計的 App。我們參考脈絡設計的方式，來 探討親子間遠距離溝通的需求，與現存問題 背後的成因。

多數的孩子會在大學時期離家中，到外地讀

書。對於許多家長來說，這時期是小孩第一 次離開他們的身旁，身為父母難免會擔心小

過自己的猜測，來判斷小孩是否安好。除此 之外，隨著親子雙方分隔兩地，父母與小孩 的共通話題日益減少，父母在希望與小孩聯

絡，又不知道該說什麼的情況下，讓雙方每 次通訊，話題都圍繞在特定的問候上。

孩在外的生活與學習情況。小孩本身較少主

我們認為，家庭成員間互動的溫度，不應該

訊。一來是不希望造成父母過度的擔心；一

與設計的結合，製作出 around 這套 App，

動的分享自己在大學的生活、身體狀態等資

來是覺得該有自己的生活與隱私。因此在無 法獲得孩子足夠資訊的情況下，父母只能透

隨著距離而有所消失。因此，我們利用科技 來促使親子雙方遠距離的溝通，讓距離不再 是溝通過程中的問題。

around

我們參考脈絡設計的方式，對遠距離親子間的現有溝通狀況進行探討。在訪問的過程中，我們

設計解法 Our Solution

發現父母輩的人對於較新穎的使用者體驗，抱持者較抗拒的態度。他們主要仍習慣於傳統通 訊 App（如 Line）的使用習慣與使用方式。因此，在我們最初提供解法時，我們省略了軟硬

體複合的使用模式。我們延續 Line 主要的使用習慣，保留長輩愛用的貼圖、語音等功能，並

在現有的架構上，新增我們設計的機制。在改變最少使用習慣的情況下，讓溝通體驗變得更 好。除此之外，我們在思考機制的過程中，嘗試使用行為模型來協助發想，並利用機器學習、

Context-aware computing 等科技的方式，來創造更美好的體驗。我們相信，科技勢必要與人 有密切的發展，才得以發揮科技最大的價值。

在 around 這個專案中，我著重在於專案管理（PM）與使用者經驗研究與開發 (UX)。由於我在認知、 經驗與行為研究室 (CXB Design Lab) 擔任研究助理，因此對於行為模型有著些許的理解。在使用

者經驗開發上，我嘗試讓團隊成員也能理解行為模型背後所代表的意義，並應用在 around 的開發 過程中。除此之外，透過研究室的幫助，我也認識到許多科技相關實驗室在進行的專案。機器學習

與 context-aware computing 就是其中的例子。我也將這些科技相關的知識傳遞給我的組員們， 讓我們的設計可以挑過既有的思考方式，發展較不一樣的面向。

除此之外，最後的使用情境、影片拍攝與動畫呈現也是我在這個專案中投注較多心力的部分。

我的角色 My role

7

8

around

設計流程 Interview 9 parents / 9 children

Interpretation R.I.T.E Evaluate

Work models

Prototyping

Affinity diagram

Problem clarify

Requirement analysis

Insights

User Study Design Process

around

訪問 Interview 我們總共進行兩階段訪談。

第一階段的訪談，我們想要得到現有親子間的溝通經驗與溝通方式，並從中尋找關鍵因素作為設計依據 : 親子間遠距離溝通的內容 ?

PARENTS CHILDREN

親子間遠距離溝通的內容

遠距離親子溝通的經驗 ?

利用哪些工具進行遠距離溝通 ?

M2. 在 line 中與朋友間的話題和與小孩間的話題不一樣，與小孩間沒什麼話題

M3. line 比較日常用途或者比較不急的事，電話是比較緊急，詢問一些事情時或重要事情時。 M4. 爸爸偶爾會看孩子 FB. 按讚，會想了解孩子動態 C5. 跟媽媽說過有空的時間，但媽媽好像都不會記得

C3. 不希望媽媽打電話來關心，因為可能當下在玩或者是有壓力。

C1. 有時候家人會忘記上次兒子說的話，但兒子會再告訴父母一次告訴過的事

第一階段訪談中，我們發現電話與通訊 app 是最常用的兩種方式，多數人傾向使用電話聯絡，但使用電話缺點在於——

當電話沒有接通時，更容易導致負面的情緒的產生。我們透過訪問來了解無法接電話的情況，可能是因為當下環境與場合並不適合、 沒聽到鈴聲或者正在忙等。

9

10

around

我們從第一輪訪問結果中發現了 3 個比較深入的問題點，因此我們進行了第二輪的訪談，對這些問題點進行深入了解。 親子間遠距每次都詢問同一件事，背後的原因是什麼？ 不同溝通方式（影像、文字、聲音），對於父母與孩子的重要性與影響 無法做到即時回應的原因？

around

親和圖 Affinity Diagram

根據兩次訪談，並詮釋後的結果，我們使用親和圖來找出影響親子間遠距離溝通的面向。我們一共製作了兩次親和圖。第一次根據 第一次訪談結果製作，將面向分為五類： 傳遞價值觀

分享資訊（與人有關的）

關心

可能的解法

好的體驗

待改善的部分

然而，我們認為這五項仍太過發散，並且我們在第一輪訪問中發現三項值得深入的問題，因此我們進行第二次訪問，將面向收斂成 三個主要面向：

溝通時機 安全相關

C5:" 因為我練球的時間很不一定，所以他們沒辦法掌握我在哪裡，就不能打電話給我，我馬上接到這樣 "

C1:"…那如果我知道他如果上班沒有時間接手機，我就會傳 line，先用 line 說我大概什麼時候會跟你聯絡…"

C2:" 有時候他很晚打來我就睡了，然後隔天我看到那個電話，我就會撥過去說：「你以後大概要幾點前打，我大概 9 點多我就睡覺了」

C5:" 她 ( 媽媽 ) 如果突然有事打電話來一定是有甚麼重要的事。他基本上打來我就會趕快接，如果真的沒接到我就會 趕快回，然後問他有甚麼事。可是他通常莫名其妙打來都是不小心按到，害我緊張了老半天。"

M3:" 如果早上我 line 上去，她（女兒）下午還沒看了話，我就會覺得很奇怪，我就會打電話。"

11

12

around

M1:" 我會想知道他最近過的怎樣，但問題是他要不要回答我，我有問過（他）但都可能（他）就一個句點給我，我就很

分享資訊

識相的不繼續問 "

M6:" 之前活動比較忙就比較多事可以講，現在生活比較規律了就是什麼 " 畫圖阿 ~ 讀甚麼書啊 ~"( 回答較制式 ) 然後我 們就會說 " 那你要認真讀書啊，不要隨便翹課阿，就是講這些。畢竟我們看不到，有時候還是需要提醒他這些事情 " C1:" 其實通常我不會回我媽媽 line，除非重要訊息或是要買什麼飯這類的才會回。"

C4:" 那種內容膨脹的文章，家人最喜歡貼那種東西，我看了就會吐槽，所以乾脆不看。所以我覺得我媽用 line 一定很挫 折，因為他貼的東西都沒人看 "

around

Flow Model

工作模型 Work Models

在 家 庭 遠 距 離 互 動 上， 子 女 普 遍 會 與 媽 媽 進 行 直 接 的 聯 繫， 與 爸 爸 的 聯 繫 較 傾 向 於 返 鄉 回 家 的 面 對 面 接 觸。 在 互 動 上， 媽 媽 常 常 會 叮 嚀 孩 子 在 外 是 否 有 好 好 的 吃 飯， 有 沒 有 什 麼 需 要， 也 常 常 將 自 己 的 生 活 經

驗 與 價 值 觀 與 孩 子 分 享， 但 由 於 世 代 上 的 差 異， 經 驗 與 價 值 觀 可 能 與 現 今 的 價 值 觀 略 有 衝 突， 因 此 可 能 會 造 成 溝 通 上 的 不 愉 快 或 者 痛 點。

13

14

around

Culture Model

Artiface Model

孩 子 在 與 父 母 互 動 時， 孩 子 通 常 會 由 通 話 中 的 小 細 節 觀 察 父 母 的 身 體 狀

父 母 與 孩 子 的 通 訊 中， 使 用 最 頻 繁 的 是 Line 與 傳 統 的 電 話 聯 絡。 由 於

尬、 怪 怪 的。 而 媽 媽 與 孩 子 互 動 時， 難 免 會 叮 嚀 一 些 生 活 細 節， 關 心 孩

量資訊要分享或需緊急聯絡的事時，家長因為普遍打字較不方便以及訊息無法時

況 ( 有 無 咳 嗽 等 )， 較 不 傾 向 直 接 表 達 關 心。 直 接 的 關 心 方 式 會 覺 得 尷

子 的 飲 食 與 安 全， 內 心 中 又 有 一 點 掙 扎， 怕 自 己 撈 叨 讓 孩 子 覺 得 厭 煩。

用 Line 的網路通話，有時間延遲的問題，因此較少人使用網路電話，如有較大 被閱讀等因素，親子間傾向使用電話聯繫。使用傳統電話最大的問題為「對話 時機」，在不合宜的時間點，例如開會中接到電話，難以創造好的對話體驗。

around

定義問題 Problem Clarify

Q1

Q2

Q3

固定生活模式：

溝通時機：

分享資訊：

小孩會有一個固定的 pattern( 生活模式、

由於父母的生活較孩子規律，因此孩子可

對於親子而言，互動頻率較低的原因，在

的關心 ( 電話 line FB……) 去建構小孩的

子的生活常常因為大學的活動、朋友圈與

方。孩子認為稀鬆平常的事，很有可能是

生活作息與行為模式 ), 父母會透過不斷 pattern。當父母沒辦法知道 pattern 或是 小孩行為沒有在 pattern 裡面時，擔心與 焦慮就會產生。

以在父母有空的時間進行聯絡。然而，孩 課程等關係，較難有規律的生活模式。父

母常常無法得知孩子有空的時間進行聯 絡。當父母無法聯絡到孩子，或者在不適

當的時間聯絡孩子時，溝通品質會被嚴重 的影響。

於並不知道該分享些什麼樣的內容給對 父母渴望知道的資訊。

15

16

around

UI / UX Design

在對的時間，做對的事 建議聯絡時間： 利用機器學習等方式，來建構家庭成員間， 有 空 時 間 的 Pattern。 系 統 會 根 據 行 事 曆、 習慣聊天的時間段、位置等資訊，進行分析 與學習。並提供使用者一個成功率最高的溝 通時段。讓通訊不再因為時間因素而失敗。

對個人聊天室長按，可以直接撥打電話

個人聊天室

around

家庭聊天群組

隨時隨地與家人們分 享快樂時光。

我們改變了家庭聊天群組的 Flow 層級。讓 家庭群組優先於個人聊天群組，並常駐於 UI 的最上方，以增加家庭聊天群組的使用機 會。

17

18

around

談的起勁，聊的熱絡！ Family Tree 機制讓聊天的熱絡程度能簡單易 懂的被看見。當家庭成員的聊天越熱絡，屬於 家庭的家庭樹就會長得越茁壯，甚至開花結 果。相反的，當聊天室一片死寂時，家庭樹也 會隨著萎靡不振。 系統會根據固定會聊天的時間，來計算熱絡程 度，因此在晚上睡覺時，小樹是不會枯萎的！

around

讓未接來電不再成為 造成擔心的元兇。 我們利用 context-aware computing 的 技術，分析周遭的資訊，經過處理並透過 Chat Bot 的方式，傳送未接來電可能的原 因給來電者。 我們希望透過自動偵測的方式，既可以保 有一定隱私，也可以提供較為精確的資訊 給對方，避免對方的胡思亂想。

19

20

around

around

用不完的聊天話題。 為了讓家庭間成員間不再因為話題而成為溝通的阻礙，我們設置 了家庭任務的機制。家庭任務提供一個共通的任務，讓家庭成員 可以以這個任務為主題，上傳相關的照片、影片、文字等資訊， 不僅讓家庭成員間有共通話題，也可以透過家庭任務的方式連結 親子雙方。 我們透過這項機制，讓親子雙方的生活有了交集。我們希望創造 的，是親子雙方在進行家庭任務的過程中，會覺得正在合力完成 某一件事，這種鏈結的感覺。

21

22

around

UI Flow

around

使用情境 Vimeo:

https://vimeo.com/198422447

App Prototype :

https://marvelapp.com/18131d6

23

24

Water-Leakage

A Multimodal Human-Computer Integrated System for Facilitating Water Leak Detection Multimodal User Interfaces, Journal (Reviewing)

Yuan-Chi Tseng · Kiat Siong Ng · Pei-Yin Chen · Po-Yeh Chou · Ting-Yu Lee

WPLDS (Water Pipeline Leak Detection System) 是一套輔助自來水公司的人機互動系統。

透過感測器設計（WPLDD），與 App 的輔助，可以讓尋找水管破洞的工程人員不必再耗費巨大的 力氣與時間，就可以找到水管破洞的確切位置，並通報給施工團隊，進行接下來的處理。

維修單位

聽水人

設計動機 Motivation 以現況而言，自來水公司處理水管漏水的方式，除了透過民眾舉報，最常使用 的方式就是透過經過訓練的聽水人，使用儀器來沿路尋找水管破洞之處，並通

報給施工團隊。然而困難點在於，聽水人的訓練並不容易；聽水人只能利用深 夜，車流量少時才可以工作。耗費巨大人力資源與時間成本，得到的回饋可能

並不成正比。因此，我們與成大電機系進行合作，開發出這套水管漏水偵測系

統（WPLDS），讓聽水人不必再使用傳統的方式，就可以完成偵測水管漏水的 工作。

我的角色 My role 在這個專案中，我的工作主要負責使用者介面（UI）的設計與繪製與機制設計。 透過閱讀現有的自來水公司處理方式，設計通報程序。除此之外，利用裝置所 提供的資訊，設計符合使用者經驗的操作流程與操作方式。考量到水管工程人 員都具一定年紀，因此操作介面上以簡單易懂為主，捨棄太過花俏的版面編排

與操作流程。在 Flow 設計上，幾乎所有的功能都可以用一條龍的方式完成，使 用者並不需要額外的點擊其餘的按鈕，操作上十分直覺。

Water-Leakage

25

26

Water-Leakage

現有問題點 Current problem 現今國內外，對於自來水漏水偵測主要利用人工配戴儀器的 方式，利用人逐步去聽自來水管的聲音來判斷漏水處與漏水

程度。這方式耗費巨大人力成本，並且效率並不高。除此之 外，聽水師的養成並不容易，也越來越少人願意加入這個行 業。

Water-Leakage

設計解法 Our solution 這個專案的執行團隊，由工設與資工兩方便背景的 人們所組成。我們開發了一套埋在地面下的感測器 （WPLDD），透過分析聲音資訊的方式來判斷漏水與

否，並結合聽水人的專業知識，提供更準確且可靠的 方式來判斷漏水。

27

28

Water-Leakage

人 + 機器 > 機器

系統提供初步篩選結果，配合人的豐富經驗，達到高準確度。 自來水管的開挖與維修需要耗費大量的成本。因此需要非常謹慎的去判斷，是否有 漏水、是否該維修。

在系統初期階段，系統還尚未有足夠的資料，來判定漏水是否產生，是否需要緊急 維修。在現有體制中，聽水人的豐富經驗，可以彌補這塊的不足。因此，我們的設

計是透過人與機器的相互合作，來提供比機器判斷更為精確，也更指得信賴的漏水 偵測系統。

聽水人不必像傳統的方式，半夜在街上尋找漏水的水管。透過系統，聽水人在白天

就可以針對系統所發出的異常通知，聆聽系統對水管的聲音監測，配上聽水人自己 的經驗，來判斷漏水是否存在。而這些被專家（聽水人）所標記過後的資料，可以 作為機器學習的正資料，用以改善系統的精確度。

人機互動架構圖

Water-Leakage

29

30

Water-Leakage

系統收到異常訊號，發布給使用者端 來進行近一步的判斷與標記。

透過比較該段水管正常時的聲音，與 系統所判斷異常的聲音，確認是否是 水管漏水。

在判斷水管確切漏水後，透過聆聽兩 端監測器所錄製的聲音，來判斷水管 漏 水 處 大 概 的 位 置。 節 省 現 場 勘 驗 時，所需的時間

Water-Leakage

31

單方向的操作體驗 由於考量到現存使用族群，年齡層都在中年左右，因 此在規劃操作經驗的過程中，以簡單、直覺為核心。

在單一介面上，只需要完成一件事情即可，並且在每

透過聆聽漏水處的聲音，來判斷維修 的優先程度。以利後續工程單位安排 維修順序。

標記後的資料會用顏色，來顯示危急 程度。並顯示漏水發生處，與導航到 該位置的快捷鍵。

項頁面都具有說明文字或者指引符號，讓使用上可以 更為直覺。 去除非必要的修飾，以高彩度的顏色與圖 形來減低使用上的負擔。

32

Water-Leakage

主頁面 UI

維修 / 待判斷列表

判斷過的資料，呈現緊急程度 （以顏色表示）、水管種類與 口徑、與快速導航按鈕

未判斷的資料，只會顯示水管基 本資料，與水管種類 異常訊號通知

Water-Leakage

判斷水管狀態 UI 流程進度條

設置正常的水管音，來與異常的水管音 進行比對，用以協助判斷是否有異狀 異常管線段

地面下水管埋置圖

33

34

Water-Leakage

嚴重程度判斷 UI

一樣使用比較的方式，來判 斷漏水的嚴重程度

以顏色表示危急程度。

Water-Leakage

UI Flow

App Prototype:

https://invis.io/G7BBF13RA

35

36

Emo-Lens

社群媒體照片內容及色彩屬性與情緒的關聯

Emo-Lens: A multiple filter on photo for better emotion transfer in social media 2016 Taiwan Computer-Human Interaction, Conference (Taichi 2016) 周伯燁、 陳子安、鄧芝晴、曾元琦

Emo-Lens，是一套優化濾鏡使用的一個概念研究。我們直接從情緒下手，不同於以往使用者需要嘗 試所有濾鏡組合，才能找到符合自己感覺的濾鏡，Emo-Lens 讓使用者提供自身情緒後，便能直接 生成符合使用者感覺（情緒）的濾鏡。

研究動機 Motivation

Emo-Lens

在現在人手一機的時代，人們樂於利用社群媒體分享個人經歷。照片，則是現今最常使用在社群媒體的主要內容之一。

礙於技術與環境，多數的人會仰賴濾鏡，來為自己的照片增添感覺。使用濾鏡，儼然成為上傳社群媒體前的必備過程。 現今的社群媒體提供多樣的濾鏡，供使用者選取。然而，提供過多選擇會導致選擇上的困難。在使用上，為了發佈

一張圖，往往會嘗試過許多款濾鏡，才能選擇到符合自己感覺的濾鏡。為了簡化濾鏡的選擇，卻又能提供更符合使 用者情緒的濾鏡，我們進行了這項研究。我們利用 SAM(Self-Assessment Manikin) 情緒量表，配合 Russell's Affect Grid，來規劃出一套可能的濾鏡使用情境。

相關文獻 Literature Review 情緒量表

過去，人類情緒測量及歸納一直是研究中的問題，直到 Russell's Circumplex Model of Affect 的提出才有一個完整可信

的基準。Russell and Mehrabian 提出 Russell's Circumplex Model of Affect ，藉由 Semantic Differential Scale 提出 三維度情緒測量基準：情緒向性（valence），激發水準 (arousal)，及自主程度 (dominance )，並由 PAD(Pleasure-

Arousal-Dominance ) 情緒量表作為情緒測量工具，此項情緒量表成為之後研究測試中廣受使用的基準，並且隨後衍生 出更多藉由此一基準的不同測量方式。

37

38

Emo-Lens

Russell's curcumplex model of Affect Russell (1980)

Russell [2] 利用愉悅程度（arousal ）與強烈

程度（valence ），將人的情緒轉換到 2 維座 標中，如右圖所示。

當越接近第 1 象限，則表示情緒是正向且強烈 的，代表情緒如開心、愉悅。

而反之第 2 象限則代表負向且強烈，代表情緒 如生氣、憤怒等。

透過座標器的方式，讓情緒可以很直覺且有系 統的方式被呈現出來。

Russell's Circumplex Model of Affect

Emo-Lens

SAM Scale

Bradley and Lang (1994)

SAM (Self-Assessment Manikin)

是 MARGARET M. BRADLEY 與 PETER J. LANG 在 1994 年 提 出。SAM 量 表

是建構在 Russell 的模型上，進行設 計。上排的小人偶代表著 Russell 模 型 中 的 Valence 部 分， 下 排 則 代 表 Arousal 。

SAM 量表的優點在於透過直覺的圖像 Self-Assessment Manikin Scale

化方式，方便受測者提供自身的資料。

39

40

Emo-Lens

社群媒體上的照片分類 Food(73)

Food, recipe, cakes....

Fashion(48)

Gadget(38)

Electronic device, tools, car...etc

Friend(35)

Hu, Manikonda, & Kambhampati, (2014) Pet(14)

Activity(219)

Both outdoor/indoor activities.

Selfie(46)

Animals like dogs or cats are the main object in the photo.

Captioned photo (0)

Hu 等人在 2014 年時，針對 Instagrem

上的內容進行分類，共歸納出 8 種在

Po 在 Instagram 上的內容。我們將從 Instagram 蒐集到的 473 張照片，依據 這 8 個類別進行分類。

其 中， 最 多 的 是 活 動 類 照 片， 幾 乎 佔 了 所 有 照 片 的 一 半。 而 勵 志 標 語 Shoes, customes, makeup, personal belonging.

User posing with other friends. At least 2 human face in the photo.

Only one human face is present in the photo.

Picture with embed text, memes, and so on.

(Captioned photo) 在這次我們的取樣 中，並沒有得到任何一張樣本。

Emo-Lens

實驗 Experiment 本實驗透過 SAM 量表進行情緒量測。以問卷的形式進行，單份問 卷包含題目說明、資料填寫部分及 30 頁題目，每頁題目包含一份 調 整 後 的 測 試 照 片 與 一 份 Arousal 與 Valence 的 五 點 語 意 差 異 量

表 (five-point semantic differential scale)， 受 測 者 在 觀 看 照 片 並

進行填寫量表後，進入下一張照片，照片順序以隨機方式安排。我 們根據 Arousal-Valence 模型的雙軸設定，將語意差異量表的數值 在 Arousal 上 分 為 0，1，2，3，4；Valence 分 為 -2，-1，0，+1，

+2。在 Arousal-Valence 模型中兩軸相交的原點定義為中性，因此在

問卷中 Arousal 越靠近 2，Valence 越靠近 0，則照片越接近「中性」。

41

42

Emo-Lens

資料分析

量化分析

本研究以量化與質性進行資料分析，將問卷數據利用最小平方法進行量化分析，篩選出中性與具情緒的照片，再者以質 性研究開放式編碼的方式分析照片內容，找出造成中性的原因。

本研究量化數據依據 Russell's Circumplex Model of Affect 的雙軸設定，在軸相交的原點定義為中性，並參照 SAM 量

表中的五級程度，將語意差異表分為五個等級。在數值上情緒強弱以 0-4 表示情緒由弱至強，而情緒向性以 0 為中性，

由 -2 至 2 表示情緒負向至正向。我們想要知道所蒐集到的原始數據，與中性指標（愉悅程度的中立指標設為 0；強弱的 中立指標為 2）的差距。因此我們使用最小平方法進行分析。量化分析後的資料，我們進行質性資料分析。

質性分析

先前有關情緒的研究普遍來說僅針對色塊等簡單的組成進行研究，因而選用量化分析即可達到研究目的。但照片產生情

緒的方式並不如純色塊單純，它牽扯到了內容、顏色與觀看者等因素，使用量化分析無法探討出更深入的意義。因此我 們選用扎根理論中的開放式編碼分析，以編碼小組（code team）的方式從照片內容萃取出質性資料，讓結果更符合實 際情況。我們根據量化結果篩選出中性與具情緒的的照片，希望了解什麼因素會造成情緒的產生。

Emo-Lens

結果與討論 Result & Discussion

43

44

Emo-Lens

1.

2.

3.

中性情緒樣本

4.

Emo-Lens

中性情緒 中性情緒的照片中，可能是因為受測者不了解照片想傳達的情緒，亦或是因為與照片內容沒有共鳴，故中性情緒照片在 大眾定位上是“無法留下印象的照片”相較而言，具情緒的照片則較容易讓人記憶。我們從兩方面了解造成這樣的定位 差異的因素：內容上與色彩上因素，這兩大因素是可以獨立影響照片，同時也可以互相影響照片情緒。中性照片拍攝內

容物品若是過於日常瑣碎，則不容易引起人們對它特別產生情緒。例如：常用的小護士 ( 左 3) 是人們日常常接觸的藥膏， 然而日常接觸的狀況及情緒有很多種，故人們無法了解一張只有拍攝小護士的照片背後想要傳達的故事。

譬如一張 Adobe After Effect 的動畫製作的照片（左 4），對於唸動畫的學生而言，這是一張情緒強烈的心情寫照，但 是對於沒接觸過的人來說卻不是那麼好懂。

45

46

Emo-Lens

具情緒 以具情緒的照片來講，大多是能夠使觀看者留下深刻印象的內容。造成此現象的原因有：1）照片具有使人舒適的意象 ( 例如：嬰兒、海、天空 )（如右圖 2, 3）：此分類因為照片內容讓人覺得可愛、溫馨，或能夠聯想到愉快的事，使得觀

看者對於照片是帶有情緒的。2）照片內容有外顯的情緒：其原因在於照片中人物特色 ( 例如：孩子、搞笑人群 ) 或內

容物 ( 例如：動物的臉部，如右圖 1) 情緒鮮明，也有可能是因為照片的主題明確、易理解 ( 例如：誇張的肢體動作、表情、

內容有趣，如右圖 4) 使得觀看者能夠透過照片與自身過去經驗相連結，產生共鳴。有趣的是，選出的具情緒的照片中， 有不少照片的拍攝手法、角度、取景，是非常獨特的，推斷這種令人耳目一新的方式也會影響觀看者情緒。

Emo-Lens

1.

2.

3.

具情緒樣本

4.

47

48

Emo-Lens

使用情境 為了保存當下的感覺 / 情緒， Emo-Lens 的功能會於拍攝照片時介 入。在規劃上，我們希望使用者在拍攝時不需花太多時間個別點選 濾鏡，而是透過滑動的方式，選出符合當下情緒的濾鏡。

Emo-Lens

Emo-Lens 的操作方式，源自於 Russell 所提的的 Affect model。以十字交點為無情緒，向各個象限滑動。第一象限為 愉悅為主的相關情緒；而第三象限則是比較憂鬱為主的情緒。

在拍攝時即時顯示濾鏡效果。

49

50

Emo-Lens

結論

在這次研究中，我們初步的了解到中性情緒與具情緒的照片特徵。我們從 Instagram 搜集約 500 張

樣本照片，經過人工調整後以 Crowd sourcing 的方式進行評估。每張照片至少被 30 位不同的人評 估過。將評估使用的結果利用量化方式，分出「具情緒」與「中性」情緒的照片群，並使用開放式編 碼的方式對內容與背後潛在原因進行討論。

在應用面上，社群媒體中的照片講究內容，因此單純的色彩心理學無法完全套用在社群媒體的濾鏡設 計上，照片的內容影響照片情緒的內容遠大於色彩的影響。因此在未來建構情緒濾鏡時，需要先針對 照片內容進行初步分析，由照片內容為基礎進行色彩上的微調。並在未來，可以使用機器學習的技術 作為情緒濾鏡系統的主要核心部分。 [Ref]

Russell, J. A. (1980). A circumplex model of affect. Journal of Personality and Social Psychology, 39(6), 1161-1178.

Bradley, M. M., & Lang, P. J. (1994). Measuring emotion: the self-assessment manikin and the semantic differential. Journal of behavior therapy and experimental psychiatry, 25(1), 49-59.

Hu, Y., Manikonda, L., & Kambhampati, S. (2014). What We Instagram: A First Analysis of Instagram Photo Content and User Types.

Emo-Lens

51

52

Emo-Lens

UI. UX. protfolio . 16 Po-Yeh Chou 2015-2016 National Cheng Kung University jasonya2002@gmail.com