Рекомендации по дизайну

В Docker мы стремимся создавать инструменты, которые интегрируются в существующие рабочие процессы пользователя, а не требуют от них внедрения новых. Мы настоятельно рекомендуем вам следовать этим рекомендациям при создании расширений. Мы просматриваем и одобряем вашу публикацию в Marketplace на основе данных требований.

Вот простой контрольный список, который нужно выполняет при создании расширения:

  • Легко ли начать?

  • Легко ли им пользоваться?

  • Легко ли получает помощь в случае необходимости?

Создаёт согласованный опыт с Docker Desktop.

Используйте Тема пользовательского интерфейса Docker Material и Руководство по стилю расширений Docker, чтобы убедиться, что ваше расширение является частью Docker Desktop, чтобы обеспечить удобство работы для пользователей.

  • Убедиться, что расширение имеет как светлую, так и темную тему. Использование компонентов и стилей в соответствии с руководством по стилю Docker гарантирует, что ваше расширение соответствует стандарту доступности уровня AA.

    light and dark mode
  • Убедиться, что значок вашего расширения виден как в светлом, так и в темном режиме.

    icon colors
  • Убедиться, что поведение навигации соответствует остальной части Docker Desktop. Добавляет заголовок, чтобы установить контекст для расширения.

    header
  • Избегать встраивания окон терминала. Преимущество Docker Desktop по сравнению с CLI заключается в том, что у нас есть возможность предоставлять пользователям обширную информацию. Максимально используйте данный интерфейс.

    terminal window dont
    terminal window do

Создавать функции изначально

  • Чтобы не нарушать поток пользователей, избегать сценариев, в которых пользователю приходится выходить за пределы Docker Desktop, например, в интерфейс командной строки или на веб-страницу для выполнения определённых функций. Вместо этого создавать функции, присущие Docker Desktop.

    switch context dont
    switch context do

Разделяет сложные потоки пользователей

  • Если поток слишком сложен или концепция абстрактна, разбейте поток на несколько шагов с одним простым призывом к действию на каждом этапе. Это помогает при подключении начинающих пользователей к вашему расширению

    complicated flow
  • Там, где есть несколько призывов к действию, убедиться, что вы используете основную (стиль закрашенной кнопки) и второстепенную кнопку (стиль кнопки контура), чтобы передать важность каждого действия.

    call to action

Адаптация новых пользователей

При создании расширения убедиться, что пользователи, впервые использующие расширение и ваш продукт, могут понять его ценность и легко принять его. Убедиться, что вы включили контекстную справку в расширение.

  • Убедиться, что вся необходимая информация добавлена в Marketplace расширений, а также на страницу сведений о расширениях. Это должно включать:

  • Скриншоты расширения. Обратите внимание, что рекомендуемый размер скриншотов — 2400x1600 пикселей.

  • Подробное описание, в котором рассказывается, какова цель расширения, кому оно может быть полезным и как оно работает.

  • Ссылка на необходимые ресурсы, такие как документация.

  • Если ваше расширение имеет особенно сложный функционал, добавляет демо или видео на стартовую страницу. Это помогает быстро адаптироваться новичку.

start page

Что дальше?