Everyday UI & UX: You Can Run, But You Can’t Hide
UI and UX are not just for the the online world — take a look around and you might notice they are everywhere! I’m going to go over a few examples of everyday items and how their UI has affected their UX, and I’ll explain how we can apply what we have learned to the web and other projects you may be working on.
The Measuring Cup
Let’s take a look at the handy-dandy measuring cup we all have in our kitchen and see how the design makes this super easy to use. The designers made the cup clear so you can easily see how much of the item you actually have in the cup. The measurement markings are a nice bright red which easily stands out against most things you would be measuring. The big handle makes the cup easy to hold, and the spout makes it easy to poor. Awesome! The only problem I have with this cup is this: WHAT ABOUT US LEFTIES?
The designers assumed everyone would be right handed — or at least decided not to worry about the lefties (10% of the population is left handed). Being a lefty, when I hold the measuring cup in my left hand, the red measurement markings are on the wrong side of the cup! So I either have to bend my arm awkwardly to turn it around while holding the handle or use the cup from the other side that doesn’t have the handle. It’s not a huge deal, but this is a part of the cup’s interface that interferes with the lefties experience.
Overview: Research & plan for all user groups that may interact with your site (not just the biggest group) to make sure your site is accessible to everyone. For example, don’t rely on color as a navigational tool or as the sole way to differentiate items – color blind or visually impaired users will have trouble with this.
Gas Pump Indicator
Have you ever borrowed a friends car or picked up a rental, and realized when you got to the gas station you weren’t sure which side the gas tank was on? OH GOD WHICH SIDE OF THE PUMP DO I PARK ON? You have to park, get out of the car, and check where your tank is. Or uncomfortably stick your head out of the window to try and catch a glimpse without being strangled by your seatbelt.
Turns out (most) car manufacturers have solved this problem for us! If you look at your fuel gauge you will see a little triangle that points to the side of the car that your tank is on. What a fantastic way adding a little UI helps the overall UX of filling up your car with gas.
Overview: Sometimes the smallest update to the UI can have a huge positive effect on the UX. For example, simply adding a text label along with your icons (eg the word “Menu” next to your hamburger menu icon) can help to clarify its meaning to all users instead of making them guess.
Uchi’s Table with Menu Cubby
Recently my hubby and I went out to eat at Uchi, a local sushi restaurant. After we decided on what we wanted to order I leaned the menu up against the wall and the table. The evening was going great and there was nothing I would change about our experience. A few minutes later our waiter came by and showed us that the table actually had a small cubby underneath for holding the menus. WHAT! The menus were not bothering us being on the table, except taking up a little space, but this was such a cool aspect of the table! It was like finding out your favorite dress had pockets! Now the menu could be out of the way, yet still accessible, for when we needed to order more. It added to the restaurant’s upscale and luxurious experience because it made the table less cluttered and showed that the restaurant was willing to go the extra mile to make our experience as great as possible.
I reached out to the restaurant to ask where they got these tables from for this blog. Apparently, one of their employees custom builds the shelves to attach to the tables. Even more amazing! A handcrafted, one-of-a-kind solution to allow the user to get even more space out of the table tops. Way to go Uchi!
Overview: Finding a solution to a problem your users didn’t know they had really goes a long way for the overall experience. Trying to anticipate their needs whenever possible will reinforce their trust in your site and your product. For example, on e-commerce sites, show products that would go well with the item they are thinking about buying instead of making them perform another search for this. If they are buying a mattress, why not show them the box spring, sheets, and pillows that would work well with that mattress.
Hopefully with these examples, you will start to see all the UI/UX that is involved in the day-to-day items you interact with. By critically looking at how designers help or hinder their user experiences in the real world, you can apply that knowledge to any user-centered project you are working on.