Petey Gone Mad Arts · Digital & Interactive Art · Discipline 12
Charles Csuri · "Hummingbird" · 1967 · One of the first computer-animated films ever made
DIGITAL & INTERACTIVE ART SUITE
01
Canvas
Digital painting
02
Generate
Generative art
03
Colour
Digital colour theory
04
Motion
Animation reference
05
Project
Project planner
06
Format
File & output guide
07
Inspire
Art movements
08
Journal
Artist's notebook
"The only bird that flies in all directions · The first computer art that moved · The last discipline · The whole point"
A gift from peteygonemadarts.com · You are a guest. Not a dollar sign.
Canvas
digital painting · drawing · mixed media
Size 4
Opacity
Tool: Pen Draw freely · All colours · Export your work
Generate
generative art · algorithms · randomness · code as canvas
Generative art is created through rules, algorithms, and controlled randomness. The artist writes the system. The system makes the art. Every run is different. This is what Charles Csuri understood in 1967.
Flow Field
Circles
Lines
Fractal Tree
Spiral
Noise Field
Polygon
Wave
Select an algorithm and hit Generate.
Colour
digital colour theory · palettes · harmony · hex · RGB
Complementary
Triadic
Analogous
Split-Comp
Tetradic
Monochrome
Select a base colour and harmony type.
RGB (Red Green Blue) Used for screens and digital display. Values: 0–255 per channel. rgb(68, 255, 136) HEX (Hexadecimal) Web standard. #RRGGBB format. Each pair is 00–FF (0–255 in base 16). #44FF88 HSL (Hue Saturation Lightness) Most intuitive for artists. Hue: 0–360° on the colour wheel Saturation: 0–100% (grey to pure) Lightness: 0–100% (black to white) CMYK (Cyan Magenta Yellow Black) Used for print — NOT screens. If your digital work goes to print, convert. ALPHA (Transparency) rgba(68,255,136,0.5) = 50% transparent In hex: #44FF8880 (last two digits = alpha)
Motion
animation · timing · easing · CSS · keyframes
Motion is the dimension that separates digital art from every other discipline. When Csuri made Hummingbird move in 1967, he unlocked something that marble and canvas could never do. Time became a material.
Set options above to generate CSS.
Project
digital project planner · brief · deliverables · timeline
Format
file formats · resolution · output · delivery specs
RASTER FORMATS (pixel-based) PNG — Lossless. Transparency support. Best for digital art delivery. Use: illustrations, UI, anything with transparency Max: technically unlimited, practically 8K × 8K JPEG/JPG — Lossy compression. No transparency. Smaller files. Use: photographs, large digital paintings, web delivery Never re-save a JPEG — quality degrades each save TIFF — Lossless. Large files. Professional print standard. Use: print delivery, archival master files PSD — Photoshop native. Preserves layers and edits. Use: working files. Never deliver a PSD as a final. GIF — Animated. Limited to 256 colours. Lossless animation loops. Use: simple animations, memes, web banners WEBP — Modern web format. Smaller than PNG/JPEG. Animation support. Use: web delivery — not all platforms support it yet VECTOR FORMATS (resolution independent) SVG — Scalable Vector Graphics. Code-based. Scales to any size. Use: logos, icons, interactive web graphics, generative art AI / EPS — Adobe Illustrator native. Industry standard vector. Use: professional illustration and print deliverables PDF — Universal. Preserves vector and raster. Print-ready. Use: final print delivery VIDEO / ANIMATION MP4 (H.264) — Universal playback. Web standard. MOV — Apple ProRes. High quality. Large files. GIF — Short loops. Web and social media. WEBM — Web video. Smaller than MP4. Open format. LOTTIE — JSON-based vector animation. Web interactive. RESOLUTION GUIDE Screen (72 DPI): 1920 × 1080 — HD · 3840 × 2160 — 4K Social: Instagram 1080 × 1080 · 1080 × 1350 · 1080 × 1920 Print (300 DPI): 3300 × 2550 — 11×8.5in · 7200 × 4800 — 24×16in NFT: 2000 × 2000 minimum recommended · 4000 × 4000 preferred
Enter dimensions to calculate print size and megapixels.
Inspire
digital art movements · pioneers · history · context
Journal
digital artist's notebook · process · ideas · observations
The digital artist's journal is where the work thinks before the code runs. Write the idea before you build it. The constraint you discover at 2am is worth more than any tutorial.
All
Ideas
Technical
Algorithm