Docker Extensions 設計準則

在 Docker,我們的目標是開發能整合進使用者現有工作流程的工具,而非要求他們採用全新的流程。我們強烈建議您在開發 Extensions 時遵循這些準則。我們將根據這些要求來審查並核准您的 Marketplace 發布項目。

以下是您開發 Extension 時應確認的簡單檢核表:

  • 是否容易上手?
  • 是否易於使用?
  • 在需要時是否容易獲得協助?

創造與 Docker Desktop 一致的使用體驗

請使用 Docker Material UI 主題Docker Extensions 風格指南,確保您的 Extension 給人一種身為 Docker Desktop 一部分的感覺,進而為使用者創造流暢的體驗。

  • 確保 Extension 同時具備淺色與深色主題。遵循 Docker 風格指南中的元件與樣式,可確保您的 Extension 符合 AA 級無障礙標準

    Light and dark mode
  • 確保您的 Extension 圖示在淺色與深色模式下均清晰可見。

    Icon colors in light and dark mode
  • 確保導覽行為與 Docker Desktop 其餘部分保持一致。新增一個標題 (header) 以設定 Extension 的情境。

    Header that sets the context
  • 避免嵌入終端機視窗。相較於 CLI,Docker Desktop 的優勢在於我們能夠為使用者提供豐富的資訊。請盡量多加利用此介面。

    Terminal window used incorrectly
    Terminal window used correctly

原生建構功能

  • 為了不中斷使用者的操作流,請避免出現使用者必須離開 Docker Desktop(例如前往 CLI 或網頁)才能執行某些功能的情況。請改為建構 Docker Desktop 原生的功能。

    Incorrect way to switch context
    Correct way to switch context

拆解複雜的使用者流程

  • 如果流程太過複雜或概念過於抽象,請將流程拆解為多個步驟,且每個步驟只包含一個簡單的號召性用語 (call-to-action)。這有助於引導初次接觸 Extension 的使用者。

    A complicated flow
  • 當有多個號召性用語時,請確保使用主要按鈕(填滿樣式)與次要按鈕(外框樣式)來傳達每個操作的重要性。

    Call to action

引導新使用者

開發 Extension 時,請確保初次使用的使用者與您的產品受眾能夠理解其附加價值並輕鬆上手。確保在 Extension 內包含情境相關的輔助說明。

  • 確保所有必要資訊都已新增至 Extensions Marketplace 及 Extensions 詳細資料頁面。這應包括:

    • Extension 的螢幕截圖。請注意,建議的螢幕截圖尺寸為 2400x1600 像素。
    • 詳細說明:涵蓋此 Extension 的用途、誰會覺得它有用,以及它的運作方式。
    • 連結至必要的資源,例如說明文件。
  • 如果您的 Extension 具有特別複雜的功能,請在起始頁面加入示範或影片。這有助於讓初次使用者快速上手。

    start page

下一步是什麼?

© . This site is unofficial and not affiliated with Kubernetes or Docker Inc.