“As a Windows user, it’s a very surreal way to install a program.”

Marcin Wichary

身為 Windows 使用者,這種安裝程式的方式真的很超現實

原文由 Marcin Wichary 發布,訂閱此部落格

Mac 的作業系統安裝 App 的方式有點奇特。App 通常會以副檔名為 .dmg 的檔案形式出現(全名是 “disk image” 磁碟映像檔,但我的大腦每次都會自動把它看成 “damage”),連點兩下後,它就會變成一顆虛擬磁碟。你點進去,就會看到 App 的圖示。

但旅程還沒結束。雖然你可以直接在這顆虛擬磁碟上執行 App,但重開機後——或是你把它退出後——這顆磁碟就會消失,所以對 App 來說,最好還是幫自己找個更長久的家。

許多 App 選擇的做法,是巧妙組合 Finder 提供的幾個選項。這些選項在任何資料夾裡都有、人人都能用,只是或許不太為人所知。第一步是把工具列、側邊欄和其他各種橫條全部藏起來。第二步是切換到圖示顯示方式,並選好適合的視窗大小。接下來需要的,是一個指向「應用程式」資料夾的捷徑。最後一樣素材呢?就是放在底層的自訂背景,它巧妙利用了所有圖示的大小與位置都是已知的這一點:

經過這樣一番改造,Finder 視窗看起來幾乎就像一個專屬的 App 視窗,而你可以運用這些技巧來……告訴使用者把 App 拖到永久的資料夾裡:

這個流程其實也有可取之處——把 App 圖示拖到「應用程式」資料夾的動作,和你在 Mac 上操作的其他手勢是一致的,也讓你學到 App 其實就只是一個檔案,你可以把它放在任何地方,不需要時就丟進垃圾桶。

不過整體來說,這還是讓人有點困惑,容易留下莫名殘留的虛擬磁碟,造成額外的混淆,並衍生出像這樣的問題:

但我今天不是要來重新爭辯這個流程本身的好壞,而是想來看看其中一些客製化的 Finder 視窗。它們在某種程度上,成了一個特別的設計遊樂場,限制剛剛好,多到足以讓它變得有趣:一個 App 圖示、一個「應用程式」資料夾的替身、兩者之間的箭頭、常見的固定大小,以及一張把一切串起來的點陣背景。

(歷史上其他讓許多設計師興奮的遊樂場還包括:計算機 App天氣 AppTwitter 用戶端……而在像素之外,還有錶面或是一張椅子。)

接下來,我翻遍了許多視窗,挑出我認為做得最精緻或最有趣的「拖到應用程式」設計。

箭頭

最直觀、最好發揮的地方就是箭頭,它可以是任何形狀、任何顏色……甚至可能根本不像箭頭:

不尋常的方向

最後那個視窗說明了,雖然在西方文化中,時間與流程習慣由左向右呈現,但不代表我們不能選擇不同的軸向。這裡還有幾個例子:

更明確的指示

你可能也已經注意到,上面有些設計不滿足於只有箭頭,還會在視窗中加上更明確的文字指示。

這裡還有更多例子。這個加上了簡單的兩個步驟,但或許也開始讓人覺得有點「箭頭之城」的感覺:

這個則以不同的方式分配兩個步驟,還試著把後續的清理也一併交代清楚,讓你不會留下殘留的虛擬磁碟:

這個帶有一點「廉價感」,但我覺得它的極簡反而很討喜——「捷徑」上的箭頭幾乎就兼作了操作指示的箭頭,既然你可以重新命名這個捷徑本身,何不乾脆把它改成一組指示呢?

而這個則有點像填空遊戲。這樣把(被動的)指示文字和(主動的)物件交錯擺放,到底是有效還是更讓人困惑呢?我也不太確定。

帶入情境的圖示

我還注意到一個有趣的手法,有些設計利用了圖示本身的立體感,把它們放進「真實世界」裡。

完形上的問題

接下來這幾個感覺有些問題——特別是在完形(gestalt)上——我覺得拿來看看應該會有所啟發。

第一個有非常強烈的由左至右的方向性,我不禁想,會不會有人試著把左邊藍色的資料夾拖到右邊那個上面?

這個則是一個關於箭頭有多百變的有趣案例,但同時也說明了如果違背慣例,會變得多麼彆扭:

這個我已經看過好幾次了——儘管有箭頭,看起來還是像一個 2×2、每個都同等重要的格子,也可能會被誤解為「把兩個項目拖到另外兩個項目上」:

而這個則是更好地達成上面那個視窗想做卻搞砸了的事情的範例:

不同的操作方式

並非所有 App 都選擇用箭頭拖曳的機制,有些甚至不被允許這麼做。以下是我特別喜歡的其他處理方式:

有趣的視覺

有些 App 在視覺上著墨很深。這裡有幾個我很喜歡的:

一個叫做 Inkscape 的現代 App 做了件有趣的事:

[Finder 背景]是由我們的使用者在網站上的關於頁面內容中所設計的。每次重大版本發布時都會舉辦!

所以我下載了 Inkscape 的所有主要版本,來展示給你看:

如今

這樣就很自然地來到了今天。我覺得 Firefox 值得額外嘉許,這麼多年來始終把他們的 Finder 安裝視窗維持得既美觀又優雅:

最後,讓我們用幾個漂亮的現代範例來作結。現在許多 App 都來自 App Store,完全跳過了 Finder 的流程,但這裡還有幾個仍會請你拖曳的例子:

就是這樣了!但如果你還有其他例子,也歡迎傳給我!

感謝 Chris Messina 建立了 Disk Images 收藏,本篇文章大量參考了其中的內容。還要感謝 Jean-Michel Durand、Mindaugas Rudokas、Louie Mantia、Colin、mimi、Jeremy Visser、Luke Dorny、Oskars 和 Peter Tripp。標題來自我在社群貼文中請大家提供優良範例時,其中一則回應的感想。

本文章由 muse-spark-1.2-contributor 進行翻譯

留言