Synology DSM 8.0

Company

Synology

Role

UI Designer

Year

2025

DSM 為 Synology NAS 的作業系統,擁有直觀友善的操作介面,使用者可透過網頁隨時進行管理檔案、備份、多媒體、協作等各種任務。

Web UI

Design System

Product goal

下一世代的 NAS 作業系統

下一世代的 NAS 作業系統

Mission and Role

Synology NAS 作業系統 DSM 7.0 於 2021 年發布,隨著使用者介面潮流的變革與公司產品逐步往企業級方向邁進,預計在 2026 年推出新一代的 NAS 作業系統 DSM 8.0。在此計劃中擔任了 UI 改版提案者的角色之一,與團隊共同發想 Rebranding 關鍵字並從此延伸視覺進行改版,後續也為產品加入 Dark mode 與 High Contrast mode 的色彩計劃調整,讓產品能夠更具包容系的符合使用者需求。

Synology DSM 8.0

Company

Synology

Role

UI Designer

Year

2025

DSM 為 Synology NAS 的作業系統,擁有直觀友善的操作介面,使用者可透過網頁隨時進行管理檔案、備份、多媒體、協作等各種任務。

Synology DSM 8.0

Company

Synology

Role

UI Designer

Year

2025

DSM 為 Synology NAS 的作業系統,擁有直觀友善的操作介面,使用者可透過網頁隨時進行管理檔案、備份、多媒體、協作等各種任務。

DSM 7.0 UI Style

現行 DSM 7 版本桌面與 File Station 顯示樣式。

Workshop

品牌關鍵字與標語發想

品牌關鍵字與標語發想

Design Process

在對 DSM8.0 的介面設計前,首先進行了 Synology 的品牌關鍵字工坊,與 3-5 位設計同仁共同發散想法,透過 AI 初步整合 50 個品牌關鍵字,從中提案適合的品牌標語,並尋找對應的 Moodboard 圖片進行討論,最後定調出 8.0 的主要視覺訴求:直觀的 、靈活及創新、平衡。

UI Concept

DSM 8.0 介面提案

DSM 8.0 介面提案

Design Process

透過工作坊結論出的視覺指引,以「直觀、靈活、平衡」作為 8.0 改版方向,將 DSM 桌面之工具列、Widget 視窗、應用程式視窗進行調整。在直觀的層面我們改善介面的視覺層級,讓相對重要的資訊擁有更好的對比度。在靈活層面我們加入半透明效果,讓介面看起來更具有穿透與延展性。在平衡層面則調整了整體的介面色票,使其具有優雅但不失穩重的調性。

Color Refinement

彩色票改版與收斂

彩色票改版與收斂

Design Process

在 DSM 8.0 改版上執行了色票改版的任務,將 7.0 的色彩調整得更為沉穩,以呼應工作坊的結論中安全、平衡、穩重之理念。同時也與公司內部的其他服務對照,來比對色彩革新上的差異。

色票的階層數也進行了改善,將彩色色票階數收斂至 10 階,使其可符合 Dark Theme 與高對比模式 (WCAG規範) 的需求。每一階的顏色也透過 OKLCH 中的明度值來進行確認,使其在不同狀態色之間的明度具有一致性。

Color Refinement

灰階色票改版與收斂

灰階色票改版與收斂

Design Process

灰階的色票改版相對複雜,因使用灰階 token 的元件數量龐雜,需先進行 Sementic Token 展開並列出所指向的 Primitive 灰階色票,來確認是否有多餘的階層可以刪除。最後將灰階的數量收斂到 16 階,以配合 Dark Theme 上的需求,並細微調整每一階梯度上的對比值,例如在越深色的顏色對比值會相較於淺色值要更高,因人類的眼睛在深色差異的識別度較淺色更弱。

Color Refinement

切換黑暗模式

切換黑暗模式

Design Process

在完成彩色與灰階色票結構整理後,將這些修正更新回 Figma 的 Color Token Variables,讓介面設計師能夠在執行設計時,一鍵轉換成黑暗模式來確認效果。

Next project

Synology DS Cam

Synology DS Cam