Resources
Twitter Thread Hueplot hueplot.ardov.me A tool to visually explore the world of color spaces and gamuts
Dropbox Brand Guidelines brand.dropbox.com At Dropbox, our Brand Guidelines help us infuse everything we make with identity. From icons to illustration, logos to language, this collection is the foundation for how Dropbox looks, feels, and sounds like Dropbox.
Forms and Values
Priority is to learn rendering / drawing (SVG & Raster) in OKLAB/OKLCH based on:
- Lightness
- Chroma and Hue
- A (how green/red the color is)
- B (how blue/yellow the color is)
Study how conventional lighting methods in film making are applicable to UI, alongside existing Product UIs and what combination/value curves make them aesthetic.
Technical Resources
As light increases and decreases in its intensity -> less intensity -> hue will shift around the color wheel (clock-wise direction) and saturation will increase as the light falls off.
Cinematic Lighting
Essential Tutorials
Advanced Concepts
Lighting Techniques
- Split Lighting (9 or 3 o'clock)
- Split lighting involves setting a single light at either 9 or 3 o'clock, resulting in one side of the subject's head being illuminated.
- Backlight or Rim Lighting (12 o'clock)
- When the light is behind your subject at 12 o'clock, it can result in beautiful rim lighting.
- Butterfly Lighting (6 o'clock)
- Butterfly lighting results when you place a light source slightly above and in front of your model at 6 o'clock.
- Clamshell Lighting
- Clamshell lighting is achieved by combining butterfly lighting with a reflector or a light placed underneath as fill light.
- Loop Lighting (5 or 7 o'clock)
- Loop lighting involves positioning the main light just above eye level at approximately 5 or 7 o'clock.
- Rembrandt Lighting (4 or 8 o'clock)
- Named after the Dutch painter, achieved by placing the light closer to 4 or 8 o'clock.
- Short Lighting
- Involves positioning the light source similarly to Rembrandt lighting, but you also turn the subject towards the light.
- Broad Lighting
- Similar to short lighting, but the subject is slightly turned away from the light source.
- Cross Lighting
- Place the main light source at 4-5 o'clock and an edge light at 10-11 o'clock.
Color Harmony Types
- Monochrome
- Analogous
- Complementary
- Split Complementary
- Triadic
- Tetradic
Additional Concepts
- How colors interact — i have this book.
- Aerial perspective