Displaying posts published in March 2010.

Click & Hold

It’s actually kind of weird. Mac OS X has a click & hold gesture in its Dock, as an alternative for right clicking or — since Snow Leopard — for Exposé. iPhone OS has a tap & hold gesture to select text or to bring up some options for links in Safari. On the other hand, I have also seen web applications replacing the browser’s context menu with their own, which, in my opinion, is downright annoying.

But for some reason, I’ve never seen a web application use a click & hold gesture, certainly not for a context menu. A quick search on Google didn’t really bring up anything either. Despite the fact that it could be so useful, if only to not hijack the right mouse button. Am I really the first one to think of this? Hard to imagine for something so trivial.

Anyway, since I couldn’t really find anything that does this, I just conjured up a proof of concept myself. It could probably use some improvement, but it conveys the general idea pretty well, as long as you’re not using Internet Explorer even in Internet Explorer.

Proof of concept

Update (March 26th, 2010)

I created a jQuery plugin that adds the click & hold gesture as a custom event, which makes it ridiculously easy to bind your own code to it. You can read more about it and of course download it on the special demo page I created.

More info / Demo / Download

Growl + iPhone = Prowl

Most Mac OS X users are probably familiar with Growl. For everyone else: Growl is a universal, system wide notification system. Applications can use it to notify the user of events, and the user can tell Growl exactly how he/she wishes to be notified. Basically, it’s Windows XP’s popup balloons on steroids. :P

Last weekend, I discovered a rather interesting plugin for Growl, named Prowl. What it does is actually quite interesting. It takes notifications sent to Growl, then uses Apple’s push notification service to deliver them right to your iPhone (or iPod touch, or iPad when available). There’s one catch: it requires installation of a $2,99/€2,39 app on your iPhone. Rather steep for a seemingly simple, one-purpose app. Any and all notifications sent through Prowl, though, are absolutely free of charge. And hey, they have to pay for their server bills, too. ;)

Now here comes the good part. I wrote seemingly simple for a reason. That’s because Prowl has one more feature, and a very impressive one at that. Besides Growl being able to pass it notifications, Prowl also exposes an API that web services can send notifications to. Those will be pushed to your iPhone as well. In other words, Prowl basically provides a general purpose push notification service for iPhone users.

Where Prowl’s original purpose is pretty interesting in itself, this API is downright genius. Think of the possibilities. Want to be notified of comments on your WordPress blog? No problem! Want to be notified of direct messages and/or mentions on Twitter? Prowl’s got you covered!. Want to send notifications from your own web service? Libraries abound! Practically anything is possible.

There’s one more nice little touch to this: the iPhone app lets you open different applications to “view” the push notification, based on the sending application’s name. For instance, you could have a notification of a Twitter mention launch Tweetie for viewing1, instead of Prowl itself.

Now it’s only a shame that Apple won’t guarantee (timely) delivery of any push notification, or this could be a pretty reliable warning system for all kinds of stuff that needs to be monitored. As it is, it’s definitely useful as such, so long as other (more conventional) means of warning are still in place, or if the system being monitored is not mission critical.

1. Which kind of begs the question why Tweetie itself doesn’t have push notifications… :?

Another Growl style

I’ve created a Growl style before. Now I’ve created one again. I call this one SimpleGradient, because that’s what it is: a simple gradient from #ddd to #bbb. It also has rounded corners, and the text seems sunken into the background (like the menu and post info blocks on this site). Other than the fact that — save for the application icon — it uses no images, that’s basically it.

Anyway, it looks like this:

An example of the SimpleGradient Growl style

SimpleGradient Growl style

If you like the minimalistic design and would like to use it yourself, then go ahead and download it.

Be sure to check out my other Growl style.

A new design, at last

Oh yeah, it took some longer than I expected, but here it is: Helvensteijn.com v4!

As the version number suggests, this is the fourth design of this web site since I started using WordPress almost three years ago. Personally, I think it looks somewhat more sophisticated than the previous ones. If you look at the screenshots below, you’ll see my point. ;)

I had the intention to redesign this site for a while already, when I stumbled upon an existing WordPress theme called Mystique. It has some nice touches, especially the checkerboard-over-rainbow thing. Obviously, my design is inspired by Mystique, but not based on it. I built it from the ground1 up, and gave my own swing on pretty much everything.

As I blogged about earlier, I no longer care about invalid CSS, so I didn’t hesitate to apply what I call progressive enhancements all over the place. Rounded corners, translucency, box and text shadows, that’s all CSS. That’s why this web site is best viewed in a modern browser, preferably one that’s not made by Microsoft. While I do support IE7 (which has some cosmetic issues I haven’t found a solution for yet) and IE8, the latest version of a more standards-compliant browser will give you the best experience. Folks using IE6 or even older are plain out of luck, they get served a very basic stylesheet, similar to what you would get if you were to print a page.

I also added some little extra’s for folks with JavaScript enabled. Not only the font size can be adjusted, you can pick a few different color schemes as well. It is also possible to turn off (and back on) animations2. Some people like them, others don’t, so I left the choice to you. These options can be found in the top right corner, no matter how far you’re scrolled down. Just hover your mouse over the little “preferences” box to bring them up. In addition, sidebar widgets are collapsible, which could be useful especially for the archives widget which is already quite long. All these preferences are saved in cookies.

Which brings me to yet another extra: the Twitter thing in the header. I have your browser fetching my latest tweet from Twitter on each page load. I’ll probably have to look into caching that in a cookie for an hour or so, but I had to so something with all that empty space. :P

I don’t think this design is complete or finished. My designs never are, especially when just launched. Numerous tweaks and enhancements will probably be added in the near future. Consider this design beta. :P

Last but not least, here are some screenshots of the previous designs to compare with:

a screen shot of the first design

First design

a screen shot of the second design

Second design

a screen shot of the third design

Third design

Update (March 18th, 2010)

Made a rather major tweak. Found a nice font a few days ago, and decided to use it for the titles all over this site. It’s called Museo, made by Jos Buivenga.

1. The ground being a “blank” theme made by Chris Coyier
2. Except for the lightbox animations; once initialized, they cannot be dynamically toggled

Preferences