Let’s Talk UX: UX Ain’t Just UI!

UXNOTUI

Hello everyone!  Today I’ll be talking a bit about User Experience and the lowdown on how it is not just UI.  

Just before I begin, here’s the website heading the point I’m getting at in this post.  The site has multiple file types and sizes of a side-by-side comparison of UX vs UI.  I recommend checking it out!

Alright, so let’s take a scenario:

You’re a UI/UX Designer speaking with a client about an app.  The client is asking for you to work with the team of programmers who are currently working said app.  The client asks you “tack on the design.”  You inquire about the research or prior planning that’s been done and the client responds with “we had an idea, thought it was good, and went with it.  Just do your design or UX stuff.”

OK.  That’s an issue. 

“User experience encompasses all aspects of the end-user’s interaction with the company, its services, and its products.”
— Jakob Nielsen and Don Norman

Simply put, UX, or User Experience, involves a process.  

UX is not something you can just tack on like a “band-aid” and call it quits.  It involves a multitude of fundamental ideas that must be interwoven into the very essence of the project from the beginning, these ideas being  gathering research, creating personas, information architecture, usability, prototyping, and a wide variety of others.

User Experience has to do with a user’s full experience, not just “how the interface looks.”  It involves every button click users must interact with to reach their target goal, the euphoric (or distressed) feeling they experience while completing an online purchase.  It involves the users’ drawn attention to a specific portfolio piece that fits in with what they are interested in.

UX  involves every aspect of the user’s interaction with an interface, and even outside the interface.  It involves the customer service users experience from the interface owner, the thoughts of returning to said interface tickling at the mind when a need for a product located within that interface arises.  UX is much more than just UI.

Now, don’t get me wrong.  UI, or User Interface, is still a very important component.

Kaplan Test Prep

KaplanKaplan expertly uses UI elements in their website to enforce usability and promote a unique experience for the user by attracting them to key elements on the page.  The contrasting green against the white/purple palette points out the starting point of the site clearly, and emphasizes what is important (in this case, you and where you start!).  Gestalt principle of Continuity is in play using the white lines and arrows that draw the eye to the multiple career choices.

Zurb’s Pattern Tap

patternTapZurb

Zurb’s Pattern Tap uses UI elements in a way that draws you to what you want from this site: the massive library of excellent design examples.  Each example owns its own nicely-sized thumbnail that is small enough to be friendly on load time, but large enough to display the featured design example.

The User Interface is an invaluable piece of UX that must never be forgotten.  It is never just one or the other.  UI is like an entire section of a full UX orchestra;  it can’t be complete without it.

So there you have it.  Remember that UX is not something to be used interchangeably with UI, because it can’t.  It just can’t. 

UX is not UI!

——-User First, Designer Second——-

Good UI Design: iPhone 5s Finger Recognition

wireless_heroAlright, how’s it goin folks?  Today I wanna talk to you about the iPhone 5s’s fingerprint recognition!  This’ll be a short one, but I think you’ll like it!

Now now, before you go ham about how this is privacy violation I want you to hear me out!  Take for example you are at Buffalo wild wings with some blazin’ wings in one hand and a drink in the other.  Your $500 smartphone flashes with a text message, and you look down to see your mom’s number flash on the screen.

Now, normally people know the normal ending to this:  clean your hands and text back.  Now what does that require:  You have to either get up and go wash your hands, use 6 sanitary wipes to attempt to clean your hands, or use a paper towel and text back.

You’re lazy, so you choose option 3…and now you are attempting to unlock your phone with one hand.

Or, let’s say you are crossing a street attempting to unlock your phone.  See what I’m getting at?

Now this is where the finder recognition comes in.  One finger and the phone’s unlocked!  No hassle in unlocking the phone at awkward or dangerous times!

This feature is using the heuristic flexibility and efficiency of use and Minimalist design.  This feature is an effective shortcut that significantly cuts down the time for an individual to unlock his or her phone.  On top of this it’s extremely simple!

Let’s Talk Design: Groupon Phone App

groupon

Alright, let’s have some fun!  I’m currently working on a project that required me to check out Groupon’s phone app.  Well, I have a bit of stuff about I’d like to talk about today.

First, I’d like to say the idea of Groupon is quite an ingenious one.  Being a social shopping intermediary, Groupon pulls in many consumers looking for discounts by using teamwork.

Now for the design.

I open up the app and I am immediately asked to enter my country.  Alright, no biggie.  Next (on a separate page), I was asked to enter my state.  Alright, a little redundant but ok.  Finally I’m brought to the home page, and my first thought was “why is there three top bars?”  Anyway, I start scrolling through the main page and started to realize A.) None of these I really care about and B.) All of these are out of town.  Well, I see the Nearby nav tool and slide over to that list.  I see the little mile numbers like .2 miles away and start thinking “ah, it has my location.”

No, not really.

What the app has done is designated the general location as “Indianapolis, Indiana” and thought me as being in that vicinity.  Alright, a little annoyed I click on “Current Location” and…there’s an empty box and “current location…..”. Um, ok what goes in that box; address, zip? I don’t know, so I click on “Current Location…” and THE PAGE JUST REFRESHES.

It is at this point that my annoyance reached critical mass.

Good of the App

Great color and aesthetics scheme.  It’s very visually pleasing and smells of money (“with a hint of greed”).

Sliding menu’s a plus.  Very intuitive and piques my attention.

Bad of the App

Bad use of Location Based Advertisement. If you’re going to post something that’s in another city then you should not say that the deal is 2 miles away when it is in fact 120. It needs to hone in more; focus on what is around me.  I’m not driving to Fort Wayne for 30% off of new tires.  That’s a waste of my money.

Too many Menu Items  Ok, I usually don’t say that because I’m a fan of wide navigation, but this is just ridiculous.  This is a phone.  Three menu items? Perfect.  Four menu items? Alright.  Six, and they overlap when scrolling?  Alright now, that’s just clutter.  Two of these menu items (Just for you, customizable) seem awfully similar to each other. Why are they both there?

Overall, I think this app could be a great one if and only if it stops trying to fit everything under the sun.  I only want what I want

Google Glass: The Good & the Bad

gg3
Alright, so my Professor recently lent me her pair of Google Glass and I spent time playing with it. Today I’ll talk with ya about my experience with Google’s latest creation.

I clicked the button and slipped the pair on, happily greeted by today’s time. I echo the words “OK Glass” and was taken to a list of commands. I spoke the word “Google…” and then was abruptly stopped with a “no internet connection” notification. A bit annoyed, I clicked on settings and went to the connection settings. I downloaded the Glass app on my phone and tried to sync using the QR code.

After about ten minutes trying to sync up, I finally was connected to the internet. I began searching so many things to see what I can view: music vids, recipes, dogs, cars, glass updates, etc. I noted too when I was on websites like Schurz Communications or Wikipedia that actually selecting links was pretty hard to do. Using two fingers to navigate through a tiny web page doesn’t exactly yield well in concerns to hand eye coordination. When I move my fingers one way, the page seemed to shift opposite what I wanted, causing quite the confusion.

Connectivity seemed to cause a bit of a concern. I found that a connection that multiple people were using would considerably reduce Glass’s searching ability, and sometimes causing it to not work at all.

Taking pictures and recording videos is extremely fun and intuitive to do! Simply tapping the side and speaking a few words allow each option to do so. The commands to do each action aren’t complicated at all, either. Speaking the words “OK Glass, Take a Picture” will have a snapshot of your view in a heartbeat!

Another item to note is the health concerns. Seeing as how one must focus on either the screen or the world, ailments like minor headaches or slight blurred vision tend to ensue after prolonged use. I found myself setting the pair down after half an hour of play.

And of course, there’s the slight issue of awareness. Focusing on the screen itself drags your attention away from your surroundings (like a cellphone) and may cause dangerous consequences.

Overall, Google Glass was a bit less than I expected, but still a fun toy. The largest areas that I see need improvement are navigability, the settings, health, and awareness. Of course I see tools that can be implemented later on to drive this tool to be more usable than a simple toy. I’d like to note too that these are simply suggestions to based on my use with multiple devices and Google Glass. Creating a function that allows one to record notes, or adding tasks or events to the Google Calendar. Using commands like “Wake up” to turn the glasses on or “Sleep Now” to turn them off without taking them off. Adding a functionality that allows users to pay through Google Wallet via a secure connection. Adding in possibly a retina scanner akin to fingerprint scan for security. In the future, I would definitely love to see this transition from a playful toy to an augmentation of our lifestyles.

Ah, and I feel like a Saiyan when I look through these!

——–User First, Designer Second

Bad, Bad Design: The Refrigerator Top-Freezer Handle

Image

So, a bit of a back story.

I was recently cooking food with my girlfriend, and she goes into the fridge to pull out something.  Next thing I knew, BAM and “AAHHH” were the sounds ringing in my ears.  She had stood up and smashed her head on the freezer handle of the refrigerator.  After a string of unmentionable words from her, I told her I’d blog about this.

How many of us have felt this same, unbearable pain?  Why, does this keep happening?  WHAT IS THE PROBLEM?  Well, the issue here is two things (besides the worst head pain ever):  memory and placement.  The handle is placed at a point where our short-term memory will completely forget about it.

When we kneel down to reach for something, we have the inclination to look around us to see if we are in a “safe zone”.  Once we have identified the area as “safe” we proceed into doing what we initially set out to do.

At this point, our minds are focused on what our goal is now and have pushed out that short term memory that initial “safe zone”.  The resulting factor is a head-splitting headache and a string of bad words.

This design does not understand how users think.  We as designers need to fully understand the process of which users take use of our products.  This includes their thought process.  The design of this refrigerator does not take into account how users’ minds function, and it sometimes results in a very frustrated user.

Again, we can avoid this by understanding our users’ needs and goals.