UX and UI – What do all these Marketing acronyms stand for?

First off, what are all of these acronyms like UI and UX that are thrown around in the marketing world? To make things more clear before I continue, here’s some quick terminology:

UX stands for user experience and deals with the overall experience and the whole navigation of the site.

UI stands for user interface and deals with the internal site and the look and feel and the navigation of a specific page on the site.

The article, UI, UX: Who Does What? A Designer’s Guide To The Tech Industry, described various design roles that are prevalent in big companies such as Google, Apple, and Microsoft and are directly correlates to the marketing that occurs between companies and their customers.

“Design is a rather broad and vague term. When someone says “I’m a designer,” it is not immediately clear what they actually do day to day. There are a number of different responsibilities encompassed by the umbrella term designer.” The article focused on 7 main roles in design that were:

UX designer: is known as the user experience designer and they focus more on how the overall product feels and are more big picture in their approach. They will be more concerned about the entire site and all of the different pages in the site and the flow between them.

UI designer: Focuses on the user interface design and would be concerned with how the product is laid out and are focused on more fine tuned details.

Visual designer: is known as the graphic designer and “pushes pixels” and they’re focused more on their individual assignment and they aren’t concerned about how someone interacts with their specific project or the site as a whole.

Here I though designing the Chrome app visual (below) was a simple insert of the image adjust the height, width, background color, and the borders, however after further research I came to the realization that those simple manipulations are just the tip of the iceberg in regards to visual design.

Interaction designer: is known as a motion designer and focused on the bouncing animation and other features that require motion.

UX researcher: who is known for understanding what the user needs and wants and communicating these needs to the right individuals so they’re implemented accordingly.

UI developer: is responsible for the front-end development through writing and implementing code.

For example,   making this like button would have taken approximately 200+ hours to code and design. It would have take a while to write the code so it’s compatible with various browsers, various versions of browsers, and cleanly translates into other languages as well.

If you want to learn more about this, watch Margaret Gould Stewart’s TED talk on How giant websites design for you (and a billion others, too).

Product designer: Finally, the product designer is someone who will be involved in various aspects of the design and ultimately can perform any of the tasks or roles that were listed above.

An important thing to note when looking into UI and UX is the UI/UX ambiguity – big companies have the resources and the needs to break all of these design tasks up into 7 different careers, however smaller companies and start-ups don’t have this luxury and will often clump many of these roles together since some of the requirements and capabilities of the employees overlap. However, these are still different features and are more successful when separated out into distinct roles.

Another key factor when implementing design is resistance. Many times employees will face resistance from partners (business people) and developer who has to write code and implement your design. Even if your research shows your design is what’s best for the business and customers you may still face resistance. This is why it’s essential to have some coding knowledge even if you’re not implementing the code so you can explain in technical terms what you want and negotiate with the developers since it is their time and energy at stake as well.

For example, I use the Pinterest app on my Iphone — religiously.

Normally, you would touch an image and the navigation would pop up for if you wanted to pin, like, or send the specific pin like what’s shown on the left. However the recently updated the app and changed the design to where the like button (also known) as the heart was no longer there. It changed my whole experience with the app since I like many of the pins and I slowly stopped opening the app on my phone as frequently. However, I was pleasantly surprised to open the mobile app a week later and the like button was back. After learning more about UI and UX I realized that they were trying out a new feature, even though they shouldn’t necessarily have been testing it on their loyal customers instead of new customers, but after seeing it’s negative effects on multiple users they decided to revert back to their original ways. Moral of the story, design and simple design features can drastically effect customer’s experiences.

UX and UI may seem like a minor part of marketing and communicating with customers however I was surprised to see how much the removal of a very small button drastically impacted my use of the application.

Another important aspect of UX and UI on sites is landing pages. Landing pages are essential because they intercept your customers from going directly to your home page. Many times conversion rates are drastically higher when you use a landing page where you ask for email addresses, request individuals to make an account, or suggest that they sign up for a free trial because customers are more likely to sign up if they’re presented with a pop-up instead of taken to the home page. Landing pages should be simple, clean, have minimal text, and get straight to the point. As a business, you want your landing page to be easily understood and easy to use as well.

For example, the landing page below from Anthropologie is very simplistic and creates a watermark on the home page which lets users know they’re on the right page and that they can exit out of the landing page and then be directed to the home page. Also the landing page is simple and only asks the customer to do one thing, enter their email address.

Capture.PNG landing

Another important feature of landing pages is they should be an extension of a website’s home page, however there should still be some distinct differences. For example, the Spotify landing page below is an extension of their homepage, there are similarities like the layout and placement of buttons, however there are still key differences that make their landing page unique. If you Google Spotify, and click on the first link, you’ll be directed to the landing page. Spotify has efficiently set up this model so more people will sign up for premium since they’re prompted to the landing page compared to leading customers to the home page where they most likely won’t sign up for premium. Here are the two different sites, the one of the top is the landing page for Spotify and the one on the bottom is the home page for Spotify.

Capture- spotifyCapture -spotify 2

Spotify made an excellent landing page because it’s an extension of their main homepage once you log in, however the landing page does have distinct differences. Also the landing page is simplistic and only asks the customers to do one thing “Go Premium”.

Until next time,



Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s