Документация Толоки

Попарное сравнение аудио

Обратите внимание

Документация на русском языке может быть устаревшей. Самые последние изменения доступны в документации на английском языке.

Для такого проекта в Толоке есть пресет Сравнение аудиозаписей (Side-by-side).

Посмотрите пример — он состоит из двух аудио и кнопок выбора ответа. В нем уже настроена валидация, горячие клавиши и внешний вид задания.

Из каких компонентов состоит этот пример

  • view.audio — аудиоплеер;

    Показать код
    {
  "type": "view.audio",
  "url": {
    "type": "data.input",
    "path": "url_1"
  },
  "label": "Audio 1",
    "validation": {
    "type": "condition.played",
    "hint": "Listen to the audio recording"
  }
}

  • layout.columns — размещает аудиодорожки справа и слева друг от друга;

    Показать код
    {
  "type": "layout.columns",
  "items": []
}

  • condition.played — проверяет, что исполнитель начал слушать аудио;

    Показать код
    {
  "type": "condition.played",
  "hint": "Listen to the audio recording"
}

  • field.button-radio-group — кнопки вариантов ответа;

    Показать код
    {
  "type": "field.button-radio-group",
  "label": "Whose voice sounds more natural?",
  "options": [],
  "validation": {
    "type": "condition.required",
    "hint": "Choose an answer."
  },
  "data": {
    "type": "data.output",
    "path": "result"
  }
}

  • condition.required — проверяет, что выбран хотя бы один вариант;

    Показать код
    {
  "type": "condition.required",
  "hint": "Choose an answer."
}

  • plugin.toloka — настраивает внешний вид задания;

    Показать код
    {
  "type": "plugin.toloka",
  "layout": {
    "kind": "scroll",
    "taskWidth": 800
  }
}

  • plugin.hotkeys — горячие клавиши.

    Показать код
    {
  "1": {
    "type": "action.set",
    "data": {
      "type": "data.output",
      "path": "result"
    },
    "payload": "audio_1"
  },
  "2": {
    "type": "action.set",
    "data": {
      "type": "data.output",
      "path": "result"
    },
    "payload": "audio_2"
  },
  "3": {
    "type": "action.set",
    "data": {
      "type": "data.output",
      "path": "result"
    },
    "payload": "error"
  },
  "type": "plugin.hotkeys"
}

Примечание

Вы можете добавлять медиафайлы (аудио, видео, картинки) со своего сервера, Яндекс Диска или из облачных хранилищ, таких как Yandex Cloud, Google Cloud, Amazon AWS и т.п.

Что еще можно настроить

  • Добавьте проверку, что аудио прослушали до конца — замените компонент condition.played на condition.played-fully.

    Показать код
    {
  "type": "condition.played-fully",
  "hint": "Listen to the audio recording"
}

  • Пригодится для коротких аудио — поставьте их на повтор, добавив в свойства компонента view.audio loop: true.

    Показать код
    {
  "type": "view.audio",
  "url": {
    "type": "data.input",
    "path": "url_1"
  },
  "label": "Audio 1",
  "loop": true,
  "validation": {
    "type": "condition.played",
    "hint": "Listen to the audio recording"
  }
}

  • Добавьте горячие клавиши с помощью плагина plugin.hotkeys для воспроизведения или остановки аудиозаписи.

    Показать код
    {
  "q": {
    "type": "action.play-pause",
    "view": {
      "$ref": "view.items.0.items.0"
    }
  },
  "w": {
    "type": "action.play-pause",
    "view": {
      "$ref": "view.items.0.items.1"
    }
  },
  "type": "plugin.hotkeys"
}

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

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

Если вам нужны комментарии от исполнителя, то добавьте поле для ввода текста с помощью field.textarea. В этом примере настроена дополнительная валидация, которая обязывает написать текст, если выбрано одно из двух аудио.

Показать код
{
  "type": "field.textarea",
  "label": "Please explain why you chose it.",
  "data": {
    "type": "data.output",
    "path": "text"
  },
  "validation": {
    "type": "condition.required",
    "hint": "Enter text."
  }
}

Расположить друг под другом

Аудио можно расположить друг под другом. Этот интерфейс лучше подойдет для сравнения более двух аудиозаписей.

Добавить исходный текст

Вы можете добавить поле с исходным текстом с помощью компонента view.text. Например, если вы хотите выяснить, какая из аудиозаписей лучше подходит под описание.

Показать код
{
  "type": "view.text",
  "content": "A joyful, inspiring melody.",
  "label": "Overview"
}

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

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

Показать код
{
  "type": "view.alert",
  "theme": "info",
  "content": {
    "type": "view.text",
    "content": "A joyful, inspiring melody."
  }
},
{
  "type": "view.alert",
  "theme": "warning",
  "content": {
    "type": "field.button-radio-group",
    "label": "Which audio recording best fits the description?",
    "options": [],
    "validation": {
      "type": "condition.required",
      "hint": "Choose an answer."
    },
    "data": {
      "type": "data.output",
      "path": "result"
    }
  }
}

В этой статье: