Join us for a lively discussion as we talk about designing and coding for the likes of the Sundance Film Festival and New York Magazine, and the joys of responsive web design, working remotely, and swearing profusely on Twitter. We may even get Ethan’s take on Microsoft’s dazzling new IE9.
As always, watch and participate in the live broadcast by tuning to live.5by5.tv at the appointed time.
This Thursday, June 3, 2010, at 1:00 PM EDT, join Dan Benjamin and me for the taping of The Big Web Show Episode Six, as we chat with leading interaction designer Luke Wroblewski about designing for the mobile space, and learn why the mobile experience for a web application or site should be designed before the PC version.
Designing for 700 million people
Luke Wroblewski is an internationally recognized digital product design leader who has designed or contributed to software used by more than 700 million people worldwide. He is the author of Web Form Design (“That rare book capable of transforming the way an entire field does its business.”—Communication Arts) and Functioning Form, and an extremely popular speaker at leading web design conferences. After long stints as Chief Design Architect at Yahoo! and Lead User Interface Designer of eBay Inc.’s platform team, he is currently Chief Design Officer and co-founder of a stealth start-up.
Watch, Listen, Participate
Participate in the live taping by sharing your questions for Luke via chatroom or phone.
5by5 is an Internet broadcasting network, home to podcasts like The Pipeline, The Big Web Show, The Conversation, The Dev Show, and more, with over 120,000 downloads per week. The Big Web Show features special guests and topics like the future of publishing, art direction online, content strategy, web fonts and typography, CMS shootouts, HTML5 and CSS3, building an audience, and more. Previous episodes are available for your listening and viewing pleasure.
New open standards created in the mobile era, such as HTML5, will win on mobile devices (and PCs too). Perhaps Adobe should focus more on creating great HTML5 tools for the future, and less on criticizing Apple for leaving the past behind.
Except Steve Jobs’s subtext isn’t “web standards, web standards, web standards, told you so.”
Except it kind of is.
More Mod on the Digital Book
A Reading Heatmap: Key passages illuminated by layering all readers’ highlights for the same text.
LAST MONTH, he wowed us with Books in the Age of the iPad, a call to make digital books as beautiful as printed ones. This month, Craig Mod is back with Embracing the Digital Book, an article (or blog post if you must) that begins as a critique of iBooks and Kindle and moves on to discuss the e-reader of our dreams, complete with reasoned social features:
I’m excited about digital books for a number of reasons. Their proclivity towards multimedia is not one of them. I’m excited about digital books for their meta potential. The illumination of, in the words of Richard Nash, that commonality between two people who have read the same book.
We need to step back for a moment and stop acting purely on style. There is no style store. Retire those half-realized metaphors while they’re still young.
Instead, let’s focus on the fundamentals. Improve e-reader typography and page balance. Integrate well considered networked (social) features. Respect the rights of the reader and then — only then — will we be in a position to further explore our new canvas.
In both cases, converting your file to ePub is as easy as saving it as a PDF or Microsoft Word document—you just pick ePub from the choice of export formats and hit the button. Voilà, the ePub file appears wherever you saved it. Drag that file into iTunes, sync your iPad, and you’re finished: your book will now show up in iBooks next to any other e-books you’ve purchased. Both tools also allow you to add your own cover art, and tweak the book’s metadata (author, description, genre, and so on).
Touch Gesture Reference Guide
The Touch Gesture Reference Guide is a unique set of resources for software designers and developers working on touch-based user interfaces including iPhone, Windows 7, Windows Phone 7, Android, and more.
The guide contains an overview of the core gestures used for most touch commands. It tells how to use these gestures to support major user actions; provides visual representations of each gesture to use in design documentation and deliverables; and additionally provides an outline of how popular software platforms support core touch gestures. All in seven pretty PDF pages. It was conceived, researched, illustrated, and designed by Craig Villamor, Dan Willis, Luke Wroblewski, and Jennifer Rhim (document design).
Platform support information comes from the following sources:
It’s only Wednesday but we already have our link of the week. Although they call it merely a “quick write-up” (and it is a fast read), iA’s mini-compendium of design insights before and after the appearance of the iPad at their office should be required reading for all web, app, and/or interaction designers.
In the equivalent of a breathlessly quick seminar presentation, iA discusses typographic resolution and feel; the effect of the device’s brilliant contrast on readability; the kitsch produced by rigorously adhering to Apple’s “make it 3D” guidelines; whether metaphors work; and more—all of it well worth far more than the little time it will take you to absorb.
In particular, I call your attention to the section entitled, “Interaction Design: So What Works?” Although intended as a guideline to producing well-tuned iPad apps, it also works splendidly as a mini-guide to creating better websites, much like Luke Wroblewski’s brilliant “Mobile First” presentation at last week’s An Event Apart, which carried a similar message:
The limited screen estate and the limited credit on the number of physical actions needed to complete one task (don’t make me swipe and touch too often), pushes the designer to create a dead simple information architecture and an elaborate an interaction design pattern with a minimal number of actions. This goes hand in hand with the economic rule of user interaction design: Minimize input, maximize output.
Since the smallest touch point for each operation is a circle of the size of a male index finger tip, we cannot cram thousands of features (or ads!) in the tight frame; we have to focus on the essential elements. Don’t waste screen estate and user attention on processing secondary functions.
We found that the iPad applications we designed, made it relatively easy to be translated back into websites. The iPad could prove to be a wonderful blue print to design web sites and applications. If it works on the iPad, with a few tweaks, it will work on a laptop.
And so do my iPhone and your iPad. All it took was a bit o’ the old Richard Fink syntax and a quick drive through the Font Squirrel @Font-Face Kit Generator (featuring Base 64 encoding and SVG generation) to bring the joy and wonder of fast, optimized, semi-bulletproof web fonts to Safari, Firefox, Opera, Chrome, iPhone, and Apple’s latest religious device.
Haven’t checked IE7, IE8, IE9, or iPad yet; photos welcome. (Post on Flickr and link here.)
What I learned:
☛ Even if manufacturer supplies “web font” versions with web license purchase, it’s better to roll your own web font files as long as this doesn’t violate the license.
Screw the haters
Tasteful and true: iPad wallpaper by Anders J. Svensson at Veer’s The Skinny.