By CJ Huang and Arjun Reddy

Blockchain technology has become more and more popular after the emergence of Bitcoin. Cryptocurrency is one of the implementations of Blockchain, which has been benefiting over a 100 million people. However, the majority of people don’t have the chance to get to know this…


Researchers are making it easier to design responsive visualizations.

Man in blue hoodie using a smartphone in 14 Street station with a train nearby.
Han, Hugh. Man in blue hoodie using a smartphone in 14 Street station with a train nearby.

Have you ever seen this kind of sloppy visualization when you browse your phone on a morning subway? One-third of the picture is out of frame; the text is too small to be read; the interactivities of the data visualization are…


還有最近學Inclusive Design的事

iOS 14 Logo
iOS14 image from Apple.com

這幾天有個有點迂迴的小故事,覺得挺有意思的,收穫很多,也讓我對蘋果的信仰值又加了一點。

我這學期修了一門課 Inclusive Design

上課時有一個題目:視障使用者在只能用單手的情況下(例如提取重物)如何做Zoom in放大的這個動作。
使用者的故事大概是這樣:
Hannah是一個視力曾經受損的同學。她需要用手機的Zoom in 放大功能才能辨識手機上的畫面。可是放大這個手勢基本上需要兩隻手才能做到(一手拿手機,一手用兩個指頭放大)。所以她去超市買東西要回家時,因為一隻手提塑膠袋,只有單手可以用,她就沒辦法放大她手機上的地圖來找路。

我跟我同學討論了一下,發現我們想到同一個解法:在手機背後加入input裝置,這樣他就可以用在手機背面用兩指操作放大縮小的功能,正面的大拇指可以拖移畫面。

懂Apple的人或設計師這時候大概都已經在偷笑了,因為iOS有Zoom Controller這個功能。他長得有點像大家常用的”小白點”( AssistiveTouch),一顆白白的。使用者用單手單指Press&Hold,手機就會放大畫面,Hold&Pan即可拖曳畫面。這就解決的剛剛上課提到的,單手放大問題。

可是Zoom Controller的”放大深度”是不可及時調整的。我的意思是,使用者單手單指點下Zoom Controller時,手機只能放大到固定的深度。雖然使用者可以在設定中客製化他需要的放大深度,但是還是沒辦法像用兩隻手指頭那樣,隨情況、隨時地調整需要的放大深度。所以我就在想,在背面加入一個input裝置,還是有用吧?又或者其實視障使用者不太需要這種細節的微調調整的功能?

想著想著,兩天就過去了,然後iOS14發布後,我看了下更新內容清單。Back Tap。 Back Tap!!!
我揉揉眼睛你有沒有搞錯? 先不要嚷嚷

這個功能是一個新的手勢,使用者可以在手機背後點兩下或三下,完成例如截圖、鎖屏、或Zoom的功能。
Zoom。Zoom!!!
沒搞錯吧,這太猛了啊,跟我還有我同學上課想到的很類似。

我整個超炸裂興奮,就開始研究這個新功能。結果發現這個手勢目前只能搭配開啟或關閉Zoom Controller。 還是沒有辦法達到所謂微調深度的功能。

雖然有點失望,可是開啟或關閉也算還蠻實用的,兩個小白點在手機畫面上面很容易誤觸,就像都已經Remote working了家裡除了兩個小孩,地上還有一隻狗一樣。

講了半天,問題還是沒解決。

不過這一整個過程下來,我感受到數位產品設計有太多的細節(又或者我喜歡說:永遠都有更多細節),也很想看看Apple未來會怎麼運用這個設計。

雖說如此,這個功能還是蠻酷的,大家可以點擊手機背後兩下就鎖屏或截圖。算是蠻方便又酷的功能。“Inclusive Design Process出來的產品,可以Benefit比目標用戶更多的用戶。”,這就算是一個例子吧。當然其他例子還有很多很多,不過這算是我這幾天感受最深的一個。

這門課真的很好玩。


iOS14 Home Screen的未來之戰

Widgets from Apple

Apple在2020年的WWDC發表了全新的iOS14,此更新將包含了Home Screen的新功能— Widget。沒有看過WWDC的朋友,這個功能簡單的解釋就是app icon不再只有一個圖標,許多資訊現在可以直接在這個進化版的app icon—”Widget”上呈現,讓使用者原本要進入app內才能完成的任務,現在在home screen上即可完成。這說明了設計師與開發者在未來可以考量使用者需求,將最重要的資訊”surface”(表面化)到Home Screen上。Widget更是一個跨iPhone、iPad以及Mac的全新Feature,所以了解如何設計一個好的widget是非常重要的。在WWDC中Apple的Human Interface Designer提出Widget的設計原則,以下來淺談一下我自己的筆記。

Widget設計時分為兩個思考階段。Ideation與Creation。Ideation階段提供了大方向資訊設計的處理,而Creation階段則在視覺與互動細節上提供了設計的指導方針。

Ideation: Principles, Editing, Multiples

Widget設計的首要重點是資訊。設計師需要了解到底什麼資訊對於自己App的使用者來說是最重要的,再將這些資訊surface到widget上面。Apple提供的3個Principles為Personal、Informational、Contextual。

Personal的資訊講求呈現私人資訊以提供使用者與App情感上的連結。例如照片app會直接在widget上呈現使用者的照片。Informational是在說將最重要的資訊向上移動,達成所謂”Glanceable”:使用者可以一眼就瞥見所有最需要的資訊以減少使用者點擊進入App中的麻煩。Contextual的資訊則可以讓使用者感受到自己的下一步被神奇地預測了,此即Contextual Design一書中所說的”Direct into Action”。(當然Smart Stack的功能已經為不同的Widgets提供了contextual prediction,這邊所討論的是指在同一個App的widget中如何選擇需要提供的資訊。) 天氣這個app提供了一個很棒的contexual實例。在還沒下雨時,App提供每一小時的天氣狀況。然而下雨後,因為使用者可能會最在乎什麼時候雨會停止,所以提供每分鐘的雨量強度的資訊。


簡單說說念了一年的想法

A night view of UMD campus
UMD Campus by Ryan Kosmides on Unsplash

網路上好像對我們學校 University of Maryland, College Park 的 MS in HCI Program 的評價普通,但這一兩年其實這個 program 有蠻多改變,我自己是唸得蠻開心的。所以身為現在在校唯一的台灣人,我來簡單說明一下這個 Program 的現況。希望之後台灣人能變多一點 😂 。也順便記錄一下人生只 …

CJ Huang

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store