The solution: If you’re noticing issues, use a very dark grey instead of black, or slow down the animation.

Here’s a dramatic recreation to make it obvious (and so you can see what it looks like without needing an OLED).

This usually means some part of the image looks like it lags when scrolling or animating. This GIF will show the effect if viewed on an OLED display. It’s reasonably subtle, but easy to spot once you know what it looks like.

Black level and contrast are way better on OLEDs, because there’s no backlight. But, be careful when using pure black — changing pixels from black to any colour is slower than changing from a colour to a colour. This is often called OLED black smearing.

OLED displays are a bit different to LCDs. If you’re designing things that will be shown on OLED displays (iPhone XS, Pixel 3 etc), it’s good to be aware of the differences.

Processing has been tons of fun to learn. It feels like a super-power to be able to write code to do things would be almost impossible in a design tool.

All the code is available as open source. github.com/bjango/Processing-S

It’s been a while, but I finally have another article ready to go.

Creating SVGs using Processing: bjango.com/articles/processing

The same technique can be used with lots of different shapes. Here’s a rope-circle thing.

The gist of how it works: There’s two images. A colour image, and a greyscale image that determines animation timing (lighter parts of the image are shown earlier). Here’s the timing map.

Show more
Mastodon

Invite-only Mastodon server run by the main developers of the project 🐘 It is not focused on any particular niche interest - everyone is welcome as long as you follow our code of conduct!