Sounds seem to be commonly overlooked in GUI design. It’s hard to diagram sounds on a whiteboard; onomatopœias don’t cut it. Web design just doesn’t use sound because it’s too much of a mess to support.

The best example I can relate to is that of my “text message” sound. I love getting text messages, so hearing that sound gives me an excited Pavlovian response. It’s a shame Apple used the same sound for a receiving a text message as installing software on the Mac. Whenever I installed anything, I would hear the sound, perk up, realize it was just my Mac, get sad, and then get angry. So much so that I mute my computer now when installing things. I’ve since switched phones, but it still hurts.

The first thing I noticed (and liked) about Windows Vista were the sounds. Even my washing machine sings a little song when it’s done drying my clothes. ∞

Twitter stream. Email me. RSS feed.

Twitter stream. Email me. RSS feed.

Everyone knows that YouTube comments are the worst around; I wonder if there is any way to change that.

Just a simple idea, but what if the comment box was moved to below the video instead of below the other comments? Would people forgo commenting on the comments and commenters? Would it encourage more non-commenters to comment (thus diluting the stupidity)?

I’m not a fan of comments (if you haven’t noticed), but I do think there is something valuable to people inputing data. Rating, sharing, favorite-ing, and even just viewing the video.

Comments are nice because they’re so open-ended, but that’s also what makes them so dangerous. People rating other comments is nice, but it just creates a bias. The system should rate comments based on content. Poor grammar? Misuse of capital letters? Over punctuation? Automatically thumbed down. It can even rate you as you type, just to encourage better comments. ∞

Twitter stream. Discuss with me. RSS feed.

When watching a movie or listening to a podcast on a mobile device, using the seek bar (aka scrubbing) can be one of the most difficult techniques to master. The button is too small, the bar isn’t accurate enough, and it doesn’t jump to where it should. The currently used UI was made for a mouse, not a thumb.

Too Small

The button and the scrub bar are too small. A person navigating with a mouse can click them fine, but not when using their thumb. You try and grab a hold of the button and you accidentally seek forward a few minutes, creating a new problem. Most, if not all, controls on a mobile device are quite large, why must this control be so different?

Let’s pretend the video player only needs a seek bar. Where should we put it? How about everywhere. You hold your finder down anywhere on the screen for a second or two, and ba-boop, up pops the video’s current time. Don’t move it and the video continues to play unhindered and the time increases accordingly. Move you finger right and the video jumps forward, left and it goes back.

Not Accurate

But pressing the button isn’t the only problem; finding where you want to go isn’t all that easy, either. If you want to find that one scene from Inglourious Basterds—more specifically the beginning of that scene—you’ll move the button around ⅔ along the bar. Then, to find it exactly, you’ll drive yourself crazy moving left and right until you give up and just watch the scene before it, too.

If you move two pixels to the left, you’re looking for an almost specific frame. If you move half-way across the screen, you’re not expecting to land on the perfect time. Touchscreen scrub bars should be exponential, almost like a magnifying glass. The further you move (in a single motion) the more the video will accelerate. Once you’re in the area, you can slow down and find that frame.

And since you can lay your finder down anywhere, you’ll want to start at the left to seek forward, and the right to go back, giving yourself more room to find what you want.

Or

Of course, I have more than one idea for the seek bar. What if there is no bar? What if holding your finder to the right of where you pressed down fast-forwards continuously? And moving further right speeds up the fast-forwarding.
Both seem similar, but accomplish different tasks for different kinds of videos. You seek to a certain place because you want to watch that scene or finishing up listening to that podcast. You fast-forward because you want to skip over commercials or an unpleasant scene from a TV show you haven’t seen before (and thus you don’t know where to seek to).

Other Controls

Tap on the screen to pause (and bring up any necessary video information). Swipe up or down to rise or lower the volume. Standard mouse-based controls are almost useless on a smartphone; it’s about time touchscreens act a little Minority Report-y. ∞

Twitter stream. Email me. RSS feed.

If you don’t have a mouse or touchscreen available, you can’t get much better than a six button control schema.

I know most UX/UI/IxD blog posts are about web design, but I prefer the all-encompassing design for mobile devices. Software is so much more fun if you get to do the hardware, too. I have a few things I want to write about, but every time I start one of the articles, I realize I also want to describe—or at least link to—what I call the six button control schema. So… now I can link here.

Every project I start is based on it. Every good device uses it. It’s versatile and variable; simple and straight-forward. It can be described simply as “up, down, left, right, yes, no.”

The most important part of the control schema is the structure of the menus. They have to be well laid out, organized, and repetitive. The buttons shouldn’t have too many functions each (it’s tempting to have “right” double as “yes”) nor should there be any redundant buttons. The placement of each button should not only clearly reflect what it does, but also how it relates to the others.

Plenty of products get this right. TiVo has a beautifully simple UI, the TV is straight forward, the PSP and PS3 (despite switching from horizontal to vertical menus) is one of the best on a game console.

Obviously, the ones who get it wrong are the cheaper, less sought after devices we may have to deal with on a daily basis.

Menus seem like they’re the easiest thing to design. Move the cursor up and down, select something, move on with your life. Yet, so many (it seems all) computer monitors and TV sets have horrendous settings menus. Sure, these menus don’t seem to add much nor will they be used on a daily basis, but a poor one can really devalue a product. They always use five buttons: up, down, left, right, and menu. The directions are fine, it’s the “menu” button that messes everything up. Sometimes it opens the menu, sometimes it selects, sometimes it goes back, and sometimes it closes the menu. It’s never consistent; you’re always having to read the manual or look around the screen to find it’s function.

One of the more irritating examples are (dumb) cell phones. They do the worst thing an interface can do: hold over schemas. When cell phones first made an appearance, they were slow and could only call people, so they needed buttons specific to that. You could only really call people and hang up on them, so why not add green and red buttons to do just that! And put two buttons underneath the screen to function as any button imaginable!

But now large, color screens are in every phone and they can do much more than just call. Looking at the Motorola RAZR, it has an 11 button control schema! How nifty. Up, down, left, right, select, clear, answer, end call, a shortcut, screen button #1, and screen button #2. What does “answer” do when you’re not getting a call? It selects things. And “end call” goes back, just like “clear”, even though “screen button #1” is labeled “back” 90% of the time anyway. The shortcut only seems to be there to create a balance, even though it throws that balance off by not being a navigation button.

The six button schema is great. It works on menus, lists, and grids. Just don’t try and over complicate it. ∞

Discuss with me.

The current US standard output of 120 volts is highly outdated; it’s meant for an analog age.

The most common power input needed for a digital device is somewhere between 16 and 5 volts—vastly higher than what our sockets supply—and it’s only getting lower. New socket standards would mean fewer batteries, fewer transformers, and interchangeable cords.

Why does my bathroom scale use batteries (it’s not going anywhere)? Because 2¢ worth of metal and a “batteries not included” sticker are cheaper than a $10 120V-to-5V power transformer. Everyone is looking to cut costs, so their decision makes sense. Put a 5V socket in every home and the reason to use batteries narrows. Design decisions are constricted to their environment.

Why can’t my MacBook power-cord charge my ThinkPad? Their power requirements can’t be too far off from each other. When flying from city to city, why do I need to lug around that heavy transformer? At home, if I forget to unplug it one night, it sits there sucking up power and costing me money. And when I lose it (though unlikely for me), I have to shill out for a new over-priced, proprietary one. The worst part is the fact that I have a drawer full them for old Sega and Nintendo consoles.

I’d like to see a reduced number of power transformers and batteries, not through recycling, but by never manufacturing them in the first place. The third world has become our dumping ground. “Recycling” efforts send our waste to the poorest of the poor. Towns in China are covered in electronics to be torn apart and the metals harvested. Kids and adults are handling lead and acids without the proper equipment, if any equipment at all. The less we create, the less they have to deal with.

The worst part? It’ll never happen. USB is the closest thing we have, but it’s not solely a power standard, so when it’s replaced by Light Peak, we’re back to square one. Even with USB, higher voltage devices (laptops, Blu-Ray players, game consoles) aren’t supported. ∞

Discuss with me.

“An escalator can never break: it can only become stairs.” —Mitch Hedberg

Imagine everyone is getting off the Metro; coming home from work. It’s the end of the line and all the train cars are emptying. Now, you need to get on and go somewhere. If the stagnant stairs are flooded with people coming the opposite direction, you’re no more than a salmon going upstream. Sure, you’ll get there, but you will miss a few trains in the process.

With an escalator, you have a lane of stairs all to yourself. ∞

Discuss with me.

I’ve been thinking about the apps that come preloaded on computers, phones, and media players. I don’t use them. Not because I don’t need to, but because they’re basic, uninspired, and just added to check off a feature list box. The calendar might as well be 12 PNG files. Brick-breaker is a good way to drain my battery. And weather? I don’t care about the weather. Maybe I’d bring it up when snow was forecast, but I knew snow was coming based on the chatter of my friends, I was just double checking.

When I was a kid, I didn’t always understand temperatures. “It’s going to be 60 degrees tomorrow!” “Sooooo, it’ll be… hot?” I wasn’t daft, I just never took an interest to the day’s weather. Do I wear a jacket or not, that’s all I wanted to know. Even worse was when somebody said “it’s the humidity that’ll get ya.” Yeah, thanks.

Why should it matter if it’s 62°F or 65°F? Those numbers are meaningless to me, they might as well be 2 and 5. Or gabblegoof and wickedywock. The temperature should scale around me (ignoring scientific purposes, of course). Zero should be my favorite, most perfect temperature. As it inches above zero, it’s getting hotter. Anything negative is cold.

The problem with this is that everyone is different. Some like their rooms 68°F, some like 73°F, and some like it hot.

The weather used to only be communicated through a thermometer or the nightly news. They have to cater to everyone, if the scale is off for you, there’s nothing you can do about it. Fahrenheit is based around water mixed with ice and salt; Celsius is based on the freezing and boiling points of water. Great for when I want to drive carefully in the Winter, but useless for the rest of the seasons. The average human body temperature in both isn’t even a round number.

But now we have computers and computers are customizable. The internet gives us the data for our applications to toy with. Think 73°F is too hot? Think it’s just right? Well, we can accommodate you no problem. Not sure what’s hot and what’s not? Tell your computer. “Yesterday was perfect.” “I should have worn long sleeves.” Let it dial down your tastes until it can judge you against the weather without a doubt.

Weather isn’t even all about the temperature. There’s wind-factor, humidity, rain, ice, “feels like this temp.” Too much to keep track of or even care about. I don’t care what the weather is doing—I’m not tracking it—I just need to know what to wear.

And that’s all weather apps need to tell me. I should load up WhatOutfitDoIWear.com, see a picture of a jacket, and throw it on as I walk out the door. My alarm clock should connect to their API and give me an idea of which part of my closet I need to pick my outfit from as I wake up. I don’t need to see numbers [data], I need to see clothes [information]. Do I watch out for ice, or can I be the care-free, reckless driver I always am? Do I bring an umbrella? How many or few layer do I need? These are the things I want to know. ∞

Discuss with me.

PS. Of course, this isn’t strictly about the weather.

The most basic way to measure a video is to display the total length in hours, minutes, and seconds. It’s good… until you start watching and pausing.

One up from that is the ever-changing number of hours etc. you are into the video. It’s nice to know how long you’ve been watching, though it’s better used for mentally bookmarking in case you have to close the video.

But if you’re up against tight schedule, the number of hours etc. left in the video is your best friend. You have to leave at 6:00pm, it’s 5:30pm, and there’s 30 minutes left in the movie: Perfect.

But why leave the user to do the math? Good design shouldn’t force anyone to think. Throw in another label—or make it alternate choice—displaying what time the video will end. It’s simple math any computer can do, and would provide much more meaningful feedback to users. I always catch myself looking up at the clock after I’ve checked to see how long is left in the video. ∞

Discuss with me.

The best example of a failure to transfer the analog analogy? The calendar. Calendar software is pretty uninspired when it comes to design; they’re things you’re more likely to see on a Best Buy spec-list than anything drool worthy. The problem is that it is laid out exactly like your typical wall calendar. And not just one specific company has this problem, every piece of software looks like the next. At least the calendar hanging in your cubical is limited in its design, usually one, unchanging page per month.

“Don’t touch that dial… and if your TV has dials: get a new TV.” —Stephen T. Colbert

These calendars are fine for today, but when you want to keep up to date of what’s coming up in your schedule, you lose a little each day. The number of days you can see ahead shrinks everyday, and the next month is always limited to showing a maximum of six days; possibly zero.

Forget that months start and end, forget that weeks end and the weekend starts. You only need to know where you are now and how long it is until your next scheduled event is. Just because the month has ended, doesn’t mean tomorrow isn’t still less than 24 hours away.

Quickly scanning the old calendar and you see what’s when, but not what’s now. That important event is always on the bottom right, never moving, never seeming to get closer. “You” always move, and it can be hard to find where you are. Events should approach you, not you to them.

My idea is to keep today in one, constant place, and let the world of your schedule move around you. If something is in the top-right corner of my calendar, that means it’s six days away, no matter what day it is today. And when it’s the last day of the month, you aren’t staring at a page full of past events, but a screen full of what you’re going to do in the coming month.

Also, most calendars have three separate views: Today, this week, and this month. Why not combine them into one view? Cut it into thirds to display the current 24 hours, the next week (not including today), and the next month (not including this week). Events a month away don’t matter on an hourly basis and meetings today need to be much more specific than just “today.” Exponentially display the calendar, because that’s how we all see it anyway (unless, of course, we’re scheduling a new event, but that’s more in-depth than a quick scan).

These are the things I think about when I look at my calendar. ∞

Discuss with me.