JavaScript pedalboard
Effects pedals in the browser, using the Web Audio API. Very cool!
Be sure to read Trys’s write-up too.
Link tags: effects
12
Fading out siblings on hover in CSS | Trys Mudford
Well, the clever CSS techniques just keep on comin’ from Trys—I’m learning so much from him!
Carson: Textured fluid type - Steve Honeyman
I reckon it’s time for distressed type to make a comeback—CSS is ready for it.
Text Effects - a Collection by Mandy Michael on CodePen
Mandy’s experiments with text effects in CSS are kinda mindblowing—I can’t wait to see her at Ampersand at the end of the month!
The Eponymous Laws of Tech - daverupert.com
Dave has curated a handy list of eponymous laws.
Your Interactive Makes Me Sick - Features - Source: An OpenNews project
Browsers have had consistent scrolling behavior for years, even across vendors and platforms. There’s an established set of physics, and if you muck with the physics, you can assume you’re making some people sick.
Guidelines to consider before adding swooshy parallax effects:
- Respect the Physics
- Remember that We Call Them “Readers”
- Ask for Consent
Given all the work that goes into a powerful piece of journalism—research, interviews, writing, fact-checking, editing, design, coding, testing—is it really in our best interests to end up with a finished product that some people literally can’t bear to scroll through?
Dwitter
A social network for snippets of JavaScript effects in canvas, written in 140 characters or fewer. Impressive!
JavaScript Systems Music
A massively in-depth study of boundary-breaking music, recreated through the web audio API.
- Steve Reich - It’s Gonna Rain (1965)
- Brian Eno - Ambient 1: Music for Airports, 2/1 (1978)
- Brian Eno - Discreet Music (1975)
You don’t have to be a musician or an expert in music theory to follow this guide. I’m neither of those things. I’m figuring things out as I go and it’s perfectly fine if you do too. I believe that this kind of stuff is well within reach for anyone who knows a bit of programming, and you can have a lot of fun with it even if you aren’t a musician.
One thing that definitely won’t hurt though is an interest in experimental music! This will get weird at times.
CanvasSwirl: An animated spirograph experiment in JavaScript and canvas by xhva.net
But, like, have you have ever really looked at your hand?
CSS element() function - Vincent De Oliveira
Fire up Firefox and try out these demos: the CSS element value is pretty impressive (although there are currently some serious performance issues).
To put it simply, this function renders any part of a website as a live image. A. Live. Image!
OriDomi - origami for the web
A fun little JavaScript library for folding the DOM like paper. The annotated source is really nicely documented.
Blade Runner: Hades Landscape | Douglas Trumbull - Immersive Media and Visual Effects
Douglas Trumbull reveals the secrets of the opening scene of Blade Runner.