Проект 4. Какой из найденных объектов больше похож на исходный?
В этом проекте исполнители будут сравнивать найденную обувь с исходным изображением и определять, какой из вариантов более похож. Для сравнения в проекте вы дополните результаты из второго проекта, подробнее об этом на шаге Подготовьте и загрузите TSV-файл с заданиями.
Создайте проект
Чтобы создать проект, откройте Яндекс.Толоку для заказчика.
Выберите шаблон:
Нажмите кнопку + Создать проект.
Выберите шаблон Попарное сравнение изображений.
Заполните общую информацию:
В поле Название проекта введите
Какой из найденных объектов похож на исходный?
.В поле Описание введите
Решите, какая пара обуви больше похожа на исходную.
.По желанию добавьте Приватный комментарий.
Нажмите кнопку Сохранить.
Отредактируйте Интерфейс задания и блок Спецификации:
Примечание. В этом туториале показано, как создать интерфейс задания в редакторе HTML/JS/CSS. Вы также можете попробовать создать интерфейс задания в Конструкторе шаблонов.Подготовьте Интерфейс задания.
Удалите шаблонный код из блока html.
В блок html вставьте следующий код:
<div class="header"> <div class="left caption"> {{button label="Перейдите на сайт" href=uploaded_link_left size="L"}} <p class="url">{{uploaded_link_left}}</p> </div> <div class="right caption"> <p class="url">{{uploaded_link_right}}</p> {{button label="Перейдите на сайт" href=uploaded_link_right size="L"}} </div> </div> {{img src=image}} <div class="content clearfix"> <div class="left page"> {{iframe src=uploaded_link_left width="100%" height="700px" real-size=true screenshot=true}} </div> <div class="right page"> {{iframe src=uploaded_link_right width="100%" height="700px" real-size=true screenshot=true}} </div> </div> <div class="footer"> {{field type="radio" name="result" label="Левое изображение лучше" value=result_left hotkey="1"}} {{field type="radio" name="result" label="Правое изображение лучше" value=result_right hotkey="2"}} </div>
- В блоке js отредактируйте код, добавив следующие строки до строки
OnRender
.Внимание.Не удаляйте существующий код.
getTemplateData: function() { var data = TolokaHandlebarsTask.prototype.getTemplateData.apply(this, arguments), input = this.getTask().input_values; var left_link = input.left_link; var right_link = input.right_link; var uploaded_link_left = '', uploaded_link_right = '' if (Math.floor(Math.random() * 2)) { uploaded_link_left = left_link uploaded_link_right = right_link } else { uploaded_link_left = right_link uploaded_link_right = left_link } data.uploaded_link_left = uploaded_link_left; data.uploaded_link_right = uploaded_link_right; data.result_left = uploaded_link_left; data.result_right = uploaded_link_right; return data; },
Удалите шаблонный код из блока css.
- В блок css вставьте следующий код, отвечающий за установку пропорционального размера изображения.
.task { display: block; text-align:center; } .header { overflow: hidden; background-color: #FFCC00; } .caption { width: 50%; } .url { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: calc(100% - 182px); display: inline-block; vertical-align: bottom; } .button { margin: 10px; max-width: 182px; } .button__label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 150px; } .content { margin: 10px 0; } .page { display: inline-block; width: 50%; } .left { float: left; text-align: left; } .right { float: right; text-align: right; } .clearfix { overflow: hidden; width: 100%; }
Отредактируйте входные и выходные данные в блоке Спецификации.
Нажмите кнопку
, чтобы переключить графический режим на формат JSON.
В поле Входные данные введите:
{ "image": { "type": "url", "hidden": false, "required": true }, "left_link": { "type": "url", "hidden": false, "required": true }, "right_link": { "type": "url", "hidden": false, "required": true } }
В поле Выходные данные введите:
{ "result": { "type": "url", "hidden": false, "required": true } }
Подробнее о параметрах Спецификации читайте в разделе Входные и выходные данные.
Нажмите кнопку Предпросмотр.
В открывшемся окне проверьте работу опций задания.
Ответьте на вопрос.
В правом нижнем углу нажмите кнопку Отправить.
Выйдите из режима предпросмотра.
В нижнем левом углу нажмите кнопку Выйти.
В открывшемся окне нажмите кнопку Выйти.
В поле Инструкция введите инструкцию.
Текст инструкции:
Посмотрите на две фотографии с разной обувью и решите, какая пара обуви больше похожа на исходную пару. Используйте свое собственное чувство стиля, но помните, что обувь будет выглядеть одинаково, если она похожа по цвету, материалу, длине и стилю.
Нажмите кнопку Завершить.
Подробнее о работе с проектом читайте в разделе Проект.
Нажмите кнопку + Создать проект.
В открывшемся окне выберите шаблон Бок-о-боки изображений, для этого наведите указатель на шаблон и нажмите кнопку Выбрать.
В открывшемся окне заполните параметры проекта.
В поле Название проекта введите
Какой из найденных объектов больше похож на исходный?
.В поле Описание введите
Решите,какая пара обуви больше похожа на исходную.
.В поле Инструкция введите инструкцию.
Текст инструкции:
Посмотрите на две фотографии с разной обувью и решите, какая пара обуви больше похожа на исходную пару. Используйте свое собственное чувство стиля, но помните, что обувь будет выглядеть одинаково, если она похожа по цвету, материалу, длине и стилю.
- Примечание. В этом туториале показано, как создать интерфейс задания в редакторе HTML/JS/CSS. Вы также можете попробовать создать интерфейс задания в Конструкторе шаблонов.
Отредактируйте входные и выходные данные в блоке Спецификации.
Нажмите кнопку
, чтобы переключить графический режим на формат JSON.
В поле Входные данные введите:
{ "image": { "type": "url", "hidden": false, "required": true }, "left_link": { "type": "url", "hidden": false, "required": true }, "right_link": { "type": "url", "hidden": false, "required": true } }
В поле Выходные данные введите:
{ "result": { "type": "url", "hidden": false, "required": true } }
Подробнее о параметрах Спецификации читайте в разделе Входные и выходные данные.
Подготовьте Интерфейс задания.
Удалите шаблонный код из блока html.
В блок html вставьте следующий код:
<div class="header"> <div class="left caption"> {{button label="Перейдите на сайт" href=uploaded_link_left size="L"}} <p class="url">{{uploaded_link_left}}</p> </div> <div class="right caption"> <p class="url">{{uploaded_link_right}}</p> {{button label="Перейдите на сайт" href=uploaded_link_right size="L"}} </div> </div> {{img src=image}} <div class="content clearfix"> <div class="left page"> {{iframe src=uploaded_link_left width="100%" height="700px" real-size=true screenshot=true}} </div> <div class="right page"> {{iframe src=uploaded_link_right width="100%" height="700px" real-size=true screenshot=true}} </div> </div> <div class="footer"> {{field type="radio" name="result" label="Левое изображение лучше" value=result_left hotkey="1"}} {{field type="radio" name="result" label="Правое изображение лучше" value=result_right hotkey="2"}} </div>
- В блоке js отредактируйте код, добавив следующие строки до строки
OnRender
.Внимание.Не удаляйте существующий код.
getTemplateData: function() { var data = TolokaHandlebarsTask.prototype.getTemplateData.apply(this, arguments), input = this.getTask().input_values; var left_link = input.left_link; var right_link = input.right_link; var uploaded_link_left = '', uploaded_link_right = '' if (Math.floor(Math.random() * 2)) { uploaded_link_left = left_link uploaded_link_right = right_link } else { uploaded_link_left = right_link uploaded_link_right = left_link } data.uploaded_link_left = uploaded_link_left; data.uploaded_link_right = uploaded_link_right; data.result_left = uploaded_link_left; data.result_right = uploaded_link_right; return data; },
Удалите шаблонный код из блока css.
- В блок css вставьте следующий код, отвечающий за установку пропорционального размера изображения.
.task { display: block; text-align:center; } .header { overflow: hidden; background-color: #FFCC00; } .caption { width: 50%; } .url { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: calc(100% - 182px); display: inline-block; vertical-align: bottom; } .button { margin: 10px; max-width: 182px; } .button__label { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 150px; } .content { margin: 10px 0; } .page { display: inline-block; width: 50%; } .left { float: left; text-align: left; } .right { float: right; text-align: right; } .clearfix { overflow: hidden; width: 100%; }
Нажмите кнопку Предпросмотр.
В открывшемся окне проверьте работу опций задания.
Ответьте на вопрос.
В правом нижнем углу нажмите кнопку Отправить.
Выйдите из режима предпросмотра.
В нижнем левом углу нажмите кнопку Выйти.
В открывшемся окне нажмите кнопку Выйти.
В открывшемся окне нажмите кнопку Завершить редактирование.
Подробнее о работе с проектом читайте в разделе Проект.
Создайте пул
Чтобы создать пул:
Откройте страницу проекта с именем Какая обувь выглядит более похоже.
Нажмите кнопку Добавить пул.
Укажите Название пула.
(опционально) Укажите Приватное описание.
Включите опцию Добавить приватное описание.
В поле Приватное описание введите описание пула. Эта информация доступна только вам.
В разделе Цена за страницу заданий в поле Цена в долларах США укажите
0.01
. Больше примеров ценообразования можно посмотреть здесь.В разделе Исполнители отфильтруйте исполнителей.
Нажмите Добавить фильтр.
Найдите в списке блок Профиль исполнителя и выберите навык Языки.
В поле ? укажите
=
.Добавьте еще один фильтр. Нажмите Добавить фильтр.
Найдите в списке блок Навыки и выберите навык Выбрать навык.
В поле Выберите навык выберите Found_shoes.
В поле ? укажите
=
.Поле Отсутствует оставьте пустым.
В разделе Контроль качества задайте настройки контроля качества для пула:
Нажмите Добавить блок контроля качества.
Найдите в списке блок Правила и выберите пункт Быстрые ответы.
Задайте правило для быстрых ответов: если количество быстрых ответов больше 3, то заблокировать исполнителя на проекте на 10 дней. В качестве причины указать Быстрые ответы.
Подробнее о контроле качества читайте в разделе Контроль качества.
В разделе Перекрытие в поле Перекрытие укажите
10
.(опционально) В разделе Соотношение скорость/качество укажите какому проценту пользователей с лучшим рейтингом будет доступен указанный пул. Подробнее об это читайте в разделе Соотношение скорости и качества.
В разделе Параметры:
В поле Время на страницу заданий в секундах укажите
300
.Включите опцию Сохранять порядок заданий.
Нажмите кнопку Сохранить.
Подготовьте и загрузите TSV-файл с заданиями
Ознакомьтесь с примером в демонстрационном TSV-файле. Его можно найти на странице пула. В верхней части страницы слева есть ссылки на TSV-файл с обычными, контрольными и обучающими заданиями.
Скачайте TSV-файл, полученный в третьем проекте.
Создайте пары для каждого входного изображения, чтобы можно было сравнить два найденных изображения с исходным и решить, какое из них больше похоже.
Создавать пары можно вручную с помощью редактора текста или делать это автоматически, например, Python или Jupyter Lab.
Для примера вы можете использовать наши результаты https://tlk.s3.yandex.net/wsdm2020/SbS_Toloka_prep&aggr_data.ipynb.
Откройте пул Какой объект больше похож?.
Нажмите кнопку Загрузить. В открывшемся окне настройте параметры загрузки файла.
Выберите Указать вручную.
В поле Заданий на странице укажите
1
. Вы можете поэкспериментировать с количеством заданий на странице.Нажмите кнопку Загрузить.
В открывшемся окне выберите TSV-файл с заданиями для загрузки и нажмите кнопку Открыть.
Нажмите кнопку
, чтобы запустить пул.
Внимание.Поставленные задачи выполнят настоящие исполнители Яндекс.Толоки. Перепроверьте конфигурацию вашего проекта перед запуском пула.
Получите результаты
Чтобы получить результаты:
Нажмите кнопку Скачать результаты.
В блоке Статус оставьте включенной только опцию Принятые.
В блоке Поля оставьте включенной опции ссылка, id ответа и id пользователя.
Отключите опцию Разделять ответы пустой строкой.
- Попробуйте использовать модель Брэдли-Терри на полученных результатах. Для примера используйте наши результаты https://tlk.s3.yandex.net/wsdm2020/SbS_Toloka_prep&aggr_data.ipynb.
Что дальше
- Прочитайте подробнее про декомпозицию заданий.