Using CSS for Virtual Swimming Lane Graphics

by Tom Kenny (@tkenny)

I spent many hours trying to pick something to render all the graphics (including the static ones). What renders graphics fast and can update quickly? A browser, of course. The Chrome Skia and V8 engine are heavily optimized for graphics rendering, and HTML5 has matured to a point where you can do advanced graphics like this.

Probably the strangest use of CSS I’ve seen but it seems to do the trick quite well.

Source: http://xy-kao.com/projects/virtual-graphics-for-swimming/

Improve your design knowledge in just a minute or two a day, for free

with...

You'll get a free email every Monday to Friday with actionable design details that will increase the effectiveness of your designs. Each one only takes about a minute or two to read.

Free. No spam. Unsubscribe anytime.

by Tom Kenny

I’m a freelance web designer and front-end developer with 9 years of experience designing for the web. Follow me on Twitter here.