Creative Challenge
"A whale made of swirling, colorful origami paper"
<svg viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg">
<defs>
<!-- Gradient definitions -->
<linearGradient id="oceanGradient" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#033c5a" />
<stop offset="100%" stop-color="#0a192f" />
</linearGradient>
<!-- Pattern definitions -->
<pattern id="origamiPattern1" patternUnits="userSpaceOnUse" width="40" height="40" patternTransform="rotate(45)">
<path d="M0 0L20 0L20 20L0 20Z" fill="#ff6b6b" stroke="#ff8e8e" stroke-width="0.5" />
<path d="M20 20L40 20L40 40L20 40Z" fill="#ff6b6b" stroke="#ff8e8e" stroke-width="0.5" />
</pattern>
<pattern id="origamiPattern2" patternUnits="userSpaceOnUse" width="40" height="40" patternTransform="rotate(15)">
<path d="M0 0L20 0L40 20L20 20Z" fill="#4ecdc4" stroke="#a0e4de" stroke-width="0.5" />
<path d="M0 20L20 20L40 40L20 40Z" fill="#4ecdc4" stroke="#a0e4de" stroke-width="0.5" />
</pattern>
<pattern id="origamiPattern3" patternUnits="userSpaceOnUse" width="40" height="40" patternTransform="rotate(75)">
<path d="M0 0L40 0L20 40L0 40Z" fill="#ffbe0b" stroke="#ffd56b" stroke-width="0.5" />
</pattern>
<pattern id="origamiPattern4" patternUnits="userSpaceOnUse" width="30" height="30" patternTransform="rotate(-15)">
<path d="M0 0L15 0L30 15L15 30L0 15Z" fill="#8338ec" stroke="#a57af6" stroke-width="0.5" />
</pattern>
<pattern id="origamiPattern5" patternUnits="userSpaceOnUse" width="30" height="30" patternTransform="rotate(60)">
<path d="M0 0L30 0L30 30L0 30Z" fill="#fb5607" stroke="#fc8851" stroke-width="0.5" />
</pattern>
<!-- Filters -->
<filter id="paperTexture" x="-20%" y="-20%" width="140%" height="140%">
<feTurbulence type="fractalNoise" baseFrequency="0.05" numOctaves="2" result="noise" />
<feDisplacementMap in="SourceGraphic" in2="noise" scale="5" xChannelSelector="R" yChannelSelector="G" />
</filter>
<filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
<feDropShadow dx="3" dy="3" stdDeviation="5" flood-opacity="0.3" />
</filter>
</defs>
<!-- Background -->
<rect x="0" y="0" width="300" height="300" fill="url(#oceanGradient)" />
<!-- Bubbles -->
<circle cx="50" cy="80" r="8" fill="#ffffff" opacity="0.3" />
<circle cx="70" cy="130" r="5" fill="#ffffff" opacity="0.3" />
<circle cx="90" cy="60" r="10" fill="#ffffff" opacity="0.3" />
<circle cx="250" cy="100" r="7" fill="#ffffff" opacity="0.3" />
<circle cx="230" cy="70" r="4" fill="#ffffff" opacity="0.3" />
<circle cx="210" cy="90" r="6" fill="#ffffff" opacity="0.3" />
<!-- Origami Whale -->
<g filter="url(#shadow)">
<!-- Whale Body Main Shape - Folded Origami -->
<path d="M50 150
C70 120, 100 120, 140 130
C180 140, 220 150, 250 130
C260 125, 260 140, 250 145
C240 160, 230 170, 220 180
C200 200, 160 205, 130 200
C90 195, 60 190, 40 170
C30 160, 40 160, 50 150Z"
fill="url(#origamiPattern1)"
filter="url(#paperTexture)" />
<!-- Tail -->
<path d="M220 180
L250 200
C260 210, 270 220, 260 230
C250 240, 240 230, 230 220
C220 210, 210 200, 220 180Z"
fill="url(#origamiPattern2)"
filter="url(#paperTexture)" />
<!-- Dorsal Fin -->
<path d="M160 130
L170 90
C180 80, 190 85, 180 100
C170 115, 160 130, 160 130Z"
fill="url(#origamiPattern3)"
filter="url(#paperTexture)" />
<!-- Pectoral Fin -->
<path d="M110 170
C110 180, 120 200, 100 210
C90 215, 80 205, 90 195
C100 185, 110 170, 110 170Z"
fill="url(#origamiPattern4)"
filter="url(#paperTexture)" />
<!-- Head Details -->
<path d="M50 150
C45 145, 40 145, 35 155
C30 165, 45 170, 50 165
C55 160, 55 155, 50 150Z"
fill="url(#origamiPattern5)"
filter="url(#paperTexture)" />
<!-- Eye -->
<circle cx="60" cy="155" r="5" fill="#333" />
<circle cx="58" cy="153" r="1.5" fill="white" />
</g>
<!-- Swirling Origami Paper Elements -->
<g opacity="0.8">
<path d="M30 190 C20 170, 10 150, 30 130 C50 110, 70 130, 60 150 C50 170, 40 180, 30 190Z" fill="#ff9a8c" transform="rotate(-10, 30, 150)" filter="url(#paperTexture)" />
<path d="M270 150 C280 130, 290 110, 270 90 C250 70, 230 90, 240 110 C250 130, 260 140, 270 150Z" fill="#84dcc6" transform="rotate(15, 270, 120)" filter="url(#paperTexture)" />
<path d="M150 250 C170 260, 190 270, 210 250 C230 230, 210 210, 190 220 C170 230, 160 240, 150 250Z" fill="#ffbf69" transform="rotate(-20, 180, 235)" filter="url(#paperTexture)" />
</g>
<!-- Flowing Origami Paper Strips -->
<g opacity="0.6">
<path d="M30 100 Q60 80, 90 100 T150 90 T210 100 T270 90" stroke="#ff9a8c" stroke-width="3" fill="none" filter="url(#paperTexture)" />
<path d="M20 110 Q50 90, 80 110 T140 100 T200 110 T260 100" stroke="#84dcc6" stroke-width="2" fill="none" filter="url(#paperTexture)" />
<path d="M40 220 Q70 240, 100 220 T160 230 T220 220 T280 230" stroke="#ffbf69" stroke-width="4" fill="none" filter="url(#paperTexture)" />
<path d="M50 230 Q80 250, 110 230 T170 240 T230 230 T290 240" stroke="#a57af6" stroke-width="2" fill="none" filter="url(#paperTexture)" />
</g>
<!-- Decorative Origami Elements -->
<polygon points="80,100 90,85 100,100 90,115" fill="#ff595e" filter="url(#paperTexture)" />
<polygon points="190,90 200,75 210,90 200,105" fill="#1982c4" filter="url(#paperTexture)" />
<polygon points="230,200 240,185 250,200 240,215" fill="#8ac926" filter="url(#paperTexture)" />
<polygon points="120,220 130,205 140,220 130,235" fill="#ffca3a" filter="url(#paperTexture)" />
</svg>
<svg viewBox="0 0 300 300" xmlns="http://www.w3.org/2000/svg">
<defs>
<linearGradient id="grad1" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" style="stop-color:#ff7e5f;stop-opacity:1" />
<stop offset="100%" style="stop-color:#feb47b;stop-opacity:1" />
</linearGradient>
<linearGradient id="grad2" x1="100%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#6a11cb;stop-opacity:1" />
<stop offset="100%" style="stop-color:#2575fc;stop-opacity:1" />
</linearGradient>
<linearGradient id="grad3" x1="50%" y1="0%" x2="50%" y2="100%">
<stop offset="0%" style="stop-color:#43cea2;stop-opacity:1" />
<stop offset="100%" style="stop-color:#185a9d;stop-opacity:1" />
</linearGradient>
<linearGradient id="grad4" x1="0%" y1="100%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:#ffafbd;stop-opacity:1" />
<stop offset="100%" style="stop-color:#ffc3a0;stop-opacity:1" />
</linearGradient>
<linearGradient id="grad5" x1="30%" y1="0%" x2="70%" y2="100%">
<stop offset="0%" style="stop-color:#a18cd1;stop-opacity:1" />
<stop offset="100%" style="stop-color:#fbc2eb;stop-opacity:1" />
</linearGradient>
<linearGradient id="grad6" x1="80%" y1="20%" x2="20%" y2="80%">
<stop offset="0%" style="stop-color:#fad0c4;stop-opacity:1" />
<stop offset="100%" style="stop-color:#ffd1ff;stop-opacity:1" />
</linearGradient>
</defs>
<g transform="translate(150,150) scale(1.5)">
<!-- Body -->
<path d="M0,-50 C40,-40 60,0 40,40 C60,60 40,100 0,90 C-40,100 -60,60 -40,40 C-60,0 -40,-40 0,-50" fill="url(#grad1)" stroke="#333" stroke-width="1"/>
<!-- Tail -->
<polygon points="0,90 20,130 -20,130" fill="url(#grad2)" stroke="#333" stroke-width="1"/>
<polygon points="20,130 40,160 0,140" fill="url(#grad3)" stroke="#333" stroke-width="1"/>
<polygon points="-20,130 -40,160 0,140" fill="url(#grad4)" stroke="#333" stroke-width="1"/>
<!-- Fins -->
<polygon points="40,40 60,60 50,80" fill="url(#grad5)" stroke="#333" stroke-width="1"/>
<polygon points="-40,40 -60,60 -50,80" fill="url(#grad6)" stroke="#333" stroke-width="1"/>
<!-- Eye -->
<circle cx= "10" cy= "-30" r="5" fill="#fff" stroke="#333" stroke-width="1"/>
<circle cx= "10" cy= "-30" r="2" fill="#333"/>
</g>
</svg>Judge's Analysis
Player 1's image creatively uses swirling patterns and a variety of colors to evoke the idea of origami paper, effectively capturing the essence of the prompt.
The composition is dynamic and visually appealing, with a clear whale shape integrated into the design.
Player 2's submission, while technically clean, lacks the origami and swirling elements specified in the prompt, making Player 1's submission more aligned with the theme.
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
"Flamingo playing a saxophone on a lily pad under a crescent moon"
"A bicycle with butterfly wings gliding over a cityscape"
"Jellyfish troupe performing ballet on a grassy hill"
"Sky-high penguin on a carousel horse"
"Penguin in a top hat juggling snowballs at sunrise"
"Floating island with a tree, roots trailing into space"
