iPad Angst
As of this past Saturday, users who click a “tweet this” link on an individual photo in Portwiture may notice a few extra characters available. By popular request, the app now takes advantage of Flickr’s URL shortening.
What’s unique about flic.kr URLs is that they are not directly tied to a database or fetch-able via the API, but derived from a photo’s unique ID using a variation of base58 compression. This is actually pretty neat, as it sidesteps the need for an additional database query, resulting in a faster experience for the end user.
The only problem is that you, the developer, have to do the work to generate the darn thing. If you need to create it on the fly using JavaScript (as Portwiture does), you may be disappointed by the relative lack of JS code snippets in the official base58 flic.kr dev discussion.
Fear not! Using their PHP example, translating this functionality to JavaScript is a straightforward process.
The only function used therein with no direct JavaScript equivalent is intval. Luckily, the amazing php.js project has us covered with a translation. Grab that function and include it in your source.
Now we simply rewrite the base_encode function, swapping out strlen for .length, [] for .charAt(), and so on.
function base_encode(num, alphabet) {
// http://tylersticka.com/
// Based on the Flickr PHP snippet:
// http://www.flickr.com/groups/api/discuss/72157616713786392/
alphabet = alphabet || '123456789abcdefghijkmnopqrstuvwxyzABCDEFGHJKLMNPQRSTUVWXYZ';
var base_count = alphabet.length;
var encoded = '';
while (num >= base_count) {
var div = num/base_count;
var mod = (num-(base_count*intval(div)));
encoded = alphabet.charAt(mod) + encoded;
num = intval(div);
}
if (num) encoded = alphabet.charAt(num) + encoded;
return encoded;
}Note that the default alphabet differs slightly from honest-to-goodness base58 encoding, omitting certain characters that are confusing in URLs (0 and O, I and l, etc.).
Assuming you’ve already fetched a Flickr photo ID, generating a short URL is now as simple as this:
var shortURL = 'http://flic.kr/p/' + base_encode(4379822687);
alert(shortURL);
// Should alert 'http://flic.kr/p/7F2JGg'That’s all there is to it. Reversing the process is a bit trickier (you need to fetch the author’s name), but this Flickr discussion should get you started.
Want a JavaScript file with intval, baseencode, basedecode and a few helper functions ready and raring to go? You’re one lucky son of a gun:
I couldn’t be happier that my WordCamp Portland 2009 presentation, WordPress-Powered Portfolios, will likely have the shortest shelf life of any presentation I’ve given. It’s a testament to the WordPress team (and open source projects in general) that the “hacks” I proposed only months ago have already blossomed into honest-to-goodness features.
In December, WordPress 2.9 introduced support for post thumbnails, eliminating the need for my custom meta hack. WordPress 3.0 (which should be released around May) will solve the problem of secluding portfolio content from your blog with the introduction of custom post types.
Instead of corralling your portfolio content with tools like “category excluders” or relying solely on nested pages (as I suggested), you’ll soon be able to create a custom “portfolio” post type in a supported and predictable fashion.
As Frank Bültge details on the WP Engineer blog, adding a whole new section to your WordPress sidebar will be a straightforward and extremely flexible process you can bake right into your theme. No crazy plugins or hackery required!
This change is exciting not only for the impact it will have on sites like my own, but because it increases WordPress’ prospects as a hardy CMS solution.
All that’s left to render my presentation completely obsolete is a more robust and customizable gallery solution. I’ll be crossing my fingers.
The iPhone may be my favorite device of the last ten years. No other gizmo since the PC has so fundamentally altered the way I interact with the web and my social circle.
But the iPhone’s ubiquity in the mobile space scares the living daylights out of me.
It frightens me the same way I’m frightened by the deceptive feeling of serenity that blankets me as I continue to surrender more and more of my data to Google (current buddy, future megalomaniac). The thought leaders at Apple have crafted an experience so warm and fuzzy it’s nearly impossible to escape its allure, even as it wallops all of its competitors.
I simultaneously sing the praises of the Semantic Web (often at the expense of rich media plugins such as Flash and Silverlight) while gleefully supporting dozens of apps delivered via the iPhone’s closed, draconian marketplace. The irony (hypocrisy?) therein is not lost on me.
It seems pretentious to avoid these products solely on insular, geeky principal, so I continue to champion competitors in hopes that a superior device will emerge or, at the very least, keep Apple under enough pressure and scrutiny to maintain their innovation and avoid sinking into mediocrity (remember?).
I had extremely high hopes for Palm’s WebOS, but a still-floundering app ecosystem coupled with some truly strange hardware choices appear to have sabotaged its chances. 
While I have much more confidence in the Android OS as a powerful and capable mobile device standard (especially in the long-term), the platform seems troubled by a lack-of-consistency between devices and the same snore-inducing, incremental release cycle that eventually tempered my excitement for ambitious open source projects like Ubuntu.
It could just be my ignorance of the platform, but as the iPhone becomes increasingly capable at performing business tasks I begin to look upon Blackberry users as I did AOL users ten years ago—with a feeling of solicitude generally reserved for endangered species.
What we need is a platform with a distinctive and decidedly un-iPhone-like user experience (an iPhone killer killer), produced by a company with experience facilitating ecosystems yet still capable of supporting a wide range of hardware and service providers.
Did you just say Windows?
That’s right, Microsoft showed off Windows Phone 7 Series this week, and it looks great. The minds responsible for the well-reviewed Zune HD have re-designed the mobile operating system from scratch. Designers like myself who admire the HD’s interface are thrilled, but considering the Zune’s marketshare could be very generously described as having a “lack of ubiquity,” it’s a brave (and admirable) move to hand them the keys to Microsoft’s mobile future.
Instead of forcing the user into disparate applications specific to function (iPhone) or allowing the user to multi-task until their poor little phone grinds to a halt (Android), Windows 7 Phones establish contextual hubs of interest. If you want to see what your cousin has been up to this week, you don’t have to check email, Facebook, Twitter and chat in separate apps; simply tap “People,” then select your cousin’s profile. This style of traversing your media and social circle is extremely thoughtful and appears to be well-executed. I know it won’t please everyone, but I’m certain a percentage of the population will instantly prefer it.
The interface itself looks completely unique, at least if you’ve never used a Zune. Subtleties like highlights, shadows, soft corners and texture are completely absent, allowing only color, typography and your content to show through. While occasionally abrasive (especially in the calendar application), it’s a striking choice that’s extremely memorable and looks beautiful in motion.
It isn’t all sunshine and rainbows, though. The browser is still Internet Explorer, albeit the improved (but sluggish) version found in the Zune HD. Until Mobile IE supports the same sort of HTML5 features that have enabled web app developers to deliver rich mobile experiences to the iPhone and Android devices, Windows Phones will still be an obstacle in the evolution of the mobile web. Perhaps most depressingly, hardware actually supporting this OS probably won’t debut until Christmas, and who knows what may have changed by then.
Aside from the platform itself, what excites me most about this announcement is that another Apple competitor has finally shown they’re awake. Watching Apple merrily stomp ahead with Android slowly gaining ground and Palm off in the distance is becoming tiresome.
But an Apple/Google/Microsoft/Palm slugfest? I’d pay to see that.
One of the biggest disappointments I continually encounter when teaching web design is losing students to rich media plugins, most commonly Flash. These closed, proprietary sirens singing talented designers and developers out to sea rob the Semantic Web of some truly creative minds.
Students often look at the Web and see a minefield of limitations. Several times I’ve approached students with stellar HTML/CSS/JavaScript-based work to ask about their career plans, only to hear “I’d rather pursue Flash work.” No matter how many times I offer tomorrow, many students are only interested in now.
I evangelize the Semantic Web clearly and passionately in my lectures, but arguments of principal, search engine optimization and accessibility often flounder in view of visually-engaging, rich web media. There is a fine line between designer and artist; in order to appeal to these minds, we must impress them on a more visceral level.
Given time, I think HTML5 and CSS3 are up to the task. My arsenal of compelling examples has been growing exponentially.
Mouse over the DVD cases when viewing For A Beautiful Web in Safari 4 and you’ll encounter some gorgeous and purposeful rotation-based animation that degrades gracefully for less-abled browsers.
In Mac OS X Snow Leopard, Guillermo Esteves has recreated the Star Wars Episode IV marquee for Webkit users (perspective and all).
Firefox 3.6 introduces support for the File API, making drag-and-drop file selection possible (thereby trumping Flash’s previously-superior selection capability).
Webkit users who opt-in to bleeding edge features can now experience YouTube and Vimeo sans Flash players using only HTML5′s built-in media support. The result is stunningly indistinguishable from Flash video playback.
These examples may appear to be small victories, but their importance cannot be overstated. We are watching the capabilities of HTML and CSS progress more rapidly (and with farther-reaching effect) than their rich media cousins. In a Web where the capabilities of Flash and HTML are roughly equivalent (or perhaps even lopsided), the choice will be abundantly clear.
Address all audiences via the Semantic Web, or keep playing in your sandbox. Which sounds more fulfilling to you?