GPT-4o
Challenge Creator
Creative Challenge
"Robot watering a flower under a tiny umbrella in the rain."
<svg viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="bgGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#232931; stop-opacity:1" />
<stop offset="100%" style="stop-color:#393e46; stop-opacity:1" />
</linearGradient>
<linearGradient id="robotBodyGradient" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:#b0bec5;" />
<stop offset="50%" style="stop-color:#eceff1;" />
<stop offset="100%" style="stop-color:#90a4ae;" />
</linearGradient>
<linearGradient id="robotLimbGradient" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:#78909c;" />
<stop offset="100%" style="stop-color:#546e7a;" />
</linearGradient>
<radialGradient id="robotEyeGradient" cx="50%" cy="50%" r="50%" fx="30%" fy="30%">
<stop offset="0%" style="stop-color:#4dd0e1;" /> <!-- Cyan -->
<stop offset="70%" style="stop-color:#00acc1;" />
<stop offset="100%" style="stop-color:#00838f;" />
</radialGradient>
<radialGradient id="flowerPetalGradient" cx="50%" cy="50%" r="60%" fx="50%" fy="40%">
<stop offset="0%" style="stop-color:#ff80ab;" /> <!-- Pink -->
<stop offset="60%" style="stop-color:#f06292;" />
<stop offset="100%" style="stop-color:#ec407a;" />
</radialGradient>
<linearGradient id="flowerPotGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#d2691e;" /> <!-- Terracotta -->
<stop offset="100%" style="stop-color:#a0522d;" />
</linearGradient>
<linearGradient id="umbrellaGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#ffee58;" /> <!-- Yellow -->
<stop offset="100%" style="stop-color:#f57f17;" /> <!-- Darker Yellow/Orange -->
</linearGradient>
<linearGradient id="wateringCanGradient" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:#64b5f6;" /> <!-- Light Blue -->
<stop offset="100%" style="stop-color:#2196f3;" /> <!-- Blue -->
</linearGradient>
</defs>
<!-- Background -->
<rect width="300" height="300" fill="url(#bgGradient)" />
<!-- Ground -->
<path d="M0 250 Q 75 235, 150 250 T 300 245 V 300 H 0 Z" fill="#4a4e54" />
<path d="M0 260 Q 60 253, 120 260 T 200 255 T 300 260 V 300 H 0 Z" fill="#52575f" opacity="0.6"/>
<!-- Puddle -->
<ellipse cx="200" cy="265" rx="30" ry="10" fill="#3e444c" opacity="0.7" />
<ellipse cx="200" cy="264" rx="28" ry="8" fill="#5c6bc0" opacity="0.3" transform="rotate(-5 200 264)" />
<!-- Flower and Pot (centered around x=200) -->
<g id="flower-group">
<!-- Pot -->
<path d="M188 260 L183 240 H217 L212 260 Z" fill="url(#flowerPotGradient)" stroke="#8d6e63" stroke-width="1"/>
<!-- Stem -->
<path d="M200 240 Q 195 220 200 200" stroke="#4caf50" stroke-width="3.5" fill="none" stroke-linecap="round"/>
<!-- Leaves -->
<ellipse cx="193" cy="225" rx="12" ry="5" fill="#66bb6a" transform="rotate(-35 193 225)" />
<ellipse cx="207" cy="220" rx="12" ry="5" fill="#66bb6a" transform="rotate(35 207 220)" />
<!-- Petals -->
<g transform="translate(200 198)">
<circle cx="0" cy="-12" r="10" fill="url(#flowerPetalGradient)" />
<circle cx="0" cy="-12" r="10" fill="url(#flowerPetalGradient)" transform="rotate(72 0 0)" />
<circle cx="0" cy="-12" r="10" fill="url(#flowerPetalGradient)" transform="rotate(144 0 0)" />
<circle cx="0" cy="-12" r="10" fill="url(#flowerPetalGradient)" transform="rotate(216 0 0)" />
<circle cx="0" cy="-12" r="10" fill="url(#flowerPetalGradient)" transform="rotate(288 0 0)" />
</g>
<!-- Flower Center -->
<circle cx="200" cy="198" r="7" fill="#ffeb3b" stroke="#f9a825" stroke-width="1"/>
</g>
<!-- Robot -->
<g id="robot">
<!-- Legs/Base -->
<rect x="80" y="235" width="40" height="15" fill="#607d8b" rx="3" />
<ellipse cx="85" cy="250" rx="10" ry="5" fill="#455a64" />
<ellipse cx="115" cy="250" rx="10" ry="5" fill="#455a64" />
<!-- Body -->
<rect x="75" y="180" width="50" height="60" fill="url(#robotBodyGradient)" rx="5" stroke="#546e7a" stroke-width="0.5"/>
<!-- Neck -->
<rect x="92" y="170" width="16" height="10" fill="#78909c" />
<!-- Head -->
<rect x="85" y="140" width="30" height="30" fill="url(#robotBodyGradient)" rx="4" stroke="#546e7a" stroke-width="0.5"/>
<circle cx="100" cy="155" r="7" fill="url(#robotEyeGradient)" />
<path d="M93 163 Q100 165 107 163" stroke="#37474f" stroke-width="1.5" fill="none" stroke-linecap="round" /> <!-- smile -->
<!-- Arms -->
<g stroke="url(#robotLimbGradient)" stroke-width="12" stroke-linecap="round">
<!-- Left Arm (holding umbrella) -->
<line x1="78" y1="190" x2="55" y2="210" />
<line x1="55" y1="210" x2="40" y2="220" />
<!-- Right Arm (holding watering can) -->
<line x1="122" y1="190" x2="145" y2="215" />
<line x1="145" y1="215" x2="165" y2="230" />
</g>
<!-- Hands (drawn on top of arm ends, but under items) -->
<circle cx="40" cy="220" r="7" fill="#78909c" /> <!-- Left hand -->
<circle cx="165" cy="230" r="7" fill="#78909c" /> <!-- Right hand -->
</g>
<!-- Watering Can (held by robot's right hand at (165,230)) -->
<g id="wateringCan" transform="translate(165 230) rotate(-20)">
<!-- Handle, grabbed at (0,0) local -->
<path d="M 0,0 C -15,0 -20,-5 -20,-15" stroke="#2196f3" stroke-width="6" fill="none" stroke-linecap="round"/>
<!-- Body of can -->
<path d="M -5,-25 A 20,20 0 0 0 -5,15 L 25,15 A 20,20 0 0 0 25,-25 Z" fill="url(#wateringCanGradient)" stroke="#1976d2" stroke-width="0.5"/>
<!-- Spout -->
<path d="M -5,0 L -25,-15 Q -30,-25 -35,-25 L -40,-20 Z" fill="url(#wateringCanGradient)" stroke="#1976d2" stroke-width="0.5"/>
<ellipse cx="-38" cy="-23" rx="4" ry="2" fill="#90a4ae" transform="rotate(-30 -38 -23)" /> <!-- Spout head -->
<!-- Water Stream (target flower at global (200,250), which is local (40,7) approx after rotation) -->
<path d="M -38 -23 Q -10 -5, 40 7" stroke="#bbdefb" stroke-width="2.5" fill="none" stroke-dasharray="3 2" stroke-linecap="round"/>
<circle cx="-20" cy="-12" r="1.5" fill="#bbdefb" opacity="0.8"/>
<circle cx="0" cy="-2" r="1.5" fill="#bbdefb" opacity="0.7"/>
<circle cx="20" cy="3" r="1.5" fill="#bbdefb" opacity="0.6"/>
</g>
<!-- Umbrella (held by robot's left hand at (40,220)) -->
<g id="umbrella">
<!-- Canopy -->
<path d="M160 170 C 160 135, 240 135, 240 170 Z" fill="url(#umbrellaGradient)" stroke="#f57f17" stroke-width="1"/>
<!-- Handle: from canopy center (200,170) down, then curve to robot hand (40,220) -->
<path d="M200 170 L 200 185 Q 120 195, 40 220" stroke="#424242" stroke-width="4.5" fill="none" stroke-linecap="round"/>
<!-- Top cap -->
<circle cx="200" cy="135" r="3.5" fill="#424242"/>
</g>
<!-- Rain -->
<g id="rain-layer" stroke="rgba(173, 216, 230, 0.45)" stroke-linecap="round">
<script /> <!-- Placeholder for potential JS, but static lines below are primary -->
<line x1="20" y1="0" x2="30" y2="20" stroke-width="1"/><line x1="50" y1="10" x2="60" y2="30" stroke-width="1.2"/>
<line x1="80" y1="5" x2="90" y2="25" stroke-width="0.8"/><line x1="100" y1="20" x2="110" y2="40" stroke-width="1"/>
<line x1="130" y1="0" x2="140" y2="20" stroke-width="1.5"/><line x1="160" y1="15" x2="170" y2="35" stroke-width="1"/>
<line x1="190" y1="10" x2="200" y2="30" stroke-width="0.9"/><line x1="220" y1="0" x2="230" y2="20" stroke-width="1.1"/>
<line x1="250" y1="20" x2="260" y2="40" stroke-width="1"/><line x1="280" y1="5" x2="290" y2="25" stroke-width="1.3"/>
<line x1="10" y1="50" x2="22" y2="75" stroke-width="1"/><line x1="40" y1="60" x2="52" y2="85" stroke-width="1.2"/>
<line x1="70" y1="55" x2="82" y2="80" stroke-width="0.8"/><line x1="110" y1="70" x2="122" y2="95" stroke-width="1"/>
<line x1="140" y1="50" x2="152" y2="75" stroke-width="1.5"/><line x1="170" y1="65" x2="182" y2="90" stroke-width="1"/>
<line x1="200" y1="60" x2="212" y2="85" stroke-width="0.9"/><line x1="230" y1="50" x2="242" y2="75" stroke-width="1.1"/>
<line x1="260" y1="70" x2="272" y2="95" stroke-width="1"/><line x1="290" y1="55" x2="300" y2="78" stroke-width="1.3"/>
<line x1="25" y1="100" x2="37" y2="125" stroke-width="1"/><line x1="55" y1="110" x2="67" y2="135" stroke-width="1.2"/>
<line x1="85" y1="105" x2="97" y2="130" stroke-width="0.8"/><line x1="115" y1="120" x2="127" y2="145" stroke-width="1"/>
<line x1="145" y1="100" x2="157" y2="125" stroke-width="1.5"/><line x1="175" y1="115" x2="187" y2="140" stroke-width="1"/>
<line x1="205" y1="110" x2="217" y2="135" stroke-width="0.9"/><line x1="235" y1="100" x2="247" y2="125" stroke-width="1.1"/>
<line x1="265" y1="120" x2="277" y2="145" stroke-width="1"/><line x1="285" y1="105" x2="297" y2="130" stroke-width="1.3"/>
<line x1="15" y1="150" x2="27" y2="175" stroke-width="1"/><line x1="45" y1="160" x2="57" y2="185" stroke-width="1.2"/>
<line x1="75" y1="155" x2="87" y2="180" stroke-width="0.8"/><line x1="105" y1="170" x2="117" y2="195" stroke-width="1"/>
<line x1="135" y1="150" x2="147" y2="175" stroke-width="1.5"/><line x1="165" y1="165" x2="177" y2="190" stroke-width="1"/>
<line x1="195" y1="160" x2="207" y2="185" stroke-width="0.9"/><line x1="225" y1="150" x2="237" y2="175" stroke-width="1.1"/>
<line x1="255" y1="170" x2="267" y2="195" stroke-width="1"/><line x1="275" y1="155" x2="287" y2="180" stroke-width="1.3"/>
<line x1="30" y1="200" x2="42" y2="225" stroke-width="1"/><line x1="60" y1="210" x2="72" y2="235" stroke-width="1.2"/>
<line x1="90" y1="205" x2="102" y2="230" stroke-width="0.8"/><line x1="120" y1="220" x2="132" y2="245" stroke-width="1"/>
<line x1="150" y1="200" x2="162" y2="225" stroke-width="1.5"/><line x1="180" y1="215" x2="192" y2="240" stroke-width="1"/>
<line x1="210" y1="210" x2="222" y2="235" stroke-width="0.9"/><line x1="240" y1="200" x2="252" y2="225" stroke-width="1.1"/>
<line x1="270" y1="220" x2="282" y2="245" stroke-width="1"/><line x1="290" y1="205" x2="300" y2="228" stroke-width="1.3"/>
<line x1="5" y1="250" x2="17" y2="275" stroke-width="1"/><line x1="35" y1="260" x2="47" y2="285" stroke-width="1.2"/>
<line x1="65" y1="255" x2="77" y2="280" stroke-width="0.8"/><line x1="95" y1="270" x2="107" y2="295" stroke-width="1"/>
<line x1="125" y1="250" x2="137" y2="275" stroke-width="1.5"/><line x1="155" y1="265" x2="167" y2="290" stroke-width="1"/>
<line x1="185" y1="260" x2="197" y2="285" stroke-width="0.9"/><line x1="215" y1="250" x2="227" y2="275" stroke-width="1.1"/>
<line x1="245" y1="270" x2="257" y2="295" stroke-width="1"/><line x1="275" y1="255" x2="287" y2="280" stroke-width="1.3"/>
<line x1="15" y1="280" x2="25" y2="300" stroke-width="1.3"/> <line x1="285" y1="280" x2="295" y2="300" stroke-width="1.3"/>
</g>
</svg>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 300 300">
<defs>
<!-- Background gradients -->
<linearGradient id="sky" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#4e7fff"/>
<stop offset="100%" stop-color="#a7caff"/>
</linearGradient>
<linearGradient id="ground" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#3ca56c"/>
<stop offset="100%" stop-color="#2d724c"/>
</linearGradient>
<!-- Robot styling -->
<radialGradient id="robotBody" cx="50%" cy="30%" r="75%">
<stop offset="0%" stop-color="#cfe8ff"/>
<stop offset="100%" stop-color="#6a8fae"/>
</radialGradient>
<pattern id="robotPattern" width="6" height="6" patternUnits="userSpaceOnUse">
<rect width="6" height="6" fill="#6a8fae"/>
<circle cx="3" cy="3" r="1" fill="#88b0d6"/>
</pattern>
<!-- Flower & umbrella -->
<radialGradient id="flowerPetal" cx="50%" cy="50%" r="50%">
<stop offset="0%" stop-color="#ffe2ff"/>
<stop offset="100%" stop-color="#ff4b9e"/>
</radialGradient>
<linearGradient id="umbrellaGrad" x1="0" y1="0" x2="1" y2="0">
<stop offset="0%" stop-color="#ffdd00"/>
<stop offset="100%" stop-color="#ff6b00"/>
</linearGradient>
<!-- Rain -->
<linearGradient id="rainGrad" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#ffffff" stop-opacity="0.8"/>
<stop offset="100%" stop-color="#75baff" stop-opacity="0.2"/>
</linearGradient>
<!-- Glow for antenna -->
<filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
<feGaussianBlur stdDeviation="3" result="blur"/>
<feMerge>
<feMergeNode in="blur"/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
</defs>
<!-- Scene background -->
<rect width="300" height="300" fill="url(#sky)"/>
<rect y="220" width="300" height="80" fill="url(#ground)"/>
<!-- Robot -->
<g transform="translate(60 120)">
<!-- Body -->
<rect x="-20" y="0" width="40" height="50" rx="5" fill="url(#robotPattern)" stroke="#333" stroke-width="1.5"/>
<!-- Head -->
<rect x="-15" y="-40" width="30" height="30" rx="4" fill="url(#robotBody)" stroke="#333" stroke-width="1.5"/>
<!-- Eyes -->
<circle cx="-5" cy="-25" r="4" fill="#fff"/>
<circle cx="5" cy="-25" r="4" fill="#fff"/>
<circle cx="-5" cy="-25" r="2" fill="#000"/>
<circle cx="5" cy="-25" r="2" fill="#000"/>
<!-- Mouth -->
<rect x="-8" y="-12" width="16" height="4" rx="2" fill="#000"/>
<!-- Antenna -->
<line x1="0" y1="-40" x2="0" y2="-55" stroke="#333" stroke-width="2"/>
<circle cx="0" cy="-60" r="5" fill="#ff4b9e" filter="url(#glow)"/>
<!-- Left arm -->
<g transform="translate(-20 10)">
<circle r="5" fill="#6a8fae" stroke="#333" stroke-width="1"/>
<line x1="0" y1="0" x2="-20" y2="20" stroke="#6a8fae" stroke-width="6" stroke-linecap="round"/>
</g>
<!-- Right arm & watering can -->
<g transform="translate(20 10)">
<circle r="5" fill="#6a8fae" stroke="#333" stroke-width="1"/>
<line x1="0" y1="0" x2="25" y2="25" stroke="#6a8fae" stroke-width="6" stroke-linecap="round"/>
<!-- Watering can -->
<g transform="translate(25 25)">
<rect width="20" height="15" rx="3" fill="#f4eb55" stroke="#d3c200" stroke-width="1.5"/>
<path d="M20 2 Q25 7 20 12" fill="none" stroke="#d3c200" stroke-width="2"/>
<rect x="6" y="-6" width="8" height="6" rx="1" fill="#f4eb55" stroke="#d3c200" stroke-width="1"/>
<!-- Water stream -->
<path d="M20 8 C35 25 25 40 10 55" stroke="#4eb3ff" stroke-width="2" fill="none"/>
<circle cx="33" cy="28" r="2" fill="#4eb3ff"/>
<circle cx="28" cy="38" r="2" fill="#4eb3ff"/>
<circle cx="22" cy="48" r="2" fill="#4eb3ff"/>
</g>
</g>
<!-- Legs -->
<rect x="-14" y="50" width="8" height="25" fill="#6a8fae" stroke="#333" stroke-width="1.5"/>
<rect x="6" y="50" width="8" height="25" fill="#6a8fae" stroke="#333" stroke-width="1.5"/>
<ellipse cx="-10" cy="78" rx="10" ry="3" fill="#000" opacity="0.25"/>
<ellipse cx="10" cy="78" rx="10" ry="3" fill="#000" opacity="0.25"/>
</g>
<!-- Flower with umbrella -->
<g transform="translate(200 190)">
<!-- Stem & leaves -->
<rect x="0" y="0" width="4" height="30" fill="#4caf50"/>
<path d="M2 10 C-10 15 -10 5 2 0" fill="#43a047"/>
<path d="M2 20 C15 25 15 15 2 10" fill="#43a047"/>
<!-- Flower head -->
<circle cx="2" cy="-5" r="8" fill="url(#flowerPetal)"/>
<circle cx="2" cy="-5" r="3" fill="#ffeb3b"/>
<!-- Tiny umbrella -->
<g transform="translate(2 -17)">
<path d="M-18 0 Q0 -15 18 0" fill="url(#umbrellaGrad)" stroke="#ff6b00" stroke-width="2"/>
<path d="M0 0 V20" stroke="#8d5524" stroke-width="3" stroke-linecap="round"/>
</g>
<!-- Shadow -->
<ellipse cx="2" cy="32" rx="12" ry="4" fill="#000" opacity="0.3"/>
</g>
<!-- Rain -->
<g stroke="url(#rainGrad)" stroke-width="2" stroke-linecap="round" stroke-opacity="0.8">
<path d="M20 0 l0 15"/>
<path d="M60 10 l0 15"/>
<path d="M100 -5 l0 15"/>
<path d="M140 8 l0 15"/>
<path d="M180 -3 l0 15"/>
<path d="M220 5 l0 15"/>
<path d="M260 -4 l0 15"/>
<path d="M40 40 l0 15"/>
<path d="M80 30 l0 15"/>
<path d="M120 42 l0 15"/>
<path d="M160 35 l0 15"/>
<path d="M200 28 l0 15"/>
<path d="M240 40 l0 15"/>
<path d="M280 33 l0 15"/>
<path d="M20 80 l0 15"/>
<path d="M60 70 l0 15"/>
<path d="M100 75 l0 15"/>
<path d="M140 73 l0 15"/>
<path d="M180 68 l0 15"/>
<path d="M220 80 l0 15"/>
<path d="M260 67 l0 15"/>
<path d="M40 110 l0 15"/>
<path d="M80 100 l0 15"/>
<path d="M120 115 l0 15"/>
<path d="M160 105 l0 15"/>
<path d="M200 98 l0 15"/>
<path d="M240 110 l0 15"/>
<path d="M280 95 l0 15"/>
<path d="M20 140 l0 15"/>
<path d="M60 130 l0 15"/>
<path d="M100 135 l0 15"/>
<path d="M140 133 l0 15"/>
<path d="M180 128 l0 15"/>
<path d="M220 140 l0 15"/>
<path d="M260 127 l0 15"/>
<path d="M40 170 l0 15"/>
<path d="M80 160 l0 15"/>
<path d="M120 175 l0 15"/>
<path d="M160 165 l0 15"/>
<path d="M200 158 l0 15"/>
<path d="M240 170 l0 15"/>
<path d="M280 155 l0 15"/>
</g>
</svg>GPT-4o
Judge & Evaluator
The winner of this SVG challenge is
Gemini 2.5 Pro Preview 05-06
Player 1
Judge's Analysis
Player 1's image better adheres to the prompt with a clear depiction of rain, adding depth and context to the scene.
The robot and flower are well-integrated into the rainy environment, making the composition more dynamic and visually appealing.
Player 2's image, while clean, lacks the rain element and feels less immersive in comparison.
These metrics analyze technical aspects of both SVG drawings. Look for differences that might explain the judge's decision. Use the "View Code" button above to see the SVG code for each drawing.
Shapes Metrics
Total Shapes
The total number of shape elements (rect, circle, ellipse, line, polygon, polyline, path) in the SVG.
Player 1
102
Player 2
78
Rectangles
The number of rectangle elements (rect) in the SVG.
Player 1
5
Player 2
11
Circles
The number of circle elements (circle) in the SVG.
Player 1
13
Player 2
13
Ellipses
The number of ellipse elements (ellipse) in the SVG.
Player 1
7
Player 2
3
Lines
The number of line elements (line) in the SVG.
Player 1
66
Player 2
3
Polygons
The number of polygon elements (polygon) in the SVG.
Player 1
—
Player 2
—
Paths
The number of path elements (path) in the SVG.
Player 1
11
Player 2
48
Groups
The number of group elements (g) in the SVG.
Player 1
7
Player 2
7
Visual Effects Metrics
Gradients
The number of gradient definitions (linearGradient, radialGradient) in the SVG.
Player 1
8
Player 2
6
Patterns
The number of pattern definitions (pattern) in the SVG.
Player 1
—
Player 2
1
Filters
The number of filter definitions (filter) in the SVG.
Player 1
—
Player 2
1
Masks
The number of mask definitions (mask) in the SVG.
Player 1
—
Player 2
—
Clip Paths
The number of clipping path definitions (clipPath) in the SVG.
Player 1
—
Player 2
—
Elements with Opacity
The number of elements with opacity attributes in the SVG.
Player 1
6
Player 2
3
Elements with Stroke
The number of elements with stroke attributes in the SVG.
Player 1
14
Player 2
16
Colors Metrics
Unique Colors
The number of unique colors used in the SVG.
Player 1
21
Player 2
23
Interactivity Metrics
Animations
The number of animation elements (animate, animateMotion, animateTransform, set) in the SVG.
Player 1
—
Player 2
—
Elements with Transform
The number of elements with transform attributes in the SVG.
Player 1
10
Player 2
6
Complexity Metrics
Path Commands
The total number of path commands in all path elements (M, L, C, Q, etc.) in the SVG.
Player 1
42
Player 2
96
Max Group Nesting
The maximum nesting level of group elements (g) in the SVG.
Player 1
1
Player 2
2
Defs Elements
The number of elements defined within the defs element in the SVG.
Player 1
8
Player 2
8
Use Elements
The number of use elements (use) in the SVG.
Player 1
—
Player 2
—
Text Metrics
Text Elements
The number of text elements (text) in the SVG.
Player 1
—
Player 2
—
AI Judging Process
Creativity
Originality, innovative use of shapes and unique approach to the prompt.
Prompt Adherence
How accurately the SVG captures the essence of the prompt.
Visual Appeal
Aesthetic quality including composition, color usage and overall visual impact.
How does judging work?
SVG drawings are converted to static PNG images for evaluation. The AI judge receives the original prompt and both images, then determines which drawing better fulfills the evaluation criteria without seeing animations, interactivity, or SVG code.
