如果你這幾天開啟過對話，可能已經注意到有些地方感覺不太一樣了。
聊天介面變得安靜了一些。訊息更容易閱讀，控制項感覺更輕盈，面板和對話框也不再那麼跟對話本身搶注意力。沒有任何東西被搬到陌生的位置，但角色周圍的空間開始感覺更沉靜了。
我們從聊天開始，是因為那是許多人在 Reverie 待最久的地方。那裡也最適合用來檢驗這次改版背後的問題：當一個介面需要在整段對話中都讓人感到舒適，而不只是留下強烈的第一印象時，它應該給人什麼樣的感覺？
你在那裡看到的並不是一次單獨的改版，而是一套全新設計系統最先浮上檯面的部分。現在，我們已經把這套系統延伸到整個產品——從探索和角色頁面，到創作工具、故事、付款、獎勵、設定，以及穿插其間的各種小工具畫面。
Reverie 一向很有表現力。
這種個性隨處可見：醒目的邊框、明顯的陰影、層層堆疊的卡片、色彩繽紛的控制項，以及想讓人覺得像實體物件、而不只是螢幕上一個個矩形的介面元素。這讓產品充滿溫度，也讓人一眼就認得出是我們。
但一種視覺語言，可能很適合產品的某個階段，到了下一個階段卻變得太過厚重。
隨著 Reverie 成長，介面要支撐的已經不只是探索。大家花更長的時間待在對話裡、管理角色、撰寫故事、比較方案、設定進階工具，並在越來越複雜的流程之間來回切換。同樣的裝飾細節，放在形象頁上能增添個性，但在每一個對話框、卡片、選單和按鈕上反覆出現時，就可能變成視覺雜訊。
所以，我們重新設計 Reverie，並不是為了讓它變得沒有特色，而是要讓特色來自體驗本身。
更輕盈，而不是更冰冷
「輕量化」很容易淪為純白背景、纖細的灰色文字，以及存在感低到讓一切看起來像沒做完的元件。那從來不是我們的目標。
新的系統更安靜，但依然溫暖。
我們讓畫布從刺眼的純白，轉向帶有淡淡色調的中性底色。在需要長時間閱讀的地方，文字顏色更深、也稍微更有份量。邊框更節制，陰影更淺，色彩的使用也更有目的。結果是視覺重量減輕了，卻沒有失去 Reverie 作為故事與關係發生之地的感覺。
這種平衡在角色扮演中特別重要。一段對話不是設定後台。大家會閱讀很長的訊息，留意語氣中細微的變化，而且常常在同一個畫面停留很久。字體排印和背景顏色必須在二十分鐘後依然讓人感到舒適，而不只是在截圖裡看起來乾淨。
經得起長時間閱讀的字體排印
最重要的改變之一，同時也是最不起眼的改變之一：我們強化了文字層級。
大標題依然富有表現力，但內文現在更有視覺上的穩定感。重要的標籤、導覽項目和操作，都改用更容易快速掃讀的字重。次要文字依然是次要的，但不會再淡到讓閱讀變成一件苦差事。
原則很簡單：
- 長篇文字應該讓人感覺平穩、扎實。
- 在讀完每一個標籤之前，就應該能認出哪些是操作。
- 輔助資訊應該退居幕後，但不能消失。
- 頁面在不同螢幕、主題和環境光線下，都應該保持清晰易讀。
好的字體排印不會向你索取注意力，而是讓你更容易維持注意力。
整個產品使用同一套元件語言
這不是一頁一頁地換皮。我們重建了產品底層共用的元件語言。
按鈕、卡片、對話框、選單、分頁、表單控制項、表格、工具提示、通知訊息、抽屜、彈出面板和導覽元素，現在都遵循同一套規則：
- 圓角
- 邊框對比
- 表面顏色
- 層次高度
- 焦點指示
- 懸停與按下狀態
- 字重
- 間距
- 語意色彩
這種一致性比任何單一的視覺選擇都更重要。當同一類操作在任何地方都長得一樣、行為也一樣時，使用者就不必花那麼多力氣去理解介面。具破壞性的操作讓人感覺得到它的破壞性，被選取的選項讓人感覺得到它已被選取，浮動的面板讓人感覺得到它和下方頁面是分開的。主要操作很容易找到，而不是每個按鈕都爭著當主角。
我們也為強調、成功等狀態的操作加入了更清楚的語意樣式。它們現在是共用系統的一部分，而不是在個別功能裡另外重做的一次性漸層或自訂顏色。
真正困難的部分：找出例外
更新一個按鈕元件，並不會自動更新每一個按鈕。
產品會隨著時間累積許多局部決定：有自己邊框的價格卡片、帶有自訂光暈的獎勵對話框、有特殊背景的分享視窗、使用私有漸層的隱藏操作，或是從頭重做一套懸停效果的功能卡片。
一次改版之所以開始讓人覺得不一致，通常就出在這些例外上。
我們的檢視範圍不只限於元件庫，還把值得保留的客製化介面重新帶回共用的語言中。範圍包括行銷頁面、付款流程、獎勵、成就、角色與故事卡片、分享對話框、導覽控制項、空白狀態、橫幅，以及比較少人造訪的工具畫面。
並不是每個例外都被移除了。有些介面需要更鮮明的個性，因為它們要傳達慶祝、急迫、稀有或身分地位。差別在於，這些時刻現在是在延伸系統，而不是無視系統。
更少裝飾，更清楚的互動
這次改版移除了許多看起來像是可以互動、卻沒有提供任何有用資訊的效果。
不再是每張卡片都帶著厚重的陰影。懸停時的位移更加節制。漸層只保留給需要強調的時刻。邊框用來界定結構，而不是把每一塊內容都再框進另一個盒子裡。
與此同時，真正的互動狀態變得更清楚了：
- 被選取的選項會從視覺和語意上同時表明自己的狀態。
- 鍵盤焦點更容易跟上。
- 可互動的卡片有一致的懸停與焦點樣式。
- 按鈕透過共用樣式傳達層級。
- 對話框和選單能與背景區隔開來，又不會讓人覺得和產品脫節。
減少裝飾，讓我們有更多空間改善回饋。介面動得更少，但說得更多。
無障礙是視覺系統的一部分
一套設計系統如果只描述元件在滑鼠操作下的樣子，就是不完整的。
在這次重構中，我們重新檢視了焦點框、鍵盤行為、選取狀態的語意、對比度，以及可互動卡片的行為。部分控制項現在會更清楚地向輔助科技表明「已按下」或「已選取」的狀態。行為像連結的故事項目，可以用鍵盤移到並啟用。共用控制項的焦點樣式也遵循同一套視覺邏輯。
這些改變刻意做得很低調。無障礙不應該像是疊在產品上的另一個獨立模式，而應該本來就存在於預設行為之中。
為接下來打好更穩固的基礎
這項工作最有價值的成果，不是某個特定的色調、圓角或陰影，而是面對同一個設計問題時，產品不再有那麼多相互競爭的答案。
當我們打造新功能時，不再需要從零決定一個對話框該給人什麼感覺、一個輸入欄位該如何回應，或是被選取的卡片該如何呈現。系統已經提供了這些答案。這讓新工作進行得更快，但更重要的是，它讓最終的體驗更可預期。
一致性並不是要讓每個畫面都長得一模一樣，而是要給大家一套穩定的預期，讓內容可以變化，介面卻不會因此變得陌生。
我們希望你注意到什麼
理想情況下，一開始不會注意到太多。
Reverie 應該就是變得更好讀、瀏覽起來更平靜，而且當你從探索進入對話、創作和帳號工具時，整體感覺更連貫。重要的操作應該更快被看見。次要的控制項應該不再搶奪注意力。長時間使用也應該比較不會造成視覺疲勞。
角色依然富有表現力。故事依然充滿氛圍。值得慶祝的時刻，依然可以鮮明亮眼。
只是介面懂得什麼時候該開口——什麼時候又該安靜下來，讓其他一切得以被看見。
新的設計系統現在已延伸到整個 Reverie 體驗。如果有哪個地方感覺特別好用——或還是有點格格不入——歡迎到我們的 Discord 社群告訴我們。