Распознавание товаров на изображении

Напишите нам, если не нашли ответ в Справке. Вы можете приложить скриншоты или видео, чтобы ускорить помощь:

Написать в чат  Написать в Telegram

Используйте этот пресет, если вам нужно классифицировать, оценивать, модерировать содержимое изображений и размечать их для тренировки моделей машинного обучения.

В этом примере интерфейс разметки включает изображение, инструменты для разметки его областей, проверку выполнения, горячие клавиши и оформление задания.

Из каких компонентов состоит этот пример
  • view.list — отображает данные списком;
  • view.markdown — отображает текст в разметке Markdown;
Показать код
{
  "type": "view.markdown",
  "content": {
    "type": "helper.join",
    "items": [
      "**Категория одежды**:",
      {
        "type": "data.input",
        "path": "category"
      }
    ],
    "by": " "
  }
}

Компонент view.markdown потребляет много ресурсов и может влиять на производительность устройства исполнителя. Чтобы отобразить текст без разметки, используйте компонент view.text.

  • field.image-annotation — добавляет компонент для разметки изображений;
Показать код
{
  "type": "field.image-annotation",
  "image": {
    "type": "data.input",
    "path": "image"
  },
  "data": {
    "type": "data.output",
    "path": "result"
  },
  "fullHeight": true,
  "shapes": {
    "rectangle": true
  },
  "validation": {
    "type": "condition.required"
  }
}
  • plugin.toloka — настраивает внешний вид задания;
Показать код
{
  "type": "plugin.toloka",
  "layout": {
    "kind": "pager"
  }
}
Показать код
{
  "type": "plugin.field.image-annotation.hotkeys",
  "modes": {
    "select": "q",
    "rectangle": "e"
  },
  "confirm": "a",
  "cancel": "x"
}

Если вам не подходит этот пресет, посмотрите другие примеры в этом разделе.

Добавить описание

Чтобы добавить подробное описание к заданию, воспользуйтесь свойством label компонента field.image-annotation.

Показать код
{
  "type": "field.image-annotation",
  "label": "Посмотрите на фото и выделите продукт, который относится к указанной категории при помощи прямоугольного выделения.",
  "image": {
    "type": "data.input",
    "path": "image"
  },
  "data": {
    "type": "data.output",
    "path": "result"
  },
  "fullHeight": true,
  "shapes": {
    "rectangle": true
  },
  "validation": {
    "type": "condition.required"
  }
}

Добавить оформление

Чтобы исполнитель легче ориентировался в задании, оформите разные типы данных цветом с помощью компонента view.alert. Вы можете расположить его внутри view.list вместе с другими компонентами.

В этом примере описание задания выделено синим цветом.

Показать код
{
  "type": "view.alert",
  "theme": "info",
  "content": {
    "type": "view.text",
    "content": "Посмотрите на фото и выделите продукт, который относится к указанной категории прямоугольным выделением."
  }
}

Добавить поле для ввода ответ

Чтобы исполнители могли оставить комментарий, добавьте компонент для ввода многострочного текста field.textarea.

Показать код
{
  "type": "field.textarea",
  "label": "Оставьте свой комментарий",
  "hint": "Опишите, какой продукт вы видите на фотографии, введите название бренда и т.д.",
  "placeholder": "Введите текст",
  "data": {
    "type": "data.output",
    "path": "comment"
  }
}

Добавьте категории продуктов

Если вам нужно распределить продукты по категориям, воспользуйтесь свойствами labels компонента field.image-annotation. Учтите, что, если вы добавляете категории таким образом, требуется добавить минимум две.

На этом примере в интерфейсе используются три кнопки для выбора трех категорий товаров: обувь, джинсы и платье.

Показать код
{
  "type": "field.image-annotation",
  "image": {
    "type": "data.input",
    "path": "image"
  },
  "data": {
    "type": "data.output",
    "path": "result"
  },
  "labels": [
    {
      "label": "Обувь",
      "value": "shoes"
    },
    {
      "label": "Джинсы",
      "value": "jeans"
    },
    {
      "label": "Платье",
      "value": "dress"
    }
  ],
  "fullHeight": true,
  "shapes": {
    "rectangle": true
  },
  "validation": {
    "type": "condition.required"
  }
}

Добавить переключатель и уточняющий вопрос

Чтобы исполнитель мог сообщить о проблеме, добавьте переключатель Не могу разметить товар вместе с компонентами field.checkbox, helper.if и field.radio-group.

Показать код
{
  "type": "helper.if",
  "condition": {
    "type": "condition.equals",
    "data": {
      "type": "data.output",
      "path": "not_found"
    },
    "to": false
  },
  "then": {
    "type": "view.list",
    "items": [
      {
        "type": "field.image-annotation",
        "image": {
          "type": "data.input",
          "path": "image"
        },
        "data": {
          "type": "data.output",
          "path": "result"
        },
        "fullHeight": true,
        "shapes": {
          "rectangle": true
        },
        "validation": {
          "type": "condition.required"
        }
      }
    ]
  }
},
{
  "type": "field.checkbox",
  "preserveFalse": true,
  "label": "Не могу разметить товар",
  "hint": "На фото нет продукта, он видно не полностью, фото плохого качества или не загружается.",
  "data": {
    "type": "data.output",
    "path": "not_found"
  }
},
{
  "type": "helper.if",
  "condition": {
    "type": "condition.equals",
    "data": {
      "type": "data.output",
      "path": "not_found"
    },
    "to": true
  },
  "then": {
    "type": "field.radio-group",
    "label": "Выберите один из вариантов:",
    "options": [
      {
        "label": "На фото нет продукта",
        "value": "no_product"
      },
      {
        "label": "Продукт видно не полностью",
        "value": "not_fully_visible"
      },
      {
        "label": "Фото плохого качества",
        "value": "bad_quality"
      },
      {
        "label": "Фото не загружается",
        "value": "error"
      }
    ],
    "data": {
      "type": "data.output",
      "path": "option"
    },
    "validation": {
      "type": "condition.required",
      "hint": "Выберите один вариант."
    }
  }
}

Добавьте контрольный переключатель

Чтобы разрешить маркировку только после выполнения определенного условия, используйте свойство disabled компонента field.image-annotation.

В этом примере был добавлен переключатель, чтобы исполнители могли отмечать фото, на которых нет товара. Только если опция Товар есть на фото выбрана, исполнителям будет предоставлена возможность выделять продукты.

Показать код
{
  "type": "field.checkbox",
  "preserveFalse": true,
  "label": "Товар есть на фото",
  "hint": "Выберите эту опцию если товар есть на фото.",
  "data": {
    "type": "data.output",
    "path": "found"
  }
},
{
  "type": "helper.if",
  "condition": {
    "type": "condition.equals",
    "data": {
      "type": "data.output",
      "path": "found"
    },
    "to": false
  },
  "then": {
    "type": "field.image-annotation",
    "image": {
      "type": "data.input",
      "path": "image"
    },
    "data": {
      "type": "data.output",
      "path": "result"
    },
    "fullHeight": true,
    "disabled": true,
    "shapes": {
      "rectangle": true
    }
  },
  "else": {
    "type": "field.image-annotation",
    "image": {
      "type": "data.input",
      "path": "image"
    },
    "data": {
      "type": "data.output",
      "path": "result"
    },
    "fullHeight": true,
    "disabled": false,
    "shapes": {
      "rectangle": true
    },
    "validation": {
      "type": "condition.required"
    }
  }
}

Написать в службу поддержки