如何打造一套獨特而流暢、能體現 HTC 品牌價值的使用者體驗？

HTC Sense 是旗艦系統：介面、體驗，以及所有決定一個世代性格的東西 —— 圖示、桌布、主題、動態、應用程式。四年裡的工作，是讓那個性格持續是「認得出來的 HTC」，而不只是每年都不一樣。

我 2012 年以視覺設計師的身分加入，負責 UI 與動態、素材、主題與桌布。與 UX 設計師並肩推進，確保 UI 和他們定義的體驗落地成同一件事；接著一路跟進到開發，一方面把他們的東西交接過去，一方面盯著實作有沒有照設計規範走。

那個時候，沒有方便的方法做出頁面轉場，也沒有任何工具能把體驗做成原型。所以動態不是最後才加上去的 —— 它就是我們用來知道這個體驗到底成不成立的方法。

這把一般的順序倒了過來，也是這一頁最能帶得走的東西。設計動畫這件事，本身就是在決定介面正在告訴使用者什麼：他從哪裡來、剛剛什麼變了、現在可以做什麼。一段跟不上的動畫，就是一條跟不上的流程；而它會在還很好改的階段就先失敗給你看。

一條個人時間軸。你去過哪裡、開了什麼、那是什麼時候 —— 手機本來就在記錄。live.me 把這些變成可以回頭讀的東西，於是沒有人需要記得寫日記，日記自己就寫成了。

我在這裡負責的是動態：畫面之間的轉場，以及在還沒有任何工具能把它做出來之前，用動畫去確認這個 app 該怎麼運作。和上面那幾個 Sense 世代同一套方法，只是這次的產品沒有前例可以參照。

另一半是 memories video 的主題設計。memories video 是 app 從你自己一段時間的紀錄裡自動組成的短片。主題，是為「還沒有人看過的素材」預先準備好的一套處理方式 —— 這正是它是設計問題而不是剪接問題的原因：它必須接得住任何被交到手上的東西，而大部分時候，交到手上的是平凡的一個星期。

設計團隊一邊和專案管理面對時程壓力，一邊和開發團隊面對可行性 —— 評估做得出什麼、把問題提早找出來，該讓步的就談出一個結果。

留下來的心得是關於時機：在專案允許的最早階段就進去。一個晚才提出的視覺判斷是「請求」；同一個判斷早點提出，就變成大家會繞著它設計的「前提」。系統設計師真正能影響的部分，大多在還沒有東西可以看之前就決定完了。

鎖定畫面是入口：使用者在解鎖任何東西之前就能碰到的功能都在這裡。它同時也是一個世代最先被看見的那一面，於是它在實用與識別這兩件事上，都是整個系統密度最高的地方。

Sense 4+ — 01

Sense 4+ — 02

Sense 4+ — 03

Sense 4+ — 04

Sense 4+ — 05

Sense 4+ — 06

Sense 4+ — 07

Sense 4+ — 08

Sense 5 — 01

Sense 5 — 02

Sense 5 — 03

Sense 5 — 04

Sense 5 — 05

編輯功能、濾鏡，以及它的社群那一面。

相片編輯器 — 01

相片編輯器 — 02

相片編輯器 — 03

相片編輯器 — 04

相片編輯器 — 05

定義格線與邊距，整齊的是整個系統，而不是單一畫面；定義互動，則是在流程和動態被畫出來之前就先把它們定下來。一份 Home 層級的規範，是為了讓之後的世代有一個東西可以對齊。

Home 層級規範 — 01

Home 層級規範 — 02

Home 層級規範 — 03

Home 層級規範 — 04

設定主畫面、編輯面板、重新排列 —— 這些操作決定了一個 launcher 感覺起來是你的，還是製造商的。

Home 與 BlinkFeed — 01

Home 與 BlinkFeed — 02

Home 與 BlinkFeed — 03

Home 與 BlinkFeed — 04

Home 與 BlinkFeed — 05

Home 與 BlinkFeed — 06

Home 與 BlinkFeed — 07

Home 與 BlinkFeed — 08

兩個世代的桌布。在一套跑這麼久的系統裡，桌布是唯一每年都能自由更換的元素，所以它剛好是一個世代可以說自己是什麼、而又不會弄壞任何必須保持穩定的東西的地方。

Sense 6 桌布

Sense 8 桌布