이미지 비교 및 선호도 작업
Potato에서 선호도 순위, A/B 테스트, 시각 품질 평가를 위한 나란히 보기 이미지 비교 작업을 무작위 순서와 쌍별 점수와 함께 구축합니다.
이미지 작업의 상당수는 결국 하나의 질문으로 귀결됩니다. 이 중에서 어느 쪽이 더 나은가요? 생성 모델을 위한 선호도 데이터를 모을 때, 두 가지 압축 설정을 비교할 때, 디자인에 A/B 테스트를 돌릴 때, 검색이 올바른 이미지를 반환했는지 확인할 때 이 질문이 등장합니다. 사람은 이미지 하나만 따로 떼어 점수를 매기는 것보다 "A냐 B냐?"를 훨씬 잘하는데, 바로 이 점 때문에 비교 작업을 제대로 설계할 가치가 있습니다. 이 튜토리얼에서는 쌍별 비교, 순위 매기기, A/B 테스트를 다룹니다.
기본 쌍별 비교
쌍별 비교 인터페이스는 항목을 나란히 제시하고 선호도 선택 컨트롤을 함께 보여 줍니다:

annotation_task_name: "Image Preference"
data_files:
- data/pairs.json
item_properties:
id_key: pair_id
image_a_key: image_left
image_b_key: image_right
image:
enabled: true
layout: side_by_side
display_size: medium
enable_zoom: true
sync_zoom: true # Zoom both images together
annotation_schemes:
- annotation_type: radio
name: preference
description: "Which image do you prefer?"
labels:
- Left is much better
- Left is slightly better
- About the same
- Right is slightly better
- Right is much better데이터 형식
{
"pair_id": "pair_001",
"image_left": "/images/model_a_output.png",
"image_right": "/images/model_b_output.png",
"prompt": "A sunset over mountains"
}향상된 비교 인터페이스
annotation_task_name: "AI Image Generation Evaluation"
data_files:
- data/generation_pairs.json
item_properties:
id_key: id
image_a_key: image_a
image_b_key: image_b
context_key: prompt
# Show the generation prompt
display:
show_context: true
context_label: "Generation Prompt"
context_field: prompt
image:
enabled: true
layout: side_by_side
gap: 20 # Pixels between images
labels:
left: "Image A"
right: "Image B"
# Interaction
enable_zoom: true
sync_zoom: true
enable_pan: true
sync_pan: true
# Display
max_height: 500
background: "#1F2937"
border_radius: 8
annotation_schemes:
# Overall preference
- annotation_type: radio
name: overall_preference
description: "Overall, which image is better?"
labels:
- name: A much better
keyboard_shortcut: "1"
- name: A slightly better
keyboard_shortcut: "2"
- name: Tie
keyboard_shortcut: "3"
- name: B slightly better
keyboard_shortcut: "4"
- name: B much better
keyboard_shortcut: "5"
label_requirement:
required: true
# Specific criteria
- annotation_type: radio
name: prompt_adherence
description: "Which better matches the prompt?"
labels: [A, Tie, B]
- annotation_type: radio
name: visual_quality
description: "Which has better visual quality (no artifacts)?"
labels: [A, Tie, B]
- annotation_type: radio
name: aesthetic_appeal
description: "Which is more aesthetically pleasing?"
labels: [A, Tie, B]
- annotation_type: radio
name: realism
description: "Which looks more realistic?"
labels: [A, Tie, B, N/A (neither should be realistic)]
# Issues detection
- annotation_type: multiselect
name: issues_a
description: "Issues in Image A (select all)"
labels:
- Distorted faces/hands
- Text rendering issues
- Unnatural lighting
- Missing elements from prompt
- Extra unwanted elements
- Blurry or low quality
- Color issues
- None
- annotation_type: multiselect
name: issues_b
description: "Issues in Image B (select all)"
labels:
- Distorted faces/hands
- Text rendering issues
- Unnatural lighting
- Missing elements from prompt
- Extra unwanted elements
- Blurry or low quality
- Color issues
- None전후 비교
이미지 향상, 복원, 편집의 경우:
annotation_task_name: "Image Enhancement Evaluation"
data_files:
- data/enhancements.json
item_properties:
id_key: id
image_a_key: original
image_b_key: enhanced
image:
layout: side_by_side
labels:
left: "Original"
right: "Enhanced"
# Slider comparison
comparison_mode: slider # Drag slider to reveal
slider_position: 50 # Start at middle
annotation_schemes:
- annotation_type: radio
name: enhancement_quality
description: "How well was the image enhanced?"
labels:
- Significantly improved
- Slightly improved
- No noticeable change
- Made worse
- annotation_type: multiselect
name: improvements
description: "What was improved?"
labels:
- Sharpness/detail
- Color accuracy
- Noise reduction
- Dynamic range
- Artifact removal
- Nothing
- annotation_type: multiselect
name: problems_introduced
description: "Any problems introduced?"
labels:
- Over-sharpening/halos
- Color shift
- Loss of detail
- New artifacts
- Unnatural look
- None여러 이미지 순위 매기기
2개를 초과하는 이미지의 순위를 매길 때:
annotation_task_name: "Image Ranking"
data_files:
- data/image_sets.json
item_properties:
id_key: id
image_list_key: images # Array of image paths
image:
layout: grid
columns: 3
enable_zoom: true
annotation_schemes:
- annotation_type: ranking
name: preference_rank
description: "Rank images from best (1) to worst"
allow_ties: false
- annotation_type: radio
name: best_for_use
description: "Which would you use for this purpose?"데이터 형식:
{
"id": "set_001",
"prompt": "A cat sitting on a windowsill",
"images": [
"/images/set001_a.png",
"/images/set001_b.png",
"/images/set001_c.png",
"/images/set001_d.png"
]
}최고-최악 척도
최고와 최악 선택을 반복하여 효율적으로 순위를 매기는 방법:
annotation_schemes:
- annotation_type: bws
name: preference
description: "Select the BEST and WORST images"
best_description: "Best"
worst_description: "Worst"디자인을 위한 A/B 테스트
annotation_task_name: "Design A/B Test"
data_files:
- data/design_variants.json
item_properties:
id_key: id
image_a_key: variant_a
image_b_key: variant_b
context_key: design_context
display:
show_context: true
context_label: "Design Context"
image:
layout: side_by_side
labels:
left: "Design A"
right: "Design B"
randomize_order: true # Prevent position bias
annotation_schemes:
- annotation_type: radio
name: preference
description: "Which design do you prefer?"
labels: [A, No preference, B]
- annotation_type: likert
name: a_appeal
description: "Rate Design A's visual appeal"
size: 7
min_label: "Very unappealing"
max_label: "Very appealing"
- annotation_type: likert
name: b_appeal
description: "Rate Design B's visual appeal"
size: 7
min_label: "Very unappealing"
max_label: "Very appealing"
- annotation_type: text
name: reasoning
description: "Why did you choose this preference?"
rows: 4
label_requirement:
required: false전체 설정
annotation_task_name: "Generative Model Comparison - RLHF Data"
data_files:
- data/model_outputs.json
item_properties:
id_key: id
image_a_key: model_a_output
image_b_key: model_b_output
context_key: prompt
display:
show_context: true
context_label: "Generation Prompt"
context_style: "highlighted"
image:
enabled: true
layout: side_by_side
gap: 24
labels:
left: "Output A"
right: "Output B"
max_height: 512
enable_zoom: true
sync_zoom: true
enable_pan: true
sync_pan: true
background: "#111827"
border: "1px solid #374151"
border_radius: 8
# Prevent position bias
randomize_order: true
annotation_schemes:
- annotation_type: radio
name: overall
description: "Which image better represents the prompt?"
labels:
- name: A is clearly better
value: 2
keyboard_shortcut: "1"
- name: A is slightly better
value: 1
keyboard_shortcut: "2"
- name: About equal
value: 0
keyboard_shortcut: "3"
- name: B is slightly better
value: -1
keyboard_shortcut: "4"
- name: B is clearly better
value: -2
keyboard_shortcut: "5"
label_requirement:
required: true
- annotation_type: likert
name: confidence
description: "How confident are you?"
size: 5
min_label: "Guessing"
max_label: "Certain"
annotation_guidelines:
title: "Image Comparison Guidelines"
content: |
## Evaluation Criteria
Consider these factors:
1. **Prompt adherence**: Does it match what was asked?
2. **Visual quality**: Are there artifacts or distortions?
3. **Aesthetics**: Is it visually pleasing?
4. **Realism** (if applicable): Does it look natural?
## Tips
- Zoom in to check for details and artifacts
- Consider the prompt carefully
- Don't let one factor dominate unfairly
quality_control:
attention_checks:
output_annotation_dir: annotations/
export_annotation_format: jsonl출력 형식
{
"pair_id": "pair_001",
"prompt": "A sunset over mountains",
"image_a": "/images/model_a_output.png",
"image_b": "/images/model_b_output.png",
"display_order": ["B", "A"], // B was shown on left
"annotations": {
"overall": 1, // A slightly better (adjusted for display order)
"confidence": 4
},
"annotator": "rater_01",
"timestamp": "2024-12-25T14:30:00Z"
}비교 작업을 위한 팁
사람들은 마땅한 정도보다 왼쪽 이미지에 더 기우는 경향이 있으므로, 각 선택지가 어느 쪽에 놓일지 무작위로 정하십시오. 두 이미지의 줌과 팬을 연동하십시오. 그러지 않으면 주석자가 한쪽의 세부를 다른 쪽의 전체와 비교하게 됩니다. 이 작업에서 "더 낫다"가 무엇을 뜻하는지 분명히 말하십시오. 당연한 것이 아니기 때문입니다. 승자가 명백한 쌍 몇 개를 주의력 검사로 끼워 넣으십시오. 그리고 비교당 소요 시간을 살피십시오. 시간이 크게 들쭉날쭉하면 평가도 그럴 가능성이 높습니다.
구현 세부 사항은 쌍별 주석 문서를 참고하십시오.
다음 단계
전체 비교 문서는 쌍대 비교에서 확인하십시오.