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.

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.

The Simplicity Key

April 6, 2018 - Posted by: CreateApe

Google, Amazon, and Apple are among the strongest brands of the last decade. They have created billions in brand value and have industry-leading business performance. What else do they have in common? Their brand success can be directly tied to simplicity–to making life simpler for their users, that is. They also adhere to simplicity rules to define their brand experiences. These rules are worth considering for any brand trying to simplify their customer experience and drive customer satisfaction, commitment, and connection.

Consider the context.

Every brand thinks it’s the most important thing in their user’s life. Seldom is this true. A user’s experience with a brand is just one event in an action-packed life. Good brands map out their customer experience looking for opportunities to simplify, eliminate steps, confusion, and complications in ways that add value. Great brands look to where the brand and the experience fit within their user’s overall life, looking to make not just the experience easier but a user’s overall life easier. Amazon, with its 1-click ordering, is a great example of a brand that ‘considers the context’. Typical web marketing theory of the time said that the goal was to keep customers on a brand’s website for as long as possible to increase interaction and engagement in the belief that this would increase purchase. Amazon took a counter approach, creating a 1-click ordering option where user preferences and purchase information could be stored in order to enable a single click purchase. Amazon’s 1-click ordering, and the resultant user satisfaction with its simplicity, is core to the Amazon’s brand promise. By making online shopping as quick and painless as a single mouse click, Amazon made simplicity and customer-centricity core to their brand over 13 years ago.

Go deep.

Simplicity is not just eliminating steps, clarifying language or using intuitive graphics. Brands that succeed due to simplicity understand that everything must work together, clearly and seamlessly. Apple is a brand that lives this. Not only are the devices beautiful, simply to understand and use right out of the box. Not only do the devices work simply with the iTunes store, iCloud storage, and other Apple systems. It isn’t just that their user interfaces are a model of clarity and simplified interaction. Apple realizes everything matters when it comes to simplicity. That there isn’t an end to what can be simplified and made better. That in order to get it right, they must consider everything, they must ‘go deep.’ Only by going deep can brands understand how everything fits together and how everything matters to the user.

Avoid ‘feature-itis.’

Rather than continuing to add incremental features to a brand experience over time, great brands stand firm once they reach a level of simplicity, resisting the urge to add brand bells and whistles. Melissa Mayer, former VP of Google Search Products, is credited with keeping the interface of the Google search page blissfully simple: a white page with a blank box. Despite constant pressure to use the power of one of the most visited pages on the web to promote other brands, Google resists that urge, maintaining a simple page in the best interest of the user.Simple is a powerful strength for great brands like Amazon, Apple, and Google. Increasingly, it will be necessary for every brand. In a world of ever-increasing complexity, brand simplicity is critical for brands to get right or risk customer disappointment and defection.

How To Think Like A UX Designer

January 15, 2018 - Posted by: Alessandro Fard

Five tips that will get you thinking (and designing) like a UX expert! User Experience designers stay curious, endeavor to be empathetic, and work hard to be a team player. Read on for more… and let us know what you would add!

1. Don’t start designing without insight

If you don’t have time to do research, still observe. Still find that nugget of new information that changes the way a customer’s life will be as a result of your product, service, or brand. Make sure you have that insight and make sure your entire strategy is built on that insight vs. a brainstorming session that’s internal.

2. Live out your ABCs: Always be curious

A lot of what we see in terms of a great UX designer and an okay UX designer comes down to their level of curiosity. The ones that we’re less impressed with — for example, when I’m hiring — are ones that try to play it safe. They want to follow the rules, the patterns, the standards. They know what they’re doing, which is great, but they’re not really interested in what they don’t know.Verses the great designers, they can show you what they’ve done, but they can also ask questions and tell you what they would do differently and the questions they would ask that would be different on the same project again. Really hone in on that curiosity — it gets lost in the day-to-day. Really try to make sure you’re pulling that up.

3. Advocate and fight for the customer

There’s a lot of things that you’ll find that cost money, or that make the process different than what the business needs it to be, but it would be better for the customer. Registration forms are a great example. Businesses want to put that first, users don’t really like them. Really think about what is that customer experience and what do I need to change in order to improve the customer experience. Change can be stressful and sometimes you have to fight for it.

4. Remember, you’re not the only one with great ideas

Some of the proudest moments that I’ve had has not being coming in and delivering a recommendation report, but getting a team, especially a client team, to come up with the recommendations and solutions themselves. Really trusting that [your team members] knowthe business, they know what they’re doing, they’ve participated in the research with you and it’s a collaborative process to get them to ideate. They also will take those ideas further, so for anyone who’s consulting on the UX side, I have found success in not being the one who has the answers, but being the one who asks really great questions, which helps people find the answers within them.

5. Swap your mindset: You didn’t fail, you just learned and have an opportunity to iterate

When you make a ‘mistake,’ remember, those are great. Those are really important learning points, and you’re always learning. If you’re trying new things, you will likely fail. I mentioned earlier to a colleague, [if] there’s a task that I do and I haven’t done it right seven times, it doesn’t bother me — I’ll just try it again for the eighth. And that’s what makes or breaks a UX designer. If you’re trying new things, you will likely fail for part of it, which is great. Who cares? The important part is getting it right eventually.