January 2011
2 posts
2 tags
iBART: Actions vs. Options
The iBART iOS app is a great example of the do’s and don’ts of creating the look and text copy for your actions and options. What we have here is effectively a web form with select inputs, where the options are displayed on a second page. ”Show Trips” is effectively a button or an input of type submit. But as you can see from figure one, that distinction is not made very...
4 tags
Tweetie vs. Twitter for Mac: A UI Oversight
A couple days ago, Twitter released the long-awaited update to Tweetie, the Twitter client for Mac OS X later acquired by Twitter. Tweetie 2, rebranded as Twitter for Mac, fixed some outstanding issues like the inability to delete tweets or mark tweets as favorites. But there were also numerous changes to the interface, beyond the more obvious visual differences, and this is where I started...
July 2010
1 post
3 tags
Single-Step Dialing on the iPhone OS
On the iPhone OS, contacts grouped into the “Favorites” section of the phone application can be dialed with a single touch to the listed name, but for all other contacts in the “All Contacts” section, this is a two-step process. The first tap on the name instead opens the details page for that contact, and the desired phone number in that contact’s details page must...
June 2010
3 posts
3 tags
1 tag
2 tags
May 2010
7 posts
6 tags
7 tags
6 tags
7 tags
3 tags
4 tags
2 tags
March 2010
2 posts
4 tags
6 tags
Single-Line Calculators: Math Through Blinders
Ever since my first time using a TI-82 calculator in middle school, I’ve despised single-line calculators and the usual limitations that come with them.
The TI-82, TI-83, and many other graphing calculators made by Texas Instruments, Casio, and Hewlett Packard, sported large square screens out of necessity to accommodate the graphing functionality. As a side benefit, this provided room for...
February 2010
2 posts
4 tags
Of Widgets and Apps
One of the primary advantages of Apple’s approach to widget engine implementation was that their engine (Dashboard) was based on HTML, CSS, and Javascript, which appeals to a wider spectrum of web developers out there. Widgets - the idea itself - is nothing new. They were thought up long ago as mini applications with very specific purposes. For example, one such widget might deal with...
3 tags
One Step Backward
It vexes me that some browsers today still assign the “back one page” function to the backspace/delete key. Even in the auto-draft-save era, accidental page backs are still an issue as partially-filled form fields are often out of focus. There are ways to disable it in some browsers, though it’s debatable whether such a crucial key should be dual-purpose. Backspace back-deletes...
January 2010
2 posts
9 tags
Managed vs Unmanaged Libraries
In the olden days, our music libraries were primarily unmanaged. It was essentially the only option. If you wanted to listen to a song, you had “Eagle Eye Cherry - Save Tonight.mp3” or “01 - save tonight - eagle eye cherry - [desireless].wav” or something along those lines. You interacted with the file within the file explorer, such as Windows Explorer, and kept track...
4 tags
Keyboard-based File Renaming
There are subtle differences in how a file navigator handles keyboard-based file manipulation that are easy to overlook. They appear minor or trivial at a glance, but can be detrimental to usability with the sum of all nuisances, or with batch file manipulation tasks by hand. There is a lot to focus on, so I will keep this one about file renaming.Renaming in the Early DaysBack in the days up until...
December 2009
2 posts
4 tags
Of Physical and Virtual Mobile Keyboards
Nearly three years ago, I watched as Steve Jobs presented a slide of images of existing smartphone physical keyboards, from the Blackberry to the Treo, and then reasoned afterwards that a touch keyboard held the advantage of being adaptable to any situation. This reduces clutter, saves space, and allows for a larger screen without the need to add physical bulk (even if it’s just millimeters)...
2 tags
In-Browser Search Engine Switching
When I first used Firefox under the Firebird name, one of my favorite features was the ability to quickly add and switch search plugins for other sites. In the case of Firefox, you could type one query, and any other search engine or site search was just a click away. Or for keyboard shortcut aficionados, ctrl+k/cmd+k > ctrl/cmd + up/down > enter. Safari didn’t offer this feature,...
August 2009
2 posts
2 tags
Password Masking
Caught in the ongoing tug between ease-of-use and security is password masking, a point of contention in the past with some of my colleagues working more closely with security related issues. Whether security and usability necessarily have to be inverses of each other is something to leave for another post, but what’s clear is that it’s certainly the case with our current form of...
3 tags
Blast from the Past: SDI and MDI
This is an entry I wrote on March 20, 2006 touching upon SDI and MDI: Warning: This is a usability and interface topic. You may quietly exit through the back doors. No hard feelings. Otherwise… I know that Adobe Acrobat 7 has been out for quite a while now, but I figure that I need to get the word out wherever I can. The following is a problem that’s been bothering me since Acrobat...
July 2009
7 posts
4 tags
Inline Autocompletion
Inline autocompletion is a common part of search bars, but for the longest time, autocompletion was anchored to the beginning of the URL in a web browser address bar. In the middle of last year, Firefox included an “awesome bar” in version 3, which allowed us to type: “lunar” to bring up a past history or bookmark of...
5 tags
Browser Sniffing on the Mobile Web
Browser sniffing holds a level of stigma in the web development/design world, as we have been spending years and years creating cross-platform, cross-browser sites that use more robust techniques of singling out browsers, rendering engines, or platforms as a last resort through our knowledge of what’s supported - CSS conditional comments, JS object detection, and various tricks and (if...
3 tags
Thoughtful Charts and Real-Time UI Feedback in...
I’ll have to admit that I’ve never been a frequent user of the advanced options of Yahoo! Finance, so the information that Google Finance provides is just right for finance users like me who just want the fundamentals, and Google Finance has provided excellent usability for that. One of my favorite features that came out of Google Finance was the extended hours trading on charts of...
5 tags
Window Maximize and Zoom
The other day, my friend Eugene and I were discussing zooming and maximizing with regards to window management, as he was looking around for workarounds to maximize windows in OS X. The zooming function in OS X, represented by the green orb button, is the counterpart to the maximizing function in Windows, represented by the maximized square. Yet unlike the parallel “close” and...
4 tags
Thoughtfulness Zen of the Moment 3
Probably one of the underrated parts of the third generation iPhone (3GS) is its digital compass, which may evoke questions about its utility until a user actually uses it on the road. The potential utility of this compass gave me some excitement when I saw the iPhone GPS navigation app demo by TomTom the day the iPhone 3GS was announced, because it completed the last requirement necessary to...
4 tags
30 Favorite Usability Aspects and Features of...
Five years ago, I finally received my invite to sign up for Google’s new email service, Gmail. It was 2004, and I was loyal to Yahoo! Mail at the time for having the relatively cleanest UI and largest storage space (a whopping 6 megabytes) for a free major webmail provider. There were plenty of gripes I had sent to the Yahoo! Mail feedback teams over the years - everything from the loss of...
5 tags
The Global Inbox versus the Distinct Inboxes
When it comes to organizing multiple accounts on an email client, there are two major approaches - one is to send them all to a shared inbox, generally called a global inbox. How emails get filtered or sorted at that point varies, whether by folders or by labels. The other approach is to keep separate inboxes and sent/outbox/junk/trash folders for each mail account set up in the application. Most...
June 2009
6 posts
5 tags
The Case for Too Many Mobile Apps
One point of contention with my usage of the iPhone is that I’m one of those people with so many apps, to the point of reaching the nine screens limit characteristic of the OS prior to the version 3.0 release last week. One of the common rhetorical questions laid about before me was whether I actually use all the applications on my smartphone. This is a fair question, and the answer remains...
4 tags
Blast from the Past: Oversights in the Motorola...
Before any organized effort like Bleuprints, I wrote these scattered design muses under the label “blurbs”. Here is one I wrote in 2007, towards the end of my experience with the Motorola Razr V3, and prior to owning the Razr V3xx (a future device that would finally fix some of the issues I mentioned). The iPhone solved many of the gripes I had with mobile phone UI’s in general,...
4 tags
From Tabs to Thumbnails, and Back
The screenshots tell it all. The Opera 10 beta browser has a vertically resizable tab bar that turns into page thumbnails as they are expanded. To me, this is the most graceful approach I’ve seen towards representing open pages as thumbnails because it doesn’t interrupt the view of the current page beyond what you control, in contrast to a full page grid of thumbs. I’m curious...
3 tags
Working Within the iPhone OS Icons Restrictions
One of the signature visuals of the iPhone OS is the simple half-gloss rounded rectangle shape every icon takes. When the phone came out a couple years ago, I had initial reservations about how this template might encourage developers to make every icon look too similar with regards to creativity. I tried to deduce a good reason why they might have chosen that route, and I concluded that perhaps...
4 tags
Am I the only one who noticed this? Safari 4's...
I previously mentioned how Safari 4 Beta had stepped up their spillover tabs menu oversight by moving you to the area of the tab bar where your active tab sits, so that you could see its neighboring tabs. Suddenly, tabs that didn’t fit on the visible part of the tab bar weren’t segregated into an inaccessible menu. This was what the Safari team gave us with Safari 4 Beta: (To jog your...
Thoughtfulness Zen of the Moment 2
There are plenty of things I like about Google Chrome, but one of the things I just noticed was that if you maximize the window, the draggable area above the tabs vanishes. That makes sense because you can’t drag around a maximized window. Also on the list of reasons of why I still like Chrome as a general use browser: download manager saves and runs files without extra popup windows or...
May 2009
9 posts
1 tag
Iconoclastic Friday
Just a little fun, but I noticed the incandescent lightbulb icon was replaced with a CFL bulb icon after updating to OS X 10.5.7 from 10.5.6.
4 tags
The Ballad of OS X and Windows 7 Docks
The dock is one of the major approaches for windows management and application launching, currently most well known with its usage in OS X. With its grouping of documents by application, it stood in contrast with the dominantly document-by-document system found in the taskbar approach in Windows. The taskbar evolved into a hybrid system over the years with the addition of the Quick Launch bar and...
3 tags
When Browser Tabs Spill
In the olden days, web browsers didn’t provide us any real solution for tabs spilling off the edge of a tab bar filled with open tabbed pages. In the past few years, we saw multiple angles from the main Webkit/Gecko/Presto/Trident browsers. In the near future, these different approaches will likely merge, although you may be surprised by the results over which browser seems the closest...
3 tags
The Desaturation of OS X
Above: Unification of Aqua and Brushed Metal In a nutshell, I still miss “Aqua”, which probably requires no introduction by now, being the common visual theme that stood as the foundation of the Mac OS X operating system until the past couple years. To many people unfamiliar with the platform, this is generally the majority of what they know when they think of this and any OS, as the...
3 tags
We're outgrowing our tabs.
I’ve been getting this sneaking suspicion lately that we’re outgrowing our tabs. And then today, a reference on Slashdot brings the question into the spotlight again. Tabs. They’ve been around for a while, though arguably they became even more prevalent with their rising popularity as the standard multitasking approach in web browsers a little over half a decade ago. For most...
1 tag
Unscripted Friday: Internet Sharing Toggle...
File: toggleinternetsharing.scpt Language: Applescript Download: http://gist.github.com/112789 Background: At work, I often share the Ethernet connection of my Macbook Pro over Airport, so that my iPhone can connect over Wi-Fi. However, at the end of the day, I switch Internet Sharing back off to free up the Airport, so that I can go online with my notebook wirelessly again on the go. I wanted a...
1 tag
Unscripted Friday: Hot Corner Toggle Off...
File: togglehotcornersoff.scpt Language: Applescript Download: http://gist.github.com/111949 -- Hot Screen Off Toggler: Toggle all four hot corners off. This is the counterpart to the script that toggles all four hot corners on, for cases when a visitor comes over who isn't used to active screen corners. -- 2009 May 14. Written for OS X 10.5.x. -- Gordon Mei, with guidance from Pierre L. from...
1 tag
Unscripted Friday: Hot Corner Toggle On...
File: togglehotcornerson.scpt Language: Applescript Download: http://gist.github.com/111945 Background: Hot corners, or active screen corners, are an option in OS X where you can toss your cursor to a corner to trigger an action, such as Expose, the launch of application, or the screensaver. However, this can take getting used to, and I’m reminded of this every time a visitor uses my...
Thoughtfulness Zen of the Moment
I just noticed that Calculator.app on OS X lay out its buttons exactly like the layout of the numeric pad portion of the Apple keyboard. (I’m usually on a notebook keyboard with no numeric pad.) Needless to say, this is meant to help us feel as though we’re operating an actual calculator. Although, I’m not entirely sure about the “=” equal sign representing the...
March 2009
1 post
2 tags
Mac OS X: 13 Things I Miss from Windows
Last year, I started compiling a list of things I miss from the Windows operating system UI that were lacking in the OS X UI. I’d been a loyal primary Windows user for 15 years, using every Windows installation as they released on my own computer from Windows 3.1 to Windows XP, with the exception of the NT line up until 4.0. A bulk of all my web work, art, writing, and academics were all...
November 2008
4 posts
Reviewing: Yahoo! Home Page Beta
Reviewing: Yahoo! Front Page Beta Slated for release: Early 2009 Review based on beta: As of November 2009 Visually, the top of the Yahoo! front page beta looks very odd, with the white clashing directly with the #637d90 color at the top-most part of the background gradient. This is a color contrast problem. Because of the background gradient, the #829cae 1-pixel border is noticeable on the...
Reviewing: Bleuprints
Reviewing: Bleuprints Review based on as is: November 2008 Author appears to have been meaning to do this for a while, possibly from his interest in user interfaces and usability. It explains why he felt so compelled to be active in reaching out to various companies and communities on how to improve the shortcomings of any given product with a UI short of being well thought out. Currently...
3 tags
Reviewing: Yahoo! Front Page Beta
Reviewing: Yahoo! Front Page Beta Slated for release: Early 2009 Review based on beta: As of November 2009 Visually, the top of the Yahoo! front page beta looks very odd, with the white clashing directly with the #637d90 color at the top-most part of the background gradient. This is a color contrast problem. Because of the background gradient, the #829cae 1-pixel border is noticeable on the lower...
1 tag
Review: Bleuprints
Reviewing: Bleuprints Review based on as is: November 2008 Author appears to have been meaning to do this for a while, possibly from his interest in user interfaces and usability. It explains why he felt so compelled to be active in reaching out to various companies and communities on how to improve the shortcomings of any given product with a UI short of being well thought out. Currently appears...