UI Design


27
Apr 10

Transmit 4 Review

For years, one of the most popular OS X FTP applications has been Transmit. Panic’s FTP workhorse is so well regarded and robust, it’s engine was even chosen by Apple to power the FTP upload feature built-in to iWeb.

But OS X has gone through a lot of changes since Transmit 3 was first introduced and the app is starting to show its age. Enter Transmit 4!

This latest update adds a completely new user interface, innovative new features like Transmit Disk as well as a slew of customisation options. I was fortunate enough to be a beta tester for version 4, so I’ve had a few weeks to play with the new version – here are some of my thoughts.

New UI

Panic is know for their sleek user interface design and attention to detail and Transmit 4 is no exception. First off, the biggest change of them all: A NEW TRUCK!

But the logo isn’t all that has been refreshed: The entire app feels brand new. Most UI elements have been given a 2010 update and the interface feels a lot tidier.

You start off with a list of your configured servers that uses a sleek black look that was made popular by apps such as PixelmatorCoverScout 3 and SongGenie (disclaimer – I work for equinux).

You can choose an icon for your servers, or use the server favicon

Selecting a server puts you into a familiar file browsing mode – more on that below:

Buttons and features are usually exactly where you would expect to find them and unobtrusive animations and pretty icons round out the package and give the app a nice touch of Panic personality. Here are a few bits of eye candy I noticed during testing:

Progress indicator

Breadcrumb navigation

Nice use of icons in the replace dialog makes it clear which file you need to replace

File Browsing, Places & Quick Look

An FTP client fundamentally has two jobs: show me my remote files and allow me to move files between my local and remote storage. To accomplish that, an FTP application has to replicate a lot of the functionality of a regular file browser, so users can browser their local files as well as their remote files.

Transmit 4 offers single and dual file-browser layouts, (rearrangable!) tabs and the icon, llist, column and cover flow viewing styles you are familiar with from the Finder. But it also has a few additional tricks up its sleeve, that you won’t find in the Finder.

Here are some of the more interesting file browsing options:

  • Folders above Files changes the sort order, so that folders are always displayed before your files in a view
  • Quick Look makes it easy to see a file’s content and even works with remote files stored on your FTP server
  • Places can store shortcuts to your most frequently used folders, so they are just a click away. You can also drag files to a Place shortcut.

Places give you quick access to commonly used folders.

Places is really useful, but the way you add locations by dragging them to the breadcrumb area is a bit unconventional. Once you’ve figured it out though, it quickly became one of my favourite Transmit 4 features.

Transmit 4 offers enough view options to suit almost anyone’s preferred file browsing style. Whether you perfer to work with multiple windows, tabs, split layouts, column view etc – Transmit 4 has got you covered. While it’s debatable whether most users need so many options, file browsing habits are usually so ingrained that it was probably a good idea for Panic to include as many options as they could.

DockSend, Droplets, TransmitDisk and more…

Most of the time, I find myself uploading files to the same place over and over again. Transmit has a number of ways that give you an easy way to send a file to your FTP server straight from the finder:

  • Drag it to a custom droplet you can create in Transmit 4
  • Enable Docksend and you can drag it directly to the Transmit 4 icon in your Dock
  • Turn on TransmitDisk…

TransmitDisk is a nifty new feature, that uses MacFUSE to allow you to mount your FTP server as a volume that the Finder can see. Once mounted, you can interact with your FTP folders like you would with a drive on your local network.

In my experience this worked fairly well, but occasionally felt a little bit more sluggish than using Transmit’s own file browser – but your mileage may vary.

Conclusion

Overall this is a great upgrade to an already very useful application. The new features are well thought out and make working with your FTP server a lot easier and faster. While this isn’t a revolutionary upgrade, it is solid enough to make it worth your while.

You can buy or upgrade to Transmit 4 in the Panic Online Store.


19
Apr 10

Three things on the iPad that feel rushed

Most people would agree that the iPad is a fantastic 1.0 device. This is of course partly due to the shared iPhone OS heritage, but the overall experience is nonetheless is extremely well-rounded and polished.

But there are a few areas that feel a bit crummy, when compared with the rest of the experience. Considering how many apps Apple had to completely overhaul for the iPad’s presentation in January, it’s no surprise to find a few rough edges, on the otherwise fantastic device.

File syncing

I understand why Apple is hesitant to add any kind of file system to the iPhone OS, but considering how much emphasis was placed on the iPad apps at launch, you would think that they would have come up with an elegant way to get documents on and off your iPad.

Unfortunately, in reality it’s a huge pain. Ted Landau took the time to document all the steps it takes to actually get a document into iWork on your iPad, none of which are particularly intuitive. Plus you then have the hassle of managing revisions and tracking multiple copies of the same file.

The iPhone app SimpleNote and Notational Velocity on the mac show how document sync can be done right. Some apps are also adding Dropbox support, which gives you an idea how file sync in general could be improved. Given the fact that Apple has already done a lot of the hard work by creating the MobileMe and iWork online services, one can only hope that we’ll see seamless, cloud-based file syncing added sooner rather than later.

Safari caching

If you open multiple tabs in safari on your Mac, switching between them is instantaneous. In mobile safari, you can never be sure whether the tab will open immediately, or whether it will need to be reloaded over your wifi or 3G connection. On the wifi-only iPad, where users can’t be sure they’ll always have access to an internet connection, webpage persistance is particularly an issue. The fact that Offline Pages (iTunes link) is currently one of the top free iPad apps in the App Store would seem to underline this point.

Mobile Safari’s limiting caching abilities are most likely due to the limited amount of RAM in the iPad, which has just 256MB, however as Rentzsch has pointed out, it should be possible to offload pages to the solid state drive as a workaround, although it’s not a trivial problem.

Calendar event creation

Making event creation in calendars difficult seems to be one of Apple’s favorite UI slip-ups. The calendar app on the iPad is gorgeously designed and it makes browsing through calendar entries a visual pleasure.

But the interface for adding entries seems to have been cut & paste directly from the iPhone version and doesn’t make any use of the additional screen real estate the iPad offers. You get the impression the designers spent all their time working on the rest of the UI and simply stuck the editing controls in there at the last minute.

Consistency between the two platforms is of course a good thing, provided it doesn’t slow the user down unnecessarily. I would argue that you could better use the iPad’s screen real estate to make a much more efficient and intuitive event creation UI.


6
Apr 10

Grassroots UI Innovation

When Apple introduced the iPhone and later the iPhone SDK, they established a series of UI metaphors, interaction models and conventions, that have served as a template for nearly all third party apps. Gestures such as swipe to delete, or UI elements such as springy lists are simply expected.

Apple has done such a great job of establishing best practices for nearly all types of UI interactions that it’s not often you see news kinds of UI interaction introduced by third party developers.

But when Atebits introduced Tweetie 2, it also introduced so-called “spring reloading”. Basically if you pull down past the end of a list, causing it to spring back, you can refresh the current list of tweets.

Many reviewers noted the ingenuity of this design, as it effectively turned a habit of many users (namely playing with the springy lists) into a useful feature. This design has since been adopted by several other applications and seems as though it may become a de facto UI convention on the iPhone OS.

Here is the original Tweetie 2 design:

Foursquare is basically a straight up copy:

This is Gowalla’s take on it – the logo appears to let you know you’ve pulled down far enough:

And the Wikipedia app Articles uses the design to lock or unlock your screen orientation:

It’ll be interesting to see if this convention is adopted by more applications going forward – or if Apple will even perhaps add it to their own apps. But at any rate, it’s nice to see good UI innovations from a third party developer being adopted by others. I can’t wait to see what Atebits and others come up with for the iPad.


31
Jan 10

3 Mac apps with perfect UIs for the iPad

For the first time ever, the iPad gives developers the chance to design desktop-class applications for a multi-touch based user interface.
Here are 3 Mac applications with user interfaces that I think would work really well on the iPad:

1. Times

This fantastic RSS reader is already multi-touch aware and is a dream to use on MacBooks with multi-touch trackpads. You tap to read full articles, 3-finger swipe up to return to the overview or 3-finger swipe left and right to switch between sections. The gorgeous UI is the closest thing to reading a real newspaper on your Mac and Times could be a perfect match for the iPad.

Times RSS.png

2. CoverScout

The coverflow-esque UI in CoverScout is a perfect fit for the iPad: You can swipe through your albums, double-tap to start a search and then drag a cover from your search results to an album to apply it.
The search results bubble introduced in CoverScout 3 is also very reminiscent of the new popover list UI element introduced for the iPad.

Whilst you can certainly argue whether this is the type of application you would use on the iPad, the interaction style seems as though it would be an ideal match.

CoverScout with popover.png

3. Djay

If there’s one application that would really work well with a touch-screen UI, it’s Djay. Being able to use a MacBook multi-touch trackpad as your DJ controller is nice, but a 9.7 inch touchscreen control would offer a much better, hands-on experience. Currently it looks as though access to the music on your iPad will be restricted though, making a real port of Djay unfeasible.

DJay.png

2010

It’ll be interesting to see which Mac applications will be turned into iPad versions and what level of sophistication iPad apps have. Will they stay simple and iPhone-esque? Or will we see Mac application developers come out with truely desktop-challenging versions of their products? 2010 should be an exciting year for developers…

If you like this article, shop at amazon.com and support Jetplane Journal.


28
Jan 10

Jetlinked: iPad UI Roundup

Sebastiaan de With has posted a very comprehensive analysis of some of the new UI elements introduced on the iPad:

As usual with a large Apple product launch, I’ve written up this post to round up the good, the bad, and the ugly of all the new interface and interaction designs that were set loose on the world by the company that’s regarded as the most influential and skilled when it comes to designing experiences.

Man, where do I begin.

He’s done a terrific job of scrutinizing all the videos and screenshots on various websites as well: Cocoia Blog



17
Jan 10

Ripping Audiobook CDs with iTunes

iTunes made it easy for everyone and their mother to finally join the digital music revolution. Ripping music CDs is straightforward and fairly easy to do, as is buying music via the iTunes Store.

But I’ve lost track of how many times I’ve showed friends and relatives how to import their audiobook / spoken word CDs properly. It was also one of the questions I was most often asked whilst working at an Apple retailer. There are a ton of tools and tutorials on the net that also address this issue, which seems to suggest people continue to struggle with this problem.

By default, iTunes imports CDs as individual tracks and adds them to your “Music” library. To rip something as an audiobook in iTunes 9:

  • Select all tracks
  • Choose Advanced > Join CD tracks
  • Select Import Settings and choose “Spoken Podcast”
  • Import CD
  • Select imported tracks, File > Get Info
  • Under options, select “Media Kind: Audiobook”

To make things easier, I would suggest Apple add a simple option screen, similar to the one they currently show if you select an empty media category.

This is a mockup of what it could look like:

With millions of iTunes users out there, I’m sure this would help a fair number of people, without being troublesome for other users.Comedy CDs and childrens stories continue to be popular on CDs so it’s not just audiobooks that could be ripped with this option. One could even envision some of the other import options being exposed this way, e.g. a “Import losslessly” option.

Anyway, food for thought.

Image credit: Audiobook icon by Splasm Software, Inc.


16
Jan 10

Jetlinked: 20 Beautiful Mac apps

Designreviver has a nice list of 20 Beautiful Mac apps that is worth checking out. There are only a few picks I disagree with:

  • Pixelmator’s black icons on a HUD window background have always bothered me and seem like a bad UI choice
  • iStatmenus is pretty, but never feels very Mac-like
  • TuneUp is the antithesis of a beautiful Mac app. It leeches onto iTunes and looks & feels more like a Firefox plugin than a Mac app.

But the list has a few lesser-known entries as well, so it’s worth reading for a few gems that you don’t see on every other list (I’m typing this in blogo which I hadn’t heard of before…).

Link


22
Apr 09

JetLinked: Tweetie for Mac

Tweetie for Mac logoEnough has been said about Tweetie for Mac, so I’m just going to link to it, in case you’ve been living under a rock and have missed it.

Bottom line is: The UI is fantastic, support for dragged in images is great and I believe it sets the bar a little higher for UI design on the Mac in general.

There are some additional features I’d like to see at some point, but from the look of the responses on Atebit’s Get Satisfaction page, some of them are already planned.

  • Support for stored searches
  • Sync state with the mobile version and across Mac

You can find out more about Tweetie on the Atebits website.


31
Jan 09

iPhoto ’09 UI Observations

Good artists copy, great artists steal.

We all know that Apple sets the bar for UI design in its own applications and most 3rd party apps try to follow Apple’s lead. That makes it all the more interesting to see Apple “borrowing” design cue’s from 3rd party developers.

Continue reading →


22
Jan 09

Spotlight suggestion: Tab between groups

picture-151I’ve gone back and forth between using Spotlight or using a 3rd party tool (I’ve given up on Quicksilver, but I have high hopes for Google’s Quick Search Box by the same developer) might be to quickly access apps and files. I’d prefer to use a built-in tool to be honest, but Spotlight never seems to quite cut it.

A big improvement would be the ability to tab between the different result categories, similar to the way you can tab between other UI elements That would allow users to get to their goal faster and would also make the behaviour feel more consistent with the rest of the operating system.

A few additional commands or the ability to launch web searches would also be nice, but better search results and navigation of those results would be a great start.

Here’s hoping for 10.6!

Update:

Aaand of course I just couldn’t find the right shortcut.  In the comments my colleague pointed out a tweet by Scott Stevenson with exactly the shortcut I was after. Thanks Albert & Scott!


2
Sep 08

Google Chrome: First Impressions

Well, Chrome is here and so far I’m pretty impressed. Although currently only available for Windows (you can’t actually download the Windows version if your browser identifies you as a Mac user – I had to select a Windows user agent for the download page to let me download it) it’s quite snappy, even running under Parallels. 

I had no trouble loading any pages and even complex pages such as my netvibes.com customized homepage (which is slow to load on other browsers) seemed to load very quickly (and this was in a virtual machine!).

Continue reading →


22
Jul 08

OpenID is a mess

OpenID seems like a nice idea to simplify logins and profiles on the web. The promise: Create an account with one OpenID-enabled service such as Yahoo, WordPress or others and then you’ll be able to sign in to other OpenID-enabled services.

The reality? OpenID still has some way to go before really becoming seamless enough for the average user to use it. Most of the issues lie with the sites implementing OpenID, but from what I can see they’re pretty systemic Here’s my OpenID experience:

1st attempt: Using my wordpress account to sign up for Skribit

So I decided to sign up to Skribit. They offer OpenID support, so I decided to try that, rather than create a traditional account. First of all you’re asked for your OpenID url. If you don’t know what that is, tough luck. There’s no link with more information on what your url could look like or how you can get one. 

Frustrated, I figure I’ll go to OpenID.org to find out more. OpenID.org looks like a cross between a phishing site and 1996:

Continue reading →


14
May 08

Fun with Vista!

Yup – the dark side has got me – I’ve installed Windows Vista.

But don’t worry: it’s only replaced my somewhat older XP installation temporarily as part of an assignment for University. And luckily I didn’t need to purchase a license either – Microsoft allows students in my course to apply for free Academic licenses.

So that’s why I found myself installing Vista Business Edition this past weekend.
Continue reading →


13
Apr 08

Three OS X quirks that confuse the hell out of switchers

OS X is a great OS for “newcomers” and “power users” alike. Almost inevitably it’s OS X’s user-friendliness that (deservedly) gets most the attention – printers just work, BSOD-style crashes are (almost) unheard of and drivers are such a non-issue, they’re practically invisible (they either just work, or they don’t).

But instead of focusing on the good, today we’ll be taking a look at the bad and (shock!) ugly areas of OS X that confuse far too many switchers…
Continue reading →


31
Mar 08

Mail.app RSS feed UI

Mail RSS UI

Is it just me, or is the button that adds an RSS feed to your Inbox in Mail.app really perplexing at first?

I’d prefer not to have my feeds show up in my inbox as I try to keep the inbox as empty as possible. Instead I just browse the feeds occasionally for interesting articles or news.
Continue reading →