是什麼原因讓我們追劇追不停?解析 Netflix 介面 UI/UX 設計

Netflix 點開影片的「略過介紹」這一顆按鈕,每天會被點擊 1 億 3600 萬次;這個介面最一開始是怎樣被設計出來的呢?Neftlix 在 UI/UX 上又有哪些秘密也是被設計好的呢?今天這集影片我們來好好研究一番。

是什麼原因讓我們追劇追不停?解析 Netflix 介面 UI/UX 設計
💡
Netflix 點開影片的「略過介紹」這一顆按鈕,每天會被點擊 1 億 3600 萬次;這個介面最一開始是怎樣被設計出來的呢?Neftlix 在 UI/UX 上又有哪些秘密也是被設計好的呢?今天這集影片我們來好好研究一番。

嗨囉,大家好🙂 我是設計師 Riven

各位同學有在看 Netflix 嗎?我的帳號從 2016 年訂閱到現在,最近的韓劇《社內相親》、日本動漫《進擊的巨人》最終季第二部,還有台灣的《華燈初上》Riven 老師全都看完了,不過放心 接下來的內容不會為劇情爆雷。

只是追劇追了這麼久,你有留意過這些影音串流平台的介面設計,有哪些小心機讓你一集接著一集、停不下來,最後一集播完之後,窗外的太陽就跟著現正熱播一起升上來了,說不定看懂這些「故意的設計」,之後追劇會節制一點也說不定哦,趕緊來看看吧。

劇照封面暗藏玄機

Netflix 在推薦你可能喜歡的影片上,可是做了不少研究,演算法必須足夠聰明準確才能推到觀眾真正想看的,而我們知道不論是用網站、手機或電視觀看,點擊所觸發觀看這個動作之前,Neflix 就會去判斷什麼樣的封面劇照是合你口味的。

例如說,不同國家看到的劇照封面就會不一樣;像是全球熱門科幻影集《怪奇物語》就會在不同的地區選用當地喜歡的封面,反映出各地粉絲的習慣與喜好,我們知道現在使用者的注意力是相當短暫的,如果沒有在幾秒鐘以內吸引住他們的目光就會轉去做別的事情,因為人腦僅需 13 毫秒就能了解一張圖片傳達的訊息。

Netflix 創意服務全球總監 Nick Nelson 在部落格中撰文表示,他們在消費者研究中發現,劇照不僅是影響會員選擇節目的最重要因素,更佔有會員瀏覽 Netflix 節目時超過 82% 的注意焦點,會員們平均只用 1.8 秒來考慮要不要看一部影片。

還有幾個 Netflix 在影集劇照分析上的觀察,像是人類對於臉部表情非常有感覺,表達出複雜情緒的臉部表情,,會比極度開心或舒服愉快的表情更能吸引目光,也就是說「情緒」有一種引人入勝的魅力,可能是因為複雜情緒代表後面隱藏非常豐富的故事,另外一個也很好玩的研究發現是,劇情裡的好人不一定最吸引人,反而是辨識度高的極端壞蛋反派角色,在劇照中特別受到歡迎,,尤其是在兒童系列以及動作片系列中,例如在《馴龍高手》電視影集版《馴龍記:飛越邊界 Dragons: Race to the Edge》大反派和噴火龍會讓觀眾們特別有感覺。

而當然,如果你用不同裝置去瀏覽 Netflix 也會顯示不同張的劇照,比如說《勁爆女子監獄》裡面有許多知名演員,但如果在手機裝置上排排站會讓縮圖太複雜,所以會針對小尺寸螢幕去放上更少的人數,這有點像我們 Web UI 講的 RWD 響應式設計。


影劇標準字

而除了劇照的選擇之外,Netflix 在標準字客製上也是別有用心哦,會從原本影集當地的字型延伸到各個語系,而不失去原本的風格。

我們從 justfont 的這篇 IG 分析貼文中可以看見,例如《咒術迴戰》延續了日文字型的架構與比劃,《機智醫生生活》沿用了原本韓文字的造型與顏料質感,《后翼棄兵》則是以明體字型作為基礎,改造成符合劇本風味的標準字。


直接放送預覽影片

Netflix 身為影音串流網站的一哥,有很多原創性的介面與體驗設計,以現在來可能有許多網站會看到,不過最剛開始可能都是源自於 Netflix。

像是剛進入 Netflix 網站,直接一言不合就全螢幕播放最新劇集的影片預覽,吸引目光的畫面配合聲音效果,這個設計就是要「引人入勝」,讓你產生觀看的興趣,這個動作是在解決在以前的影音平台上,要找影片的時候只能靠影片封面圖片跟標題來看,但其實影片是會動且有聲音的,直接看影片片段會對使用者來說更為直覺,那其實以網站技術來說,實現影片的即時預覽這件事不會太困難,但 Netflix 的 User Interface VP 提到過,Netflix 是一直等到大家已經習慣在網路上看電視,以及自適應串流與全球內容傳輸系統,等等的開發面向科技基礎設施完備後,才推出這項播放技術來。

這讓播放預覽可以更舒服、更順暢一點,不過話說回來 Netflix 的預覽並不是一般的預告片或宣傳片,是經過特別設計的劇情提要,目的是快速傳達劇情重點、角色個性和畫面風格,幫使用者更快速、更確定找到的是想要看的內容,讓觀看者花更少的時間尋找,從而觀賞到更多的影片。


直接略過片頭

再來是每次看新的一集影片,剛開始的時候你想跳過片頭,就會去按的這顆「略過介紹」按鈕,官方指出這個東西每天使用次數高達 1 億 3600 萬次,為 Netflix 會員累積省下相當於195年的驚人時間。

Netflix 產品創新部門總監 Cameron Johnson 近日發表文章說到,觀眾有時候會想複習最愛的影片精彩瞬間,比方說爽感十足的動作場景,真相大白、劇情出現驚人轉折的時刻等等,當時團隊有個想法,是在 Netflix 提供倒轉與快轉 10 秒的功能,當觀眾若是一時分心、漏看其中一幕,可以倒轉回看。

而至於為什麼需要快轉10秒?他則認為觀眾可能會想跳過片頭,馬上繼續看接下來的故事,為此團隊做了研究,發現 Netflix 會員對於節目開始前5分鐘手動跳過的機率約有 15%,這讓團隊有了信心,相信有很多觀眾會想略過片頭介紹,不只如此,團隊不想設計對於多種不同需求也許都有一點點幫助的功能,而是比較想設計出只有一種用途,但是非常有幫助的一項功能,目標是讓這項功能越單純越好,同時讓觀眾保有選擇權,可在觀賞影集或動畫選擇再看一次熟悉的片頭與主題曲,按鍵只在需要時出現在畫面上就好,而且最好只需要點擊一次就能發揮作用。

至於這個按鍵的名稱,團隊集思廣益想了幾個方案,包括「跳過片頭」、「略過開頭」、「快轉跳過」、「略過介紹」等等,甚至只有「略過」2字,接著再對隨機選中的 Netflix 會員進行功能測試,最初於美國、英國、加拿大等地的 250 個節目(不包括電影)中放入這個按鍵,而且一開始只在電腦網頁版上推出,這個看似簡單的功能得到觀眾的大量迴響,而且在社群媒體上也獲得非常多好評,其中又以「略過介紹」這個名稱的效果最好。

Cameron Johnson 還透露團隊一名工程師說道:「我覺得就算放一個『免費獲得杯子蛋糕』的按鍵,點擊數搞不好還比不上『略過介紹』。」。

到了2017年8月,Netflix也在電視App上新增了「略過介紹」功能,隔年5月則在手機App推出,特別的是,當電腦螢幕畫面上出現「略過介紹」按鍵時,按下鍵盤的「s」鍵其實也能略過介紹(Skip Intro),不必用到滑鼠來點擊,這可能是很少人知道卻很實用的Netflix快捷鍵。

時至今日,實在很難想像觀賞Netflix節目時若無「略過介紹」按鍵可按,會是什麼樣的情況,它已經變成大家愛用的功能,甚至其他串流服務也有類似設計,帶給全球觀眾無數便利的瞬間體驗。

About Netflix - Looking Back on the Origin of Skip Intro Five Years Later
Nowadays, it’s hard to imagine streaming your favorite series without using the ‘Skip Intro’ button.

比讚評價與倍速播放

Netflix 除了在介面設計上下了不少功夫,於使用者體驗上 也就是那些看不見的感受和感覺,我也有一些有趣的發現,像是不曉得大家有沒有看過,在 Netflix 進入到台灣以前,在看完每部影片之後,會跳出五顆星級的評價,是在後來才改成比讚跟倒讚,甚至之後還要推出雙手比讚,那這樣的設計,我們可以很直觀地猜到,比讚會比評幾顆星更容易觸發使用者的行動,也就是點個讚會比猶豫要給幾顆星來得簡單,而根據官方數據顯示這也的確可以增加兩倍以上評價的次數,不過我在這篇 2017 年的這篇網站新聞中發現這還有另一個用途,就是我們習慣的 Google 地圖上看餐廳幾顆星評價,這數字可以有效地幫助他人得到推薦,但這個評論對讓自己獲得更好推薦沒有多大幫助。

反觀,當人們看到按「讚」或按「爛」的拇指時,就知道它們的用途是幫助系統學習人們的喜好,這可以讓演算法推出更適合你的影片,而另一個 Netflix 在體驗最佳化做的事情是倍速播放,這並不是一個多麽新穎的功能,早在 YouTube 上就已經很多人習慣用 1.5 或 2 倍播放,也許你現在就是開兩倍在看,但 Netflix 在當時可是經歷了一番掙扎,對於這項功能,美國盲人協會和聾啞人協會都表示了相當的讚賞,認為這對於視聽障礙人士是十分重要的功能,但對於內容提供者們來說 像是演員和導演,卻反對以這種奇怪的節奏觀看他們的作品,最後選擇了推出了 0.5 和 0.75 倍慢速,以及 1.25, 1.5 快速播放的方案。

About Netflix - Goodbye Stars, Hello Thumbs

重點總結

好啦,以上就是我覺得 Netflix 在 UI/UX 設計上,很值得一起討論跟學習的地方

當然要將使用者體驗做最到好,除了介面之外還有許多細節也需要照顧,像是網路系統速度跟影片播放的最佳化等等。

在描寫 Netflix 管理策略的《零規則》這本書也有提到,Netflix 從郵遞影碟公司轉型成線上串流服務,從收購提案被百事達拒絕到海放 DVD 專賣店,現在在全球已經上線一百九十幾個國家跟地區,同時有超過一億六千七百萬名訂閱戶,其企業文化強調的「以人為本」,應用在 Netflix 的許多設計上就是「以使用者為核心」,這也是 UI 與 UX 設計的本質。

Netflix 用有力的資本跟科技創新的執行力,證明了這件事情。

各位同學在追劇的時候,有沒有也注意到什麼有趣的地方呢?,歡迎到 YouTube 影片下方留言跟我們分享,我是 Riven 我們下次見。