Most-used Shortcuts User-interface Helper Element idea

[Update: This tweet just brought to my attention essentially what I was looking for, and it’s called Cheatsheet for OSX. Just installed it and it works well so far!]

So I just found this idea in an email to myself from five years ago. Still haven’t seen anything quite like it, even at a ad-hoc level. This idea pertains to an OS-wide level, ideally.

When in a shortcut-heavy program like Pro-Tools, iPhoto, iTunes, etc., it could be useful to have a little optional window pop up when hitting shortcut keys, like option + command, shift + command, etc., and in this window would be listed the most frequently-used shortcuts by that user, and a quick description of what those shortcuts do.

For instance, in iTunes, if I were to hit:

option+command

The little window would fade in, and list:

option + command + E - Equalizer
option + command + L - Downloads
...
...

This could be dynamic, where if you hit just command, every shortcut that uses the command key would show up in the little window (starting with the ones most frequently used, then if you hit shift, it would filter to only shortcuts that use both of those keys.

The closest thing I can think of is in, say, a right-click context menu in Finder on OS X, if you hold down option you’ll see the contextual menu items change.

Terrification

Usually, the more you understand something, the less you will need to fear it.

The anxiety dreams and nightmares of my youth have been all but erased due to my understanding of the world, understanding about my lack of knowledge, and other mechanisms for action within my own psychology. When I first saw the below animated GIF, I immediately understood why it would be perceived to be terrifying, hilarious, both, or neither. It also triggered an association for what was for me another association trigger: One of the most disturbing films I’ve seen, David Lynch’s Mulholland Drive.

Not scary per se, but disturbing. Unsettling. An unplaceable oddness. In Mulholland there is a masterful build-up, starting with a cryptic scene in a diner, which ultimately has the character who is describing a state of pure terror to another, walk outside to confirm that fear, as a horrid creature slides out from behind a corner in a most inhuman way—not only is the figure petrifyingly ugly, but the way it moves is the clincher: nothing human moves like that, in a linear, gliding fashion, and in such a triggered manner.

That scene reminds me of one of my most fear-inducing recurring dreams as a child: alone at my house, walking downstairs from the safety of my room, all the windows dark with night, and as I walk towards the kitchen, the head of a figure, presumed to be a robber intent on killing or harming me, quickly pops up—the moment of paralyzation occurs, the head slides away from whence it came, not slow, but not too fast; it doesn’t mind being seen. The paralysis melts, and I have to wake up, because that’s it: that’s the end. The unanswered nature, combined with the uncertain demise, is what makes it so terrifying. The chills that I would get in Lynch’s surrealist mind-maze were the same that I’d feel in that dream and others.

That a few frames of a presumably screeching elderly woman exiting stage-left in a weird manner can elicit the heights of cinematic tension through mere GIFfery is fascinating, lending versatility to how the web can provide media feels in an instant. But it also further defines the five minutes that Lynch crafts through his singular direction—it is a scene that will live on, beyond the ephemeral meme-sharing thrills that come from a copy & paste, and into how we relate our waking- and dream-selves to ourself and to those around us.


Further reading: Alex Gladwin does an excellent job of analyzing the whole scene in his write-up, The Tuesday Zone: The Winkie’s Diner Scene from ‘Mulholland Drive’.

Original GIF post here.

CSS parallax effect for my About page

I just revamped my About page using a CSS-only method described in detail by Keith Clark here. Really happy how easy it was to use and extend!

The key is using the CSS perspective property in the wrapping div, where the children planes then appear to scroll at different speeds due to applied transform: translateZ(n) properties:

keith clark css parallax method

I’ve been wanting to play around with this for a while, without getting into Javascript methods, and from Keith’s post and the follow-up comments, it appears the modern browsers—especially Chrome, natch—do either a fast or acceptable job of rendering it performantly due to the browsers being able to use hardware acceleration.

The art of Chelsey Pettyjohn

The amazing style of Brooklyn artist Chelsey Pettyjohn, that I just happened upon in Instagram this morning.

Some of my favorites are embedded below. Note: I think they’re beautiful but some might consider them dark, disturbing, perhaps nightmarish, so fair warning.

potato connection

A photo posted by Chelsey Pettyjohn (@hideousthings) on


Chompity chomp

A photo posted by Chelsey Pettyjohn (@hideousthings) on


fry daddies

A photo posted by Chelsey Pettyjohn (@hideousthings) on


you again

A photo posted by Chelsey Pettyjohn (@hideousthings) on


stoned again

A photo posted by Chelsey Pettyjohn (@hideousthings) on


candyman

A photo posted by Chelsey Pettyjohn (@hideousthings) on


killer smile

A photo posted by Chelsey Pettyjohn (@hideousthings) on



Peek

A photo posted by Chelsey Pettyjohn (@hideousthings) on


devil take the hindmost

A photo posted by Chelsey Pettyjohn (@hideousthings) on


chop chop

A photo posted by Chelsey Pettyjohn (@hideousthings) on


born to lose

A photo posted by Chelsey Pettyjohn (@hideousthings) on


poodle party

A photo posted by Chelsey Pettyjohn (@hideousthings) on


in the garden

A photo posted by Chelsey Pettyjohn (@hideousthings) on


comforting sounds

A photo posted by Chelsey Pettyjohn (@hideousthings) on


old stuff- moon bison

A photo posted by Chelsey Pettyjohn (@hideousthings) on


bone daddy

A photo posted by Chelsey Pettyjohn (@hideousthings) on


old habits die hard

A photo posted by Chelsey Pettyjohn (@hideousthings) on


chomp chomp

A photo posted by Chelsey Pettyjohn (@hideousthings) on

Modulus-based index for cycling array values

Ah! I forgot about using modulus operator as array index for cycling through array values! Thanks for the reminder, Angular docs (One Time Binding example).

Note the relevant bit:

$scope.name = names[counter % names.length];

Normally I think I’d do something dumb like:

  var counter = 0;
  var names = ['Igor', 'Misko', 'Chirayu', 'Lucas'];

  $scope.clickMe = function(clickEvent) {
    $scope.name = names[counter];
    if (++counter >= names.length ) {counter = 0;}
  };

Which maybe I guess isn’t super dumb, but I like the elegance of the Angular example, as it does away with the minor-but-present cognitive overhead of “do I greater-than/equal this, or just greater than, or pre-increment, post-increment, subtract one from the array length?” mess.

Also, in my version, you lose the counter’s true value, as it becomes more of a cycle counter.

Running list of pinned tweets

Basically my own favorite tweets that I’ve pinned at one time or another. Here is their graveyard. Visit them, plz.

[note: I know that this is going to look somewhat pathetic initially, but hopefully once there are more than a handful it’ll become interesting.]