Driving Conversions: Graphic Designer or UX Designer?

July 23, 2018 - Posted by: CreateApe

There’s a common misconception that a UX designer is just a glorified graphic designer who knows how to design for mobile. I mean, we get it. They both do graphic design work, and it’s a totally valid mistake. But the two couldn’t be anymore different.

Every designer has a niche and a medium, things that they’re very good at and specialize in. Depending on what you’re trying to accomplish, you want to get the best fit service you can to make it happen. That’s where the differences come matter most.

Simply put, a UX/UI designer creates the interface and architecture of a website. UX/UI design  includes copy, content, branding, and translating stakeholder wants with stakeholder needs in a web medium. UX/UI designers make sure that all digital designs created will look good  for mobile and desktop. They pay special attention to where buttons should be placed, where titles must go, and everything in between to help best produce awesome metric-conversions. A good UX designer is going to take the content provided and come up with intelligent suggestions for design in order to create a conversion centric website.

A graphic designer may cover a multitude of things. Are they a print graphic designer, or illustrator designer, or do they make motion graphics? They are most likely  specialized in one area specifically.. If you want an illustration that’s incredibly unique to your brand and not something that’s just tweaked on shutterstock, that’s when you would utilize an illustrator. Regular graphic designers, of the average variety, will often focus on beauty before function.

You might be asking, well can’t a graphic designer just come up with a website? Sometimes we’ll see business owners and stakeholders go to a graphic designer to design their website, and the lucky few will have zero problems there. But a graphic designer that doesn’t specialize in web, and it’s not what they do day in and day out, will no doubt miss critical steps that are incredibly important to the success of your website.  

If you want someone coming to your site, purchasing your product and sharing their experience on Facebook  you’ll need a UX/UI designer (who’s a proper villain). You’ll be in good hands, and what your hoping to create will come to life in the best way possible.

Want to learn more?

Let us help get you #JungleReady. Let our CreateApe expert team be your jungle guide.We will help   you traverse the wilds as we take your project to new heights.

Finding a Proper Villain: Developer Edition

July 18, 2018 - Posted by: CreateApe

We’ve covered what it takes to be a Proper Villain in the UX/UI space, now we’re going over what it takes to be a proper villain on the developer front. We asked our CreateApe head developer, Tim Abarta, what might make someone a Proper Villain:

COMMUNICATION:

Communication between the designer and developer is key. “I think that for developers and designers, communication is paramount. I’ve worked with a lot of people who can drone on and on, that eats up hours and time, but if someone can get right to the point and get straight into it…that’s huge.”

INDUSTRY KNOWLEDGE:

A big part of front end web development is working with responsive frameworks and knowing how the front end works. A plus is knowing key terms, like what the “box mode” is. “As a web developer a large part of the front end is working with certain responsive frameworks and knowing generally what the box model is. Good designers know what that is and they work within it. Bad designers don’t, and honestly it’s a huge headache.”

What is The CSS Box Model?  “All HTML elements can be considered as boxes. In CSS, the term “box model” is used when talking about design and layout. The CSS box model is essentially a box that wraps around every HTML element. It consists of: margins, borders, padding, and the actual content.”

TRENDS:

A “Proper Villain” knows the latest applications that most developers and designers are using. A common tool that UX Designers use is Sketch, which integrates with Zeplin. Zeplin takes your Sketch and starts to breakdown the CSS. Plus, extracting assets is easier with Sketch than Photoshop. “When you don’t have to guess with CSS, you know you have a good starting point.”

NAIL THE 5 MINUTE MEETING:

There is an art to the perfect meeting. You need to think about time, participants, agendas, location, etc. A proper villain thinks about the bottom line, and doesn’t waste your time droning on just to hear their own voice. “I’ve been in an hour long meeting and we didn’t get anything done, and that’s just a huge waste of time. That’s a complaint I hear a lot when working with bad designers.  A good designer in ten minutes can get through what would take a mediocre designer three hour long sessions to do.”

Overall, having an agile approach to your work, refining skills, and keeping tabs on the industry will impress any other proper villain out there. Being an expert in your field means feeling comfortable enough to be warm, concise, and solution-oriented (no matter the problem).

Want to learn more?

Let us help get you situated. It’s a jungle out there, click here so you don’t have to go at it alone! Let our CreateApe experts act as “jungle guides” and help you traverse the wilds as we take your project to new heights.

Travel Websites Can Teach You Great UX

July 17, 2018 - Posted by: CreateApe

I always say that UX inspiration comes from the world around us, and we can learn a lot from websites we’re constantly browsing. When planning for my summer vacation brought run-ins with countless hotel timetables and booking forms on travel websites, I paid attention to what worked and what didn’t. What was easy to use and what was simply annoying? I took notes on what made me exit the browser and what made me stay booking with certain companies.

Here’s what I learned.

Quick lesson on UX/UI Usability:

The travel websites I used the most had nailed the value of usability in User Experience. Although usability is a quality of User Interface (how easy something is to use), it’s also one of the many aspects of User Experience that involves “everything that affects the experience of the user.” According to the UX research firm Nielsen-Norman Group usability consists of five main goals: learnability, efficiency, memorability, errors, and user satisfaction.

Learnability:

How easy is it for users to follow a desired action? Can they accomplish basic tasks the first time they see the design?

Efficiency:

How quickly can tasks be performed?

Memorability:

If leaving and returning later, how quickly can they remember how the site works?

Errors:

If the user makes a mistake in the desired user flow, how quickly can they recover?

Satisfaction:

How pleasant is it to use?

These factors were what I used to determine whether a site was ultimately, easy and pleasant to use or just didn’t make the cut. As I browsed the void of travel websites (trust me there’s a lot out there) the best had the following features:

1) PLACE TO START

Planning vacations can be overwhelming, that’s why websites that gave me a place to start were automatically winning in the UX department. If a website is easy to use, it should be easy to navigate. Websites with a clear indication of where to start on the homepage took the stress out of planning a vacation. Since the homepage is usually the place with the most interaction, placing engaging and foolproof content will keep visitors intrigued and wanting to use your site.

CreateApe-Airbnb

 

Airbnb knows that it’s users are going to their website to find a place to stay in any desired location. In response, they placed a straightforward search engine on the top of their homepage, effectively keeping their site simple and easy to use. If you know where you want to go, it’s easy to search for places to stay, and if you’re a spur of the moment person, suggestions are right below the navigation. If you haven’t picked a destination yet, Airbnb prompts suggestions of homes you might like.

2) HIGH IMPACT IMAGERY

You’re lying to yourself if baby blue water and resort photos don’t draw you in. Especially on travel websites, high impact imagery sells the experience. Instead of stock photos, select imagery that is reflective of the brand and services that motivate users rather than bores them. If the call to action isn’t strengthened by an image, it’s not the right photo. Imagery is supposed to evoke emotion from the users, and websites that showcased beautiful scenery made me want to book with those companies.

CreateApe-LoneyPlanet

 

Lonely Planet utilizes high impact imagery throughout their entire homepage which inspires users to choose a destination. It also offers suggestions on what to do in those locations.

3) SIMPLICITY

Travel websites often evoke an overwhelming feeling. So many options, so many deals, right? I immediately clicked out of any browser that was crowded and confusing, or cluttered with a thousand images and CTA’s. For user experience, “less is more” is a phrase to live by. Focusing on relevant information and keeping things simple is easier for viewers to follow a desired user path.

CreateApe-homeaway

 

HomeAway doesn’t overwhelm the user with a thousand different pictures and navigation options. Their CTA is made more impactful with it’s simplicity.

4) CLEAR NAVIGATION

With so many travel websites out there, it’s hard to differentiate and understand all the services one company offers just by looking at the homepage. That’s why having a clear navigation is essential. Navigations aren’t always self explanatory. Having clear categories that are recognizable can increase function on your site.

createape-tripadvisor

 

At first glance, TripAdvisors homepage looks like its only service is to help users find hotels, but it’s navigation clearly indicates where users can click to find out about other services. We naturally want to categorize and having sections to easily search on a navigation makes using travel websites all the more pleasant.

5) EASY TO USE ON MOBILE/APPS

If a travel website didn’t have an as equally easy to use mobile pairing, I didn’t use it as much. Given the nature of the demographics who use travel sites, often times it will be used in a mobile setting It’s important when visiting a site that they tackled their standing on both mobile and desktop. It’s even more important now than ever with Google changing its indexing and ranking to have prioritizes those sites with an exhaustive mobile platform. Since travel prices fluctuate so frequently it was nice to be able to open my phone and check what was available for what price while I was on the go.

Overall, the easiest sites for me to use were simple, innovative and clear. Although I was merely booking vacations, jumping from website to website revealed the necessity for UX. Instead of being frustrated browsing through a site that’s overwhelming, the travel industry is learning what increases conversions and customer experience overtime.

UX Writing 101

June 12, 2018 - Posted by: Brooke LaFleur

Prior to entering the tech space, I had never heard of a UX writer. Even in the UX/UI space people who copy for websites we’re called copywriters. Now, we’re seeing a shift of focus on writing that intends to create a positive experience for the users once they enter a website or an app.

What is a UX Writer?

The main difference between a copywriter and a UX writer is that copy writing makes things sound good, and UX writing makes things make sense. It’s the difference between reading a complex novel and a 3rd grade kids book. One uses bigger words to attract customers, and one uses simple words to explain concepts.

A typical copywriter is sales-oriented and works with the marketing team to tell stories, but often can create copy alone and report back later. UX writers however, are product-oriented and work closely with designers to share conversations.

UX writers often don’t work alone and have to “fill in the blanks”  with the designers. For example, if there are gaps in the user flow, the UX writer needs to be able to mend any points of confusion for the user.

Gone are the days of picking the best writer on the team to write copy for interfaces and confusing pop up messages. UX writing has its own language: clear, concise, and useful.

These age old pop ups are one of the reasons UX writing now exists:

 

What does the UX writing process look like?

Well, it’s pretty similar to the path of a designer. From the beginning they will work with designers and developers in the early stages of production to figure out the flow and map out what copy is needed. A big part of creating good copy is researching and testing. Research of the target market and knowing jargon that is used by a particular vertical helps speak to the users language. UX writing intends to increase conversion and usability, putting hypotheses forward and a/b testing what words have more of a response.

Microcopy like CTA’s, instructions, navigation buttons, confirmation messages, error messages, and even 404 errors need to be written. Contrary to popular belief, these words don’t just come out of the void, someone writes these 404 messages:

pixar-ux-writing-example mcdonalds-ux-writing

Although a 404 page is possibly the worst possible scenario for a user on a website, using graphics and words that convey humor and sympathy make it a positive experience landing on a page a user typically doesn’t want to see. That’s the beauty of UX writing.

UX focuses on emotion and ensures that the path is clear for the user, and doesn’t make the user have to ask any questions. Users shouldn’t have to focus on reading buttons, good copy ensures that users actions are intuitive.

What is good microcopy?
HUMAN ORIENTED:

Using witty language and writing in the voice of the brand. When putting in the wrong blog URL, tumblr’s copy team uses humor and compliments to ease the disappointing experience.

ENCOURAGE USERS:

Good copy prompts their users. Introducing yourself and finding a starting point is difficult in real life. Tinder helps users start a conversation by prompting them to simply give a compliment!

UX Writing is a combination of UX Design and Copywriting, working in tandem together in the development process. UX writing’s primary goal is to make sure that every step of the user flow makes sense and fulfills the users needs. The takeaway? It’s obvious there needs to be changes when writing copy for websites, especially if you want an optimized conversion centric site. Be an empathetic guide and facilitate the users needs with smart copy that conveys real actionable steps.

Want to learn more?

Let us help get you situated. It’s a jungle out there, click here so you don’t have to go at it alone! Let our CreateApe experts act as “jungle guides” and help you traverse the wilds as we take your project to new heights.

How to Find a Proper Villain

July 13, 2018 - Posted by: Alessandro Fard

If you’ve been following our YouTube channel, we’ve been talking a lot about how to find a proper villain. If you’ve ever watched Oceans 11, I’m referring to the scene when Brad Pitt, playing Rusty Ryan, is walking with Don Cheadle’s character, Basher Tarr, and Tarr declares, “It will be nice working with proper villains again.” In the tech space, you know when you’re working with a proper villain. So what sets apart a standard UX/UI designer from a “proper villain”?

Know the basics of other specialties

A proper villain might be a designer, a developer, or even a copywriter, but they are a proper villain because they know more than just their specialty. If you can speak with authority and understand other disciplines in the tech space, you’re a proper villain.

If a UX/UI designer can speak to front end development, like what bootstrap is and why it can be important, you’ve found yourself a villain.

How do I find a proper villain in the UX/UI space?

The Portfolio

The first thing you’re looking for is a portfolio. If a designer has their own domain showcasing their designs, I can often get a feel of their personality and design work. I want to see they have an understanding of UX architecture, conversion, and mobile design.

Work should be curated and easy to browse. Showcase 3-4 detailed case study project that lead the viewer through a story about the start, difficulties, and outcome of a project. Simply, how did you get from point A to point B.

Keep it simple. The last thing you want is for a potential client or hiring manager to be looking at your portfolio and get overwhelmed by music and too many graphics. If you’re in the UX/UI space you want your portfolio to emulate an optimized, conversion-centric site.

Everything they present should work well, have smooth transitions, and look great. It doesn’t matter if you worked at Google in the past, if your portfolio isn’t up to par, you’re not a proper villain.

A LinkedIn

A proper villain’s LinkedIn should be hefty. There should be skills, recommendations, a decent work history. Be wary of red flags. If you see that someone has 10 different positions in the course of 2 years, ask more questions.

 

When you’re working on many different products from a freelance standpoint, really big, complex, and robust web applications, eCommerce sites, and mobile applications will take a lot of time. If someone’s been working in that area for over 1-2 years if shows they’ve been able to hone their skills from that project and rub shoulders with key players.

Know industry tools/trends

If I ask a designer what they often use to create their designs in and they follow up with whether that is high fidelity design or low fidelity design, I know I’m in the right place.

Knowing the trends that are happening within the space gives you an advantage. Applications like Sketch, which allows you to wireframe and do prototyping, works well with developers. This shows me you keep up with the latest advancements in a tech driven field.

Are they a good fit?

Proper villains need to work well with each other. At the end of the day whether it be a bank robbery, a heist,… or designing a mobile application, it needs to be a good fit! After about 5 minutes into assessing whether they’ve checked all the boxes to be a proper villain, I’ll ask about culture fit. Do they have a sense of humor? Do they play video games? Seriously though. VIDEO. GAMES. It’s a almost a “must” at my company.

So you’ve found your villain…

Truth be told. You’re never going to know how someone really works until you start to work with them. You don’t want to be in the middle of a crime and have your partner screw it up by accidentally stepping on lazer beams. That’s why sample projects are vital.

Sample projects

Sample projects let you know the things you never were going to find out in the interview. Give them a quick project like ideas around the homepage, designing a quick banner or social image. You’re going to see if they are responsive, communicate effectively, and what questions they’re asking. If they’re responsive and asking the right questions, you’ve found your proper villain.

Want to learn more?

Let us help get you situated for the Mobile First changes coming your way. It’s a jungle out there, click here so you don’t have to go at it alone! Let our CreateApe experts act as “jungle guides” and help you traverse the wilds as we take your project to new heights.

Thanks Google, Are You Mobile Ready?

June 11, 2018 - Posted by: Alessandro Fard

Google has officially announced that they will be moving to “mobile-first” indexing. This means that Google will now use the mobile version of a web page for “content indexing and ranking.” As of last year, mobile devices surpassed desktop internet usage worldwide as desktop became a secondary touch point for most users. So, it’s no surprise Google is moving away from a desktop-centric ranking system.

Historically, Google has used desktop versions of page content for indexing but are now using mobile to identify relevant content on the page. Mobile First won’t serve in conjunction with desktop indexing, but as a separate entity in which Google will utilize going forward.

Google is claiming that this new mobile indexing system won’t change ranking, yet in the developer notes it explicitly claims “mobile-first indexing means Google will predominantly use the mobile version of the content for indexing and ranking.

What are mobile solutions that exist right now?

Well, there is a spectrum of options.

Now that Google is penalizing your ranking efforts by prioritizing Mobile First designs, we all kind of have to follow suit. Most designers use a blend of already made bootstrap frameworks and custom design additions to automatically condense information into a mobile device. This is a lazy (but totally acceptable!) way to answer the Google First problem.  

google-indexing-mobile

 

But what can you do to make sure your website is on top of the mobile game?

Depending on time and resources, there are different approaches you can take to design for mobile. Best case scenario is for every desktop design you have, a mobile design will also be created. This takes into account the nuances of each platform and still allows for maximum creativity and interactivity on each page. Now, I’m not advocating for you to suddenly spend an inordinate amount of time producing highly nuanced mobile designs in the next week. However, here are some tips and tricks you can implement to create a better mobile presence:

Sticky Navigation:

Sticky navigation is when a user scrolls through content and your navigation stays sticking to the top of the page. This is key on mobile. If you have an informational site, landing page, or even a product page, having navigation stay sticky will allow your users to easily find content instead of having to search for it. If they decide to take an online action, they can do it easily. Instead of having to scroll back up to “learn more” or Buy Now, it’s right there in front of them.

Truncation:

Things that make sense on desktop don’t necessarily work on mobile. A lot of business owners will have a website with simple navigation, a beautiful hero image, a main value proposition with titles, and maybe even a call to action button. These usually look great on desktop, but the moment you start to degrade that it into a mobile space, it will typically stack everything to look like an endless scroll. (You lose the CTAs and the emphasis you designed for.)

To avoid that, use truncation procedures like:
  • Make icons smaller
  • Have one sentence of website copy featured with an option to expand for more.

Truncation is adapting to mobile so that it’s easier to use and consume for the user. If truncation is done right, everything will be placed higher on the web page in a succinct and accessible manner.

Why is this important?

We don’t absolutely know what will convert the user, but what if it’s the testimonial that was buried in that giant scroll? Truncate your content intelligently when designing a mobile solution to increase user conversion and experience.

Image Sizing:

Sometimes clients will have a beautiful photo on a desktop page, but when it comes time to design for mobile the image is simply too big and decreases usability for the user. You don’t want everything on your desktop design featured on your mobile design. Make sure your images size gracefully or have your designer resize the image altogether so that it fits within your mobile solution.

The rule of thumb for mobile isn’t less is more, but to design with intention. A great UX/UI team will know how to guide you through these steps by first getting to understand your demographic, business goals, and budget. We do the research so you don’t have to.

Want to learn more?

Let us help get you situated for the Mobile First changes coming your way. It’s a jungle out there, click here so you don’t have to go at it alone! Let our CreateApe experts act as “jungle guides” and help you traverse the wilds as we take your project to new heights.

Damn, Another GDPR Privacy Email

June 1, 2018 - Posted by: CreateApe

If the words, “An update to our privacy policy” look familiar, you’ve probably received a flood of GDPR compliances in your email inbox this week.

The General Data Protection Regulation (GDPR), is a legal framework that sets guidelines for collecting data and processing personal information in the European Union went into effect on May 25th, which means it will also affect any company we use regularly that conducts business in Europe.

Not only will it change the amount of emails in your inbox but also website design and UX. Now that users have more control over their data and whether they grant consent or not, GDPR will have an impact on design interfaces.

Twitter user’s were overjoyed about the sudden email attacks:

Well…she’s not wrong
Yiiiiiiikes.
If you’re going to send spam to my inbox might as well catch my attention.
Even Harry Potter can’t escape GDPR updates.
We’re definitely starting to resemble this guy.
Yep, definitely forgot about that gardening company I subscribed to for 10% off once.
Some are even finding….long lost ancestors?
This person clearly does not appreciate the unwarranted calls from their ex.

Although annoying, at least these emails are the perfect opportunity to clear out all the unwanted mailing lists.

A**hole Design Subreddit Makes Us Better

May 16, 2018 - Posted by: CreateApe

Sometimes the best way to recognize and make up for our mistakes is to laugh at them first. That’s what the sub-reddit /r/assholedesign is for, to call out the UX and industrial designer that insists on making people’s lives harder. Almost everyone’s been subjected to the great feat of simply trying to cancel your account only to be met with a thousand step procedure or a technological design that just complicates or confuses the process. That’s why this sub-reddit hits the mark.

As an offshoot of the popular sub-reddit /r/CrappyDesign that features everything from signs, advertising, and third grade projects gone wrong, /r/assholedesign has over 400,000 subscribers who delight in the humor of “designers who know exactly what they’re doing…but they don’t care because they’re assholes.” The site serves as a place to shame bad design varying from architecture, packaging, and web interface.

Some of the posts will have you wondering what the conversation was like in the design meeting. I can only envision “Ah, let’s make it harder by adding three steps, or better yet, let’s make the unsubscribe button invisible!”

(Screenshot of /r/assholedesign)

According to the moderators, “satire is ridicule of asshole design techniques” and the amusement of posters reveals exactly that. Not only does it intend to amuse, but the sub-reddit reveals dark patterns in design, “tricks used in websites and apps that make you buy or sign up for things you didn’t mean to.” These patterns have implications for society, but also for the future of design.

This guy is definitely a subscriber of /r/assholedesign:

Doesn’t everybody love a classic dark pattern?

 

We need this type of sub-reddit because sometimes, even professionals need a reminder of what and what not to do. Anyone with an iPhone 6 or above feels this struggle when trying to listen with their headphones and charge their phone at the same time (that’s some serious “asshole” design).

Although framed in a comical way, /r/assholedesign reminds us that looking at our failures in a UX/UI community allow designers to focus on designs that make the experience better, and not worse, for the user. Laughing at our mistakes and old designs help us grow as a group of professionals. We’ll be the first to admit that sometimes a lesson needs to accompanied with a good laugh.