Working with Visuals

Interactive visuals

• C4 - Creative coding platform for iOS
• openFrameworks - High-performance creative coding environment (C++, free)
• vvvv - High performance platform for large installations (Windows, free)
• Cycling'76 Max/MSP - Max/MSP and Jitter, a visual programming environment for visuals and sound ($)
• TouchDesigner - Interactive visuals, projection mapping, lighting and VR* tooll (Windows, free)
• A overview of various display techniques - e-ink, tangible, lasers, volumetric and more

Information visualisation

Inspiration

• Infosthetics
• Information is beautiful

Understand

• The Visual Display of Quantitative Information - Classic book on visualising information by Edward Tufte
• Envisioning Information - Another classic by Edward Tufte
• Tree visualisations - a visual bibliography

Motion design

• The Illusion of Life Disney's 12 principles of animation, illustrated by Cento Lodigiani. Also in GIF format
• CAPPTIVATE.co Categorised, motion-rich interaction patterns

• Using After Effects for motion studies

• Kite Compositor - Generate animation code for Apple platforms

• UX in Motion Using After Effects to sketch animation (alternative link)

Visual resources

• Undesign - Directory of design resources

Images and Icons

• Iconsear.ch - Search various icon sets
• Vector graphics
• Public domain video clips
• Geomicons
• Icon sets
• Phosphor Icons
• Lucide

Method of Action: A variety of interactive resources for aspects of graphic design, such as kerning, colour and Bezier curves

Colour palettes and colour mixers

• Colord
• Spectral
• Method of Action Colour
• Color Tool - View colours in relation to a UI and test for readability (Google)
• Canva Colors
• Paletton

Random palette generator

• Farbvelo
• Randoma11y - Random accessible colour pairing.

Colour Gradients

• Shade Gradient explorer
• Grabient
• CSS Gradients - Generate CSS gradients
• Cool Backgrounds - Generate gradient and geometric backgrounds

Patterns

• PatternPad - Procedural patterns
• Pattern Generator
• Mazeletter
• Hero Patterns
• Tabbied - Procedural patterns
• SVG Waves - Generate wave patterns
• SVG Gradient Wave Generator
• Haikei - Various kinds of procedural patterns

Vector graphics

• Boxy - Online SVG editor

• SVGcode - Free tool to vectorise images

• Cool Backgrounds - Generate gradient and geometric backgrounds

• DrawingBots Tools - Curated list of tools useful for vector manipulation, especially for the purposes of plotting
• TinkerSynth - Vector generator
• Warp SVG - Warp an SVG
• SVG Path Visualizer - understand how SVG paths are constructed
• SVGOMG - Simplify SVG syntax

Tutorials

• Adobe Photoshop tutorials
• Adobe Illustrator tutorials
• Sketch

Tools

• Inkscape - A viable free alternative to Adobe Illustrator.