Bildvergleich und Präferenzaufgaben
So baust du in Potato Aufgaben zum Bildvergleich nebeneinander: für Präferenz-Rankings, A/B-Tests und die Beurteilung visueller Qualität, mit zufälliger Reihenfolge und paarweiser Bewertung.
Viel Arbeit mit Bildern läuft am Ende auf eine Frage hinaus: Welches davon ist besser? Sie taucht auf, wenn du Präferenzdaten für ein generatives Modell sammelst, wenn du zwei Kompressionseinstellungen gegenüberstellst, wenn du einen A/B-Test an einem Design fährst oder wenn du prüfst, ob eine Suche die richtigen Bilder geliefert hat. Menschen sind bei „A oder B?“ deutlich besser als beim Bewerten eines einzelnen Bildes für sich, und genau deshalb lohnt es sich, Vergleichsaufgaben sauber aufzusetzen. Dieses Tutorial behandelt paarweisen Vergleich, Ranking und A/B-Tests.
Einfacher paarweiser Vergleich
Die Oberfläche für den paarweisen Vergleich stellt die Elemente nebeneinander und bietet Bedienelemente für die Präferenzwahl:

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 betterDatenformat
{
"pair_id": "pair_001",
"image_left": "/images/model_a_output.png",
"image_right": "/images/model_b_output.png",
"prompt": "A sunset over mountains"
}Erweiterte Vergleichsoberfläche
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
- NoneVorher-Nachher-Vergleich
Für Bildverbesserung, Restaurierung oder Bearbeitung:
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
- NoneMehrere Bilder in eine Rangfolge bringen
Für Rankings mit mehr als 2 Bildern:
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?"Datenformat:
{
"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"
]
}Best-Worst Scaling
Effizientes Ranking über wiederholte Best-Worst-Entscheidungen:
annotation_schemes:
- annotation_type: bws
name: preference
description: "Select the BEST and WORST images"
best_description: "Best"
worst_description: "Worst"A/B-Test für Designs
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: falseVollständige Konfiguration
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: jsonlAusgabeformat
{
"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"
}Hinweise zu Vergleichsaufgaben
Menschen greifen häufiger zum linken Bild, als sie sollten; lass also zufällig entscheiden, auf welcher Seite eine Option landet. Koppel Zoom und Verschieben über beide Bilder hinweg, sonst vergleichen Annotierende am Ende ein Detail im einen mit dem Gesamteindruck im anderen. Sag ausdrücklich, was „besser“ in dieser Aufgabe heißen soll, denn selbsterklärend ist es nicht. Streu ein paar Paare mit eindeutigem Sieger als Aufmerksamkeitstests ein. Und behalte die Zeit pro Vergleich im Blick: Schwankt sie stark, tun es die Bewertungen vermutlich auch.
Zu den Implementierungsdetails siehe die Dokumentation zur paarweisen Annotation.
Nächste Schritte
- Richte Crowdsourcing für Präferenzdaten in großem Umfang ein
- Lies über Ranking-Auswertung
- Sieh dir die Dokumentation zum paarweisen Vergleich an
Vollständige Dokumentation zum Vergleich unter Paarweiser Vergleich.