Creative Challenge
"An astronaut planting a flag on a melting moon made of ice cream."
<svg viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg">
<defs>
<!-- Ice Cream Moon Gradients -->
<radialGradient id="iceCreamPink" cx="60%" cy="40%" r="75%">
<stop offset="0%" stop-color="#fff7fa"/>
<stop offset="40%" stop-color="#f8bbd0"/>
<stop offset="100%" stop-color="#ef6eb1"/>
</radialGradient>
<radialGradient id="iceCreamBlue" cx="35%" cy="45%" r="80%">
<stop offset="0%" stop-color="#e6f7ff"/>
<stop offset="65%" stop-color="#79bfff"/>
<stop offset="100%" stop-color="#2e88e5"/>
</radialGradient>
<radialGradient id="iceCreamWhite" cx="30%" cy="60%" r="100%">
<stop offset="0%" stop-color="#fff"/>
<stop offset="80%" stop-color="#e0ecf7"/>
<stop offset="100%" stop-color="#bcd0e7"/>
</radialGradient>
<!-- Cone Gradient -->
<linearGradient id="coneGrad" x1="0" y1="0" x2="0" y2="1">
<stop offset="10%" stop-color="#ffe6aa"/>
<stop offset="90%" stop-color="#de9400"/>
</linearGradient>
<!-- Astronaut suit shading -->
<linearGradient id="suitGrad" x1="0" y1="0" x2="0.7" y2="1">
<stop offset="0%" stop-color="#f3f6ff"/>
<stop offset="90%" stop-color="#dee1ef"/>
</linearGradient>
<!-- Astronaut Visor -->
<radialGradient id="visorGrad" cx="50%" cy="40%" r="80%">
<stop offset="0%" stop-color="#e1f0fa"/>
<stop offset="60%" stop-color="#8fd1ec"/>
<stop offset="100%" stop-color="#26587c"/>
</radialGradient>
<!-- Melting drips -->
<linearGradient id="dripGradPink" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#ffe3f5"/>
<stop offset="90%" stop-color="#ef6eb1"/>
</linearGradient>
<linearGradient id="dripGradBlue" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#daf3ff"/>
<stop offset="90%" stop-color="#2e88e5"/>
</linearGradient>
<linearGradient id="dripGradWhite" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#fff"/>
<stop offset="100%" stop-color="#bcd0e7"/>
</linearGradient>
<!-- Sprinkles -->
<pattern id="sprinkles" patternUnits="userSpaceOnUse" width="18" height="18">
<circle cx="3" cy="3" r="2" fill="#fdc052"/>
<circle cx="10" cy="8" r="1.4" fill="#4b71d8"/>
<rect x="13" y="13.5" width="3" height="1.3" rx=".8" fill="#ef6eb1"/>
<rect x="4" y="13" width="2.2" height="1.1" rx="0.6" fill="#ff5e62"/>
</pattern>
</defs>
<rect width="100%" height="100%" fill="#223147"/>
<!-- Melting Moon (Ice Cream Scoop)-->
<!-- Shadow under moon -->
<ellipse cx="145" cy="242" rx="70" ry="12" fill="#1d2636" opacity="0.35"/>
<!-- Melting ice cream "moon" -->
<g>
<!-- Main spheres for multi-flavored melting moon -->
<ellipse cx="155" cy="170" rx="67" ry="62" fill="url(#iceCreamWhite)"/>
<ellipse cx="155" cy="178" rx="55" ry="45" fill="url(#iceCreamPink)" opacity="0.78"/>
<ellipse cx="142" cy="167" rx="47" ry="36" fill="url(#iceCreamBlue)" opacity="0.75"/>
<!-- Sprinkles on moon -->
<ellipse cx="155" cy="174" rx="61" ry="54" fill="url(#sprinkles)" opacity="0.6"/>
<!-- Crater-like swirls -->
<ellipse cx="129" cy="154" rx="13" ry="7" fill="#e9bad7" opacity="0.23"/>
<ellipse cx="182" cy="195" rx="9" ry="5" fill="#afd6fb" opacity="0.22"/>
<ellipse cx="169" cy="160" rx="7" ry="4" fill="#f9e6fb" opacity="0.19"/>
<!-- Melting drips -->
<path d="M110 220 Q112 250 127 245 Q136 238 130 226 T120 218 Z" fill="url(#dripGradPink)"/>
<path d="M175 220 Q180 248 199 240 Q207 231 188 227 T178 215 Z" fill="url(#dripGradBlue)"/>
<path d="M149 225 Q148 260 157 268 Q168 261 163 230 Q160 226 151 221 Z" fill="url(#dripGradWhite)"/>
<!-- More drips -->
<path d="M125 215 Q129 228 140 230 Q134 220 129 215 Z" fill="url(#dripGradPink)" opacity="0.7"/>
<path d="M110 200 Q112 215 120 215 Q116 207 113 200 Z" fill="url(#dripGradWhite)" opacity="0.5"/>
<path d="M195 218 Q204 225 210 215 Q201 218 196 215 Z" fill="url(#dripGradBlue)" opacity="0.6"/>
</g>
<!-- Cone below melting moon -->
<polygon points="120,230 190,230 155,295" fill="url(#coneGrad)" stroke="#c69636" stroke-width="2"/>
<!-- Cone crosshatch pattern -->
<g stroke="#ebc77f" stroke-width="1">
<line x1="127" y1="238" x2="182" y2="285"/>
<line x1="135" y1="234" x2="192" y2="282"/>
<line x1="140" y1="232" x2="200" y2="276"/>
<line x1="180" y1="232" x2="137" y2="275"/>
<line x1="170" y1="232" x2="122" y2="278"/>
<line x1="165" y1="231" x2="117" y2="272"/>
</g>
<!-- Astronaut Planting Flag -->
<g>
<!-- Legs -->
<rect x="110" y="192" width="11" height="33" rx="4" fill="url(#suitGrad)" stroke="#c8cee3" stroke-width="1.4"/>
<rect x="128" y="195" width="12" height="31" rx="4" fill="url(#suitGrad)" stroke="#c8cee3" stroke-width="1.4"/>
<!-- Boots -->
<ellipse cx="116" cy="228" rx="7" ry="4.2" fill="#677693"/>
<ellipse cx="134" cy="224" rx="7.5" ry="4.4" fill="#677693"/>
<!-- Body -->
<rect x="112" y="160" width="30" height="38" rx="12" fill="url(#suitGrad)" stroke="#c8cee3" stroke-width="2"/>
<!-- Left arm holding flagpole -->
<rect x="103" y="158" width="11" height="33" rx="4" transform="rotate(-18 103 158)" fill="url(#suitGrad)" stroke="#c8cee3" stroke-width="1.2"/>
<!-- Right arm spreading out -->
<rect x="140" y="165" width="11" height="33" rx="4" transform="rotate(18 140 165)" fill="url(#suitGrad)" stroke="#c8cee3" stroke-width="1.2"/>
<!-- Hands (gloves) -->
<ellipse cx="109" cy="185" rx="6.2" ry="4.6" fill="#dee1ef"/>
<ellipse cx="153" cy="195" rx="6.2" ry="4.6" fill="#dee1ef"/>
<!-- Head (helmet) -->
<ellipse cx="127" cy="148" rx="17" ry="16.5" fill="url(#visorGrad)" stroke="#a7b7d7" stroke-width="2.5"/>
<!-- Helmet reflection sparkles -->
<ellipse cx="121" cy="142" rx="3.7" ry="2.1" fill="#fff" opacity="0.55"/>
<ellipse cx="133.5" cy="151" rx="2.5" ry="1" fill="#fff" opacity="0.3"/>
<!-- Backpack -->
<rect x="103" y="170" width="7" height="25" rx="2" fill="#c8cee3" opacity="0.9"/>
</g>
<!-- Flag and pole -->
<g>
<!-- Flag Pole -->
<rect x="98" y="126" width="4.5" height="49" rx="1.5" fill="#bbb" stroke="#969dad" stroke-width="1.1"/>
<!-- Flag (melting ice cream theme) -->
<path d="M102 129
Q122 131 130 134
Q137 137 132 144
Q128 149 102 142 Z"
fill="url(#iceCreamPink)" stroke="#fff" stroke-width="2"/>
<ellipse cx="117" cy="137" rx="5.1" ry="3" fill="url(#iceCreamWhite)" opacity="0.73"/>
<ellipse cx="125" cy="140" rx="2.5" ry="1.2" fill="url(#iceCreamBlue)" opacity="0.68"/>
<!-- Flag chocolate drizzle -->
<path d="M108 134 Q116 137 123 132 Q127 140 130 135" fill="none" stroke="#8a5e38" stroke-width="2" opacity="0.58"/>
<!-- Flag drip -->
<path d="M113 144 Q114 150 118 148" fill="none" stroke="#f48fb1" stroke-width="2.2" opacity="0.7"/>
<!-- Sprinkles on Flag -->
<ellipse cx="117" cy="139.6" rx="0.6" ry="0.8" fill="#fdc052"/>
<rect x="124" y="142" width="1.3" height="0.8" rx="0.5" fill="#4b71d8"/>
<ellipse cx="128.2" cy="138.3" rx="0.67" ry="0.7" fill="#ff5e62"/>
</g>
<!-- Stars and sparkles in the background -->
<g>
<circle cx="50" cy="60" r="1.7" fill="#fff" opacity="0.95"/>
<circle cx="82" cy="26" r="1.2" fill="#fff" opacity="0.8"/>
<circle cx="204" cy="24" r="1.1" fill="#fff" opacity="0.81"/>
<circle cx="230" cy="47" r="1.3" fill="#fff"/>
<circle cx="250" cy="68" r="1.1" fill="#fff"/>
<circle cx="218" cy="89" r="1.5" fill="#fff" opacity="0.74"/>
<circle cx="42" cy="186" r="1.6" fill="#fff" opacity="0.9"/>
<ellipse cx="256" cy="210" rx="1.15" ry="1.7" fill="#fff" opacity="0.8"/>
<ellipse cx="270" cy="140" rx="0.7" ry="1.6" fill="#fff" opacity="0.7"/>
<!-- Sparkles -->
<g opacity="0.63">
<polygon points="180,42 182,46 186,47 182,48 180,52 178,48 174,47 178,46" fill="#fff9"/>
<polygon points="62,102 63,106 67,107 63,108 62,112 60,108 56,107 60,106" fill="#f9ffff"/>
<polygon points="205,160 206,163 209,163.5 206,164 205,167 204,164 201,163.5 204,163" fill="#fff"/>
</g>
</g>
</svg>
<svg viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg">
<defs>
<!-- Space background gradient -->
<linearGradient id="spaceGradient" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#001" />
<stop offset="100%" stop-color="black" />
</linearGradient>
<!-- Ice cream moon radial gradient -->
<radialGradient id="iceCreamMoonGradient" cx="50%" cy="50%" r="50%">
<stop offset="0%" stop-color="white" />
<stop offset="100%" stop-color="pink" />
</radialGradient>
</defs>
<!-- Background -->
<rect x="0" y="0" width="300" height="300" fill="url(#spaceGradient)" />
<!-- Stars in the space -->
<circle cx="50" cy="40" r="1" fill="white" />
<circle cx="200" cy="50" r="0.8" fill="white" />
<circle cx="250" cy="80" r="1.2" fill="white" />
<circle cx="80" cy="100" r="1" fill="white" />
<circle cx="220" cy="30" r="1" fill="white" />
<circle cx="160" cy="70" r="0.5" fill="white" />
<circle cx="120" cy="60" r="0.7" fill="white" />
<!-- Melting Ice Cream Moon -->
<g id="moon">
<!-- Main moon body -->
<circle cx="150" cy="200" r="50" fill="url(#iceCreamMoonGradient)" stroke="white" stroke-width="2" />
<!-- Dripping melts -->
<path d="M 130 250 C 120 260, 120 275, 130 280 C 140 285, 145 275, 140 265 Z" fill="url(#iceCreamMoonGradient)" />
<path d="M 150 250 C 147 260, 147 275, 155 280 C 163 285, 165 280, 160 265 Z" fill="url(#iceCreamMoonGradient)" />
<path d="M 170 250 C 180 260, 180 275, 170 280 C 160 285, 155 275, 160 265 Z" fill="url(#iceCreamMoonGradient)" />
<!-- Sprinkles for extra flair -->
<circle cx="140" cy="190" r="2" fill="purple" />
<circle cx="160" cy="210" r="2" fill="blue" />
<circle cx="155" cy="180" r="1.5" fill="yellow" />
<circle cx="145" cy="220" r="1.2" fill="green" />
</g>
<!-- Astronaut Planting a Flag -->
<g id="astronaut" transform="translate(170,150)">
<!-- Helmet -->
<circle cx="0" cy="0" r="5" fill="#ddd" stroke="black" stroke-width="0.5" />
<!-- Visor effect -->
<circle cx="0" cy="0" r="3" fill="skyblue" opacity="0.7" />
<!-- Body -->
<rect x="-3" y="5" width="6" height="10" fill="#fff" stroke="black" stroke-width="0.5" />
<!-- Left arm reaching out to plant flag -->
<line x1="-3" y1="7" x2="-8" y2="13" stroke="black" stroke-width="1.5" />
<!-- Right arm -->
<line x1="3" y1="7" x2="8" y2="10" stroke="black" stroke-width="1.5" />
<!-- Left leg -->
<line x1="-2" y1="15" x2="-2" y2="20" stroke="black" stroke-width="1.5" />
<!-- Right leg -->
<line x1="2" y1="15" x2="2" y2="20" stroke="black" stroke-width="1.5" />
<!-- Flagpole emerging from left hand -->
<line x1="-8" y1="13" x2="-8" y2="3" stroke="gray" stroke-width="1.5" />
<!-- Waving flag -->
<polygon points="-8,3 -8,8 -3,5" fill="red" stroke="black" stroke-width="0.5" />
</g>
</svg>
Judge's Analysis
Player 1's submission exhibits greater creativity and technical quality, with a detailed depiction of the ice cream moon featuring sprinkles, vibrant colors, and a melting effect.
The astronaut is proportionally integrated and visually appealing.
Player 2's submission is simpler and less detailed, lacking the imaginative and polished elements of Player 1's design.
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
The total number of shape elements (rect, circle, ellipse, line, polygon, polyline, path) in the SVG.
The number of rectangle elements (rect) in the SVG.
The number of circle elements (circle) in the SVG.
The number of ellipse elements (ellipse) in the SVG.
The number of line elements (line) in the SVG.
The number of polygon elements (polygon) in the SVG.
The number of path elements (path) in the SVG.
The number of group elements (g) in the SVG.
Visual Effects Metrics
The number of gradient definitions (linearGradient, radialGradient) in the SVG.
The number of pattern definitions (pattern) in the SVG.
The number of filter definitions (filter) in the SVG.
The number of mask definitions (mask) in the SVG.
The number of clipping path definitions (clipPath) in the SVG.
The number of elements with opacity attributes in the SVG.
The number of elements with stroke attributes in the SVG.
Colors Metrics
The number of unique colors used in the SVG.
Interactivity Metrics
The number of animation elements (animate, animateMotion, animateTransform, set) in the SVG.
The number of elements with transform attributes in the SVG.
Complexity Metrics
The total number of path commands in all path elements (M, L, C, Q, etc.) in the SVG.
The maximum nesting level of group elements (g) in the SVG.
The number of elements defined within the defs element in the SVG.
The number of use elements (use) in the SVG.
Text Metrics
The number of text elements (text) in the SVG.
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.
Similar Challenges
"A tiny robot watering a giant flower sprouting from the top of a skyscraper."
"A jellyfish wearing a top hat floating in a starry night sky."