Docker 擴充套件的設計指南

在 Docker,我們的目標是構建融入使用者現有工作流程的工具,而不是要求他們採用新的工具。我們強烈建議您在建立擴充套件時遵循這些指南。我們將根據這些要求審查並批准您的市場釋出。

以下是一份簡單的清單,供您在建立擴充套件時參考

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

建立與 Docker Desktop 一致的體驗

使用 Docker Material UI 主題Docker 擴充套件樣式指南 來確保您的擴充套件感覺像是 Docker Desktop 的一部分,從而為使用者創造無縫的體驗。

  • 確保擴充套件具有淺色和深色主題。根據 Docker 樣式指南使用元件和樣式,可以確保您的擴充套件滿足 AA 級可訪問性標準

    Light and dark mode
  • 確保您的擴充套件圖示在淺色和深色模式下都可見。

    Icon colors in light and dark mode
  • 確保導航行為與 Docker Desktop 的其餘部分保持一致。新增一個標題來為擴充套件設定上下文。

    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

分解複雜的流程

  • 如果流程過於複雜或概念過於抽象,請將流程分解成多個步驟,每個步驟只有一個簡單的號召性用語。這在引導新手使用者使用您的擴充套件時很有幫助。

    A complicated flow
  • 在有多個號召性用語的情況下,確保您使用主要(填充按鈕樣式)和次要按鈕(輪廓按鈕樣式)來傳達每個操作的重要性。

    Call to action

引導新使用者

在建立擴充套件時,請確保擴充套件和產品的首次使用者可以理解其增值功能並輕鬆地採用它。確保您在擴充套件中包含上下文幫助。

  • 確保將所有必要資訊新增到擴充套件市場以及擴充套件詳細資訊頁面。這應該包括

    • 擴充套件的螢幕截圖。請注意,推薦的螢幕截圖大小為 2400x1600 畫素。
    • 詳細說明擴充套件的用途、誰會發現它有用以及它的工作原理。
    • 連結到必要的資源,例如文件。
  • 如果您的擴充套件具有特別複雜的功能,請在起始頁面新增演示或影片。這有助於引導首次使用者快速上手。

    start page

下一步是什麼?