Bookmark management in Safari for the iPad, iPhone, and iPod Touch completely sucks.

Yes, you could manage your bookmarks with whatever version of Safari you happen to be running on your desktop or laptop, and then synchronize the bookmarks to your devices through iTunes. That works great if you're one of the 2% of crazies that actually use Safari or pay Apple $99 a year for MobileMe. You could also import all of your bookmarks from IE or Firefox or what-have-you into Safari and then synchronize to your devices. Knock yourself out. I'm sure that will be a great use of your time and that you'll really enjoy regularly maintaining your bookmarks across browsers and devices.

None of this ever really bothered me, though. I don't use browser bookmarks anyway (does anyone anymore?) There's browser history and address bar autocomplete, not to mention there are more than enough online tools to keep track of where you've been, where you want to go back to, and what you want to remember. All of this eliminates the need to load up your browser with thousands of bookmarks.

What I do use, however, is bookmarklets -- those tasty little bits of Javascript that masquerade as bookmarks but add actual functionality and convenience to your everyday World-Wide-Web experience. Unfortunately, getting these bookmarklets into Safari on the iPhone is an extremely painful process. But that didn't bother me either... until I got my iPad.

Once I got my hands on the pad, I quickly realized I could no longer function without my beloved bookmarklets. I found myself surfing in a way that mimicked my desktop browsing behavior much more closely than when I browsed on the iPhone.  This meant that I now needed to have my bookmarklets for sharing, posting, tagging, saving, look-ups, etc. But the steps for adding a bookmarklet on the iPad was the same as with the iPhone -- an awful one.

The process is far too painful to describe in detail, but Marco Arment of Instapaper details the procedure nicely in his step-by-step guide to adding the Instapaper bookmarklet to an iPhone or iPad.

Basically, you first need to add a placeholder bookmark, and then edit that bookmark by renaming it and pasting the bookmarklet's Javascript into the field reserved for the bookmark's URL. That doesn't sound so terrible until you realize it involves somewhere between 10 and 13 taps as well as typing and pasting.

It goes something like this:  

Of course that's only IF you managed to find a way to copy a bookmarklet's Javascript to your clipboard.

And that, for me, is the part that goes beyond pain and crosses over into torture territory. Bookmarklets are created by putting Javascript into a URL.  This enables you to drag the snippet to your browser's bookmark bar like any other link.  Unfortunately this just wont work in Safari for the i-Devices. And if you think you can take a gander at the page's source in mobile Safari and copy the Javascript from there, you are mistaken. Furthermore, it isn't standard practice (thankfully) for bookmarklet creators to put the bookmarklet's Javascript on the page for you to copy and paste into a bookmark. In most cases that would be fugly. And stupid.

So I took a few minutes to copy the Javascript from all my Chrome bookmarklets and made myself a little iPhone/iPad formatted page with all the Javascript in a selectable textarea for each bookmarklet. I opened up the page on my gadgets, and in about 5 minutes had all of my important bookmarklets loaded into Safari on both my iPad and my iPhone.

I know this is far from ideal, and even further from anything resembling a solution, but until some smart person comes up with a way around this, or until Apple adds some better bookmark management or add-on capabilities to mobile Safari this will have to do for now.

I'll leave this page up for anyone who wants to add some of these bookmarklets to Safari on their own iPads or iPhones. Just visit http://static.chrisbray.com/bookmarklets on your iPad or iPhone and start tapping.  I hope this takes at least some of the pain out of the process.

When a 2009 survey revealed that 50% of their customers with smartphones have iPhones, the web-based company asked us (Schematic) to partner with them in creating a mobile strategy, and to build an app that would make buying groceries even easier for their customers on the go.

So that's exactly what we did.  

Perhaps the most complex transaction-based commerce application available in the App Store to date, the FreshDirect iPhone app delivers about 90% of the same functionality available on FreshDirect.com.  

Partnering closely with FreshDirect, we designed an experience that enables users to access FreshDirect's entire inventory of food and brand-name groceries, while promoting their proprietary website features such as nutritional information and daily produce and seafood quality ratings. We also implemented the site’s Quick Shop feature, which makes it fast and easy to shop from previous orders, favorite items, or curated lists such as "President's Picks" and "Featured Deals". The app enables their customers to start a new order from scratch on their iPhones, as well as modify an existing order or delivery time.

FreshDirect customers can now do all their grocery shopping in just a few short minutes wherever they happen to be — in a taxi, on a bus, or, if you are like me, staring mindlessly into the refrigerator.

Check out the video below that highlights the key features and functionality of the FreshDirect iPhone app, then go download it for free.  If you have time, you should also check out the Wall Street Journal's article on the app in today's Digits blog. Lastly, don't forget to celebrate the release by entering for a chance to win a gift card worth $500 in FreshDirect food, plus a $500 gift card to the Apple Store. Nine lucky second-place prizes will win a $200 Apple gift card, plus $100 in FreshDirect food.

On a personal note, I have to say that it was deeply satisfying to have been part of this particular project, and it was a pleasure to have worked with all the talented and dedicated people both at Schematic and over at FreshDirect. You all know who you are, so congratulations to everyone involved with this terrific product launch!

UPDATE: Our good friend Alex over at EveryDayUX has some additional background info on the making of the app, and why it was a dream project for him.

On his website, Antatoly Zenkov's claims he can do anything. That's a bit of a stretch, but what he certainly can do is make an awesome little Java app. Mouse Path (Mac version | Windows version) runs in the background while you work and tracks all of your mouse movements throughout the day. Just launch the .jar file, minimize it, and go about you business. The lines represent the mouse's movement, and the circles represent the mouse at rest. The longer the mouse is idle, the larger the circles are. Mouse Path doesn't recognize multiple displays. It will only track movements on your main monitor, but it will continue tracking as you change Spaces.

In a few hours you'll start to see some terrific patterns emerge. The image above represents about 10 hours of my activity at work on Thursday, Feb 12. The large dark circles were meetings or phone calls, and the smaller circles indicate reading, typing (Mouse Path doesn't capture keystrokes unfortunately), or trips to the bathroom/kitchen. The thick horizontal scratches across the top are obviously from clicking across browser tabs. I've also learned that I spend a lot of time in the upper left quadrant. No real surprise there.

Even if you're not a fan of the action painters like Jackson Pollock and Franz Kline, there is something rather satisfying about unwittingly creating a personal piece of abstract expressionism while you point and click your way through your dull, digital day.

Art from meaninglessness. No mess, and no cleanup.

What you sold...

What you built...

What they needed...

Microsoft's Surface is capable of recognizing items placed onto the tabletop, but with Pictionaire -- a project from Microsoft Research and the University of California, Berkeley -- digital media and common everyday objects found in a designer's arsenal are combined in a way that promises to innovate new ways of productivity-based collaboration in multi-touch environments.

Pictionaire (yes, it's a silly name) promises a system for design teams that introduces interactions for capturing physical artifacts and organizing their digital copies with functionality for retrieval and annotation. It enables multiple designers to fluidly move imagery from the physical to the digital realm; work with found, drawn and captured imagery; organize items into functional collections; and record meeting histories.

The setup is not much different than most large projection style multi-touch tables, and in fact the rig is rather simple and looks like something you might find over at Instructables.

But the key feature here is a high resolution still camera suspended a couple of meters above the surface. The camera takes shots of objects such as magazines, books, sketch pads and white boards and digitizes the content. Once the item is removed from the table it is replaced by the digital version. This allows notes, photos and other items to be captured and then shared in the collaborative environment like any other piece of digital media. It even allows the digitized media to be overlaid onto real paper, notepads or white boards so it can be annotated or marked up.

Additionally, the table recognizes input devices placed on the surface such as wireless keyboards, mice and pen-based tablets.

When a keyboard is placed on the table, a text box appears, allowing the operator to write, notate the media, and add text to other people's documents. Digital objects can be "linked" to keyboards by simply pointing and clicking with a mouse, and two keyboards, when brought into close proximity to one another, allows the operators to share the document being created.

Check out the vid.

In 1804 Gerhard Bonnier opened a small bookstore in Copenhagen. Since then the Bonnier family has promoted high-quality media products and now, after over 200 years of sustainable media entrepreneurship, they are now a multi-channel media company with experience and knowledge from a full range of media companies across 20 countries.

Berg is a design consultancy in the UK, and works with companies to research and develop their technologies and strategy, primarily by finding opportunities in networks and physical things

Together, Berg and Bonnier have developed this amazing concept video in which they attempt to reinvent the digital magazine for a world in which interactivity, abundant information, and unlimited options are often intrusive and overwhelming.

Of particular note is the elegance and simplicity of the gestural interaction model utilized across all of the examples. Notice how a high degree of interactivity is achieved with a minimal amount of intuitive gestures.  The effortless interface combined with a highly intelligent informational architecture will leave you wishing you could go to sleep tonight and wake up sometime in the world of tomorrow.

If after watching this you want more (and I know you will) you can watch an extended narrated version of the video here

Coleran Reel 2008.06 HD from Mark Coleran on Vimeo.

Mark Coleran has an impressive body of work that may also have the distinction of being the most ridiculed.  At least in the highly opinionated, sardonic, and ego-driven tech developer world. Sure, we all roll our eyes when we see these imaginary (and super responsive) applications being used for detective or spy work in these movies. However, we shouldn't forget that the science fiction of today is one of the primary inputs that help guide and inform the real technological advances of tomorrow.  In fact, I work for a company whose CCO is largely responsible for one of the more imaginative film interfaces in recent memory: The pre-crime computer interface in Minority Report.  And damn, we actually came quite close to building it this year.  Okay.  Not quite.  But still...

At the junction of interestingness, function, form and integrity we may find successful information design.

Linky

Google Image Swirl organizes image search results into groups and sub-groups, based on their visual and semantic similarity and presents them in an intuitive exploratory interface.

What makes this compelling is that ability to explore a concept from different visual perspectives.

Linky