This is default featured slide 1 title
This is default featured slide 2 title
This is default featured slide 3 title
This is default featured slide 4 title
This is default featured slide 5 title
 

Monthly Archives: December 2016

Essential Skills To Become A Great UI/UX Designer

It’s frustrating to find job offers looking for a UI/UX designer. While these two skillsets are closely related, their skills don’t always overlap. A quality UI designer may not understand user experience psychology. Just like a top-tier UX designer might not be a master of Photoshop or Sketch.

But there is a good amount of overlap, and to be a great UI/UX designer you’ll need to dip a toe into both worlds.

In this guide I want to comb over the fundamental skills that you should learn to promote yourself as a quality UI and/or UX designer. Job security is much easier when you can alternate between both roles. And it’ll be easier for you to see the big picture in any creative project.

If you want a quick overview of specific features I highly recommend browsing this UX checklist.

User Advocation

Remember that a UI/UX designer speaks for the user. But you are not the user. This is an important distinction because most people using your product will not have the same expertise.

This is why usability testing can be so important. Ask users directly what they like and don’t like. Gather feedback. Try to find the root cause of their issues and make only the necessary changes.

Every great UX designer will be a true advocate for the user. The user experience goes beyond a glossy interface to encompass how the UI feels, behaves, and responds to user interaction. Pay careful attention to the details and be willing to scrap ideas even if you think they’re great.

In a situation where you like something that most users don’t it’s generally wise to drop the idea and rework it a little.

Listen to the user’s complaints and try to understand what they’re really saying. This is true of both UX and UI designers, although most user testing involves the UX side of things.

A pretty interface means jack if it can’t operate properly.

Advocate for the user through your words and actions. This is ultimately the #1 requirement of a UX designer. It’s a tough skill to nail down because it’s not exactly a specific skill. But I’d say having an open mind and being willing to rethink ideas will help you understand the user’s perspective much easier.

Visual Communication

Perhaps the most valuable skill of any designer is visual communication. Most designers get ideas in their head and need to explain these ideas to project managers, developers, or other designers.

Being able to sketch is a great skill to have for this very reason. But you can also communicate ideas digitally by creating digital wireframes, mockups, or interactive prototypes.

The tool or medium you use to create visual assets really doesn’t matter. Naturally it’s great to have many tools in your toolbox. But if you don’t know Photoshop and only use wireframing tools this can work fine.

It’s very important to communicate your ideas visually to the design team & the development team. It’s possible to do this with words but you’ll have a much easier time showing rather than telling.

Be able to communicate with business and marketing guys too. This means using layman’s terms to explain more complicated features.

Explain what the UX plan is to everyone using whatever visuals or words necessary. One part of this is to master a visual medium(whether sketching or software). The other part of this is communication.

Just because an idea makes sense to you doesn’t mean it’s being explained properly to make sense to others.

Ask your team and clients if they need clarification on anything. Don’t let anyone sit there nodding too afraid to speak up and ask questions. Soft skills are vital to UX work.

Learn to love communication and your job will be that much easier!

Digital Design Software

Not all UX designers know how to use Photoshop, Sketch, or Illustrator. But every UI designer should know at least one of these programs.

The differences between these two jobs are small but noticeable. UI designers must create visuals whether icons, logos, or interface mockups. UX designers are more concerned with how these interfaces behave and how users complete their objectives.

But if you’re going the UX design route it’s still wise to study Photoshop or Sketch(or both).

Just mastering one of these programs will help you express your visual ideas much clearer. You’ll also be much more lucrative to employers.

And with so many online tools it’s important to branch out when needed.

Desktop software like the Adobe suite is crucial to the design process. But UI/UX platforms like InVision and UXPin can both prove vital to your portfolio of skills. These are tools for rapid prototyping and creating interactive demos from scratch.

You can accomplish this same task with a frontend library like Bootstrap, but not all UX designers want to learn coding.

Truthfully it doesn’t matter how you create prototypes. But if you have a broad range of skills using various design programs your resume will be much more lucrative.

One last tool I’d recommend learning is a digital UX animation program. The two most popular choices are Principle and Adobe After Effects. These programs let you import digital mockups and manipulate the layers to create custom animations.

Check out this TutsPlus tutorial if you want to learn more. It’s not easy picking up all these programs but you’ll be thanking yourself later.

A great UI/UX designer should be thinking about every step of the design process. It starts with wireframing and prototyping, then moves through digital graphic/UI design into full interactivity.

These animation programs allow you to simulate interactivity without actually building a demo interface with code. Project leaders like to see these kinds of assets and your skills will prove invaluable to the process.

Empathy & Critical Thinking

Being empathetic seems very abstract but it’s quite powerful. If you can empathize with users you’ll be able to understand their concerns, their struggles, and their complaints with an interface.

The best UX designers consider the target audience for any given project. The user experience design for a dating website will be very different than the UX for an RPG video game. Think critically about your target audience to contemplate and understand what they need.

Interpret the individual problems of each project and consider the target audience by understanding how they think & act.

This is a difficult skill to teach because it requires awareness and understanding. When you watch a user interact with a website you should catch all the little details and nuances about their behavior.

If something was difficult for the user they’ll definitely complain during user testing. But a complaint is a problem, not a solution. As a UX designer your job is to gather user feedback and interpret what it means to come up with real solutions.

Practice by surfing the web and browsing other websites. Write down your complaints. Don’t be afraid to ask “why” every step of the way.

Personal Branding Guide for Designers

Personal branding is the practice of people marketing themselves and their careers as brands. Being good at your craft is not enough these days, being unique and authentic will make the cut, but only if enough people know about you. As Michael Simmons writes, authenticity is key in the digital age. Having a strong personal brand and following can lead to enormous opportunities and recognition.

Personal branding is becoming one of the most important key factors in any industry. Skills and boring resumes are not guaranteeing you anything anymore. You have to really start developing your own brand and building a tribe, or in other words an audience that will help you getting jobs, supporting you, sharing your work and getting recognition.

In today’s article I’d like to share some personal branding guidelines I’ve been experimenting with in the last couple of years. The techniques and methods used led me to speaking engagements, interviews on Forbes and Fast Company, business growth and business leads, not to mention the connections and friendships I’ve made.

Why should you care about building a personal brand?

There are numerous of reasons why you should consider strengthening your personal brand. The thing is your personal brand exists anyway, it’s how people perceive you, your work and your actions. To make sure that your brand goes together along with your values and how you wish to be perceived is to manage it. Moreover, building a recognizable personal brand will help you with the following:

  • Professional opportunities;
  • A better job;
  • Better contacts and clients for your company;
  • Industry recognition.

Vision

Develop a strong vision and make sure that you use it everywhere you go. Whether it’s to go to the moon or sail around the world, make sure it’s something big and bold, people remember these things. If you haven’t watched Simon Sinek TED talk “How great leaders inspire action” presenting “the golden circle” and “start with why” theory, make sure to check it out and come up with your own vision.

Who are you targeting?

Who is your message receiver, who are you talking to with your brand? The common mistake is everyone, we want to appeal to as many people as possible. The harsh truth is that if you try to please everyone, you’ll please no one. There is always someone who loves you for one thing and hates you for the other. Every person has an opinion, so you shouldn’t be concerned about appealing to everyone. Better think about your vision and long-term goals.

Use high quality images

No matter how great your website looks like and how many great stories you have to tell, people are visual creatures after all. Humans form opinions based on the first impression and images send more than needed information to make a strong impression and form an opinion about the brand.

According to 3M Corporation people are extremely drawn by visuals compared to written information.

“90% of information transmitted to the brain is visual, and visuals are processed 60,000X faster in the brain than text.”

German designer Tobias van Schneider is a great example of high-quality imagery usage in personal branding communication that noticeably stands out.

Some more great examples:

 Be consistent creating

According to Austin Kleon, an author of the New York Times bestseller “Show Your Work!” you have to consistently post bits and pieces of your work, your ideas, and what you’re learning online. Instead of wasting your time “networking”, take advantage of the network.

Think about all the great work you do but no one knows about it. Make sure to take an advantage of today’s internet ecosystem, post your drafts, ideas, updates, work in progress and complete work to get early feedback, recognition and potential leads.

There are some brilliant communities just for designers, Dribbble, Behance, DeviantArtjust to name a few. Other medium can be your personal blog and portfolio.

Master storytelling

Storytelling is an enormously powerful skill that can set you apart from other faceless designers in the industry and help you shape your brand that people are interested in and eventually think of when in need of a designer.

Instead of showing just your work, add some of your daily life to it, share work in progress, share your daily routine, share how do you find inspiration and the list goes on. A great example is Tomas Jasovsky, a Slovak designer who tried to get into a big company like Facebook, Spotify and after not getting in decided to pack his belongings and travel around the world with his girlfriend. He’s calling himself a nomadic designer and everything he shares is mixed with traveling, design, food and adventures. Who’s not interested in such a lifestyle?

Make connections

It’s incredibly important to start building your professional network and get industry leaders into your circle as you will be perceived as one of the leaders as well.

“Your network is your net worth.” – Tim Sanders, author, public speaker, and former Yahoo! director

There are many ways to start connecting with people and you should not necessary focus just on designers, any connection is good and may lead to a “top dog” designer that you may not be able to reach from another designer.

How do you get people interested in you? You don’t, you start by listening to them and trying to provide them value in any way you can, only then people will start connecting with you in a genuine way and forming long-lasting relationships. If you want to learn more about networking principles for designers check out my article I wrote last year:key networking principles for design entrepreneurs.

Below are some handy websites and social networks for meeting new people.

  • Startuptravels – connect with the world’s startup scene. Meet entrepreneurs and startup enthusiasts in over 160 countries.
  • Meetup – one of the biggest platforms in the world for meeting people on pretty much any subject you can imagine.
  • Dribbble Meetups – Dribbble Meetups are a chance for designers to socialize, talk shop, and foster their local design communities.

Tips To Create a Web Design Style Guide

Creating websites is getting more and more complex and is usually not a one person job. It is important to ensure that design is consistent and optimized to meet business objectives and create enjoyable experiences for users.

One of the ways to ensure that team is on the same page when designing separate parts of the website or saving designs from developers is to create design documentation or a web design style guide.

It is beneficial to have a style guide in order to create a cohesive experience among different pages. Also it helps to ensure that future development or third-party production will follow brand guidelines and will be perceived as part of the overall brand.

Luke Clum has touched the surface of using style guides as your first step in web design last year and I would like to take a more in-depth look on how to create a usable web design style guide for your projects.

What is a Style Guide?

A style guide is a collection of pre-designed elements, graphics and rules designers or developers should follow to ensure that separate website pieces will be consistent and will create a cohesive experience at the end.

Why Is It Important?

It is extremely important when multiple designers are working on a big website or web app to ensure that they don’t interpret too much and don’t alter or adjust styles based on personal preference. In development, having defined elements of the website makes it easy for developers to reuse these elements. Moreover, it can make it easier because they will get what elements they have to code and will see exactly how they need to look from the start.

In order to make developers lives easier, it is the designer’s duty to include all possible interactions such as hover, click, visit and other states for buttons, titles, links, etc.

Creating a Web Design Style Guide

1. Study the Brand

First, you need to study the brand so that you understand what it stands for. Get to know the story behind the brand, observe the team and figure out the vision, mission and values of the company. It is important to dig deeper into the brand so the style guide you produce will visually and emotionally represent the organization.

If you’re a designer who can’t code, simply open Photoshop and give your document a title and a short description of what the document is and what it is for.

If you can code, it is better to create an html document with pre-coded assets so they can be easily reused.

2. Define Typography

According to Oliver Reichenstein, typography is 95 percent of web design.

You must get typography right because it is one of the most important communication tools between visitors and your website.

Set hierarchy and identify it. There are headline types: h1,h2, h3, h4, h5 and h6. Then body copy, bold and italic variations. Think about custom copy that will be used for smaller links, intro text and so on. Provide font family, weight and color.

3. Color Palette

It is incredible how humans perceive color and associate hues with known brands. Think of Coca-Cola, I bet you see that red now.

Begin by setting primary colors for your style guide that will dominate your website, dominant colors should include no more than three shades. In some cases, however, you will need secondary and even tertiary colors to illustrate your user interface, make sure you define them too. Also include neutral colors like white, grey and black for the primary brand colors to stand out.

4. Voice

The voice that I am referring to is actual copy. You have studied the brand before starting the style guide and found out that brand is youthful and trendy. If there are no directions for voice of the copy, you have to define it. It can be a simple example given showing that voice has to be professional yet funny and welcoming. Instead of stating“You’ve got 404 error” you can say “Oh boy, you’ve broken the interwebs. 404 error.” If the voice were more corporate, you wouldn’t do that. Brilliance hides in small things.

5. Iconography

Icons have existed for thousands of years and are older than text and words. Take advantage of using icons in your projects because they will give an instant idea to visitors as to what’s going on and what will happen next. Picking the right icons will give more context to content than color palette, copy or graphics. When using icons, make sure to think about the target audience, religion, history, so you avoid misconceptions and misunderstandings. One more thing to mention, think about the brand and its values so you don’t use hand-drawn icons on a large banking website.

6. Imagery

Pictures speak thousands of words. Make sure to include imagery that defines the style and direction of pictures the website should use. Once again, think about the values of the brand and its mission. For example, a water charity uses striking imagery that has strong emotion, good cause and calls to human emotion for them to be fortunate to have essential living commodities like water, food, electricity and education.

7. Forms

Forms are what make your website or web app interactive and dynamic so the user can enter the data and you can then manipulate it and do the work.

Make sure to establish a hierarchy and include possible feedback from forms — active, hover, add error, warning and success messages including things such as a password being too weak, email being not valid or simple success messages e.g. “email was sent.”

Intro Guide to UX Reviews for Web Designers

A great UX review can do wonders for any website. By looking over the entire design you can learn what’s working, what’s not, and maybe find solutions that can increase the UX and ultimately increase revenues.

But learning how to conduct a review is the first step to solving problems and creating a better experience. In this guide I’ll cover the basics of a UX review and how you can get started running your own.

This does require some background in UX design but it also relies on basic principles ofmaking great websites. If you’re willing to learn and put in some elbow grease then a UX review of your own website can be a great opportunity for growth.

Conducting a Review

The goal of a UX review is to comb over an entire site and find spots for improvement. These spots could be obvious or they could be small, but you should aim to improve the site as a whole.

You should always aim to study objective trends and find statistics that back up your ideas. Designers aren’t always the most quant-oriented people but it’s a necessity in a good UX review.

Try to avoid vague opinions or how things feel to you personally. Instead gather user feedback and study traffic trends to gather ideas for where problems could be and why they’re happening.

This can be done through a number of techniques:

  • Direct user feedback
  • Screen recordings
  • Analytics goals
  • Analytics user flows

Each technique offers a different perspective for studying the same website. UX reviews can try to improve everything or focus on one specific task like high bounce rates, signup rates, or time on page.

If you’re working on a personal project then you can set the metrics yourself. But client projects require collaboration because you’ll need to know what the company wants to improve.

How you conduct the review and how much information you gather will differ based on the client. Larger businesses can require more information where you’ll need to compile everyone’s goals into one big strategy.

The initial stage of a UX review is about information gathering moreso than anything else. Once you have enough raw data you’ll begin to see patterns, and these patterns can lead to insights for solving the tasks you’re faced with.

Planning Specific Goals

It’s easy to keep asking yourself questions and never really coming to detailed conclusions. But with specific goals you’ll be forced to study certain metrics and try to solve for very specific end results.

Think about the goals you need to aim for and what they mean. A high bounce rate means people leave the first page they enter. But are they on that page for a while? If yes, then they’re probably finding the information they need and leaving.

But what if it’s a landing page? Then people are leaving because they’re not interested. But why? Maybe they just don’t see the CTA button to sign up, or maybe they don’t understand what the page is for.

The planning phase goes beyond just goal setting. You’ll need to look into a few points:

  • What is the problem(or problems)?
  • Why do these problems exist? What is the cause?
  • What is the end result you’re looking for?
  • How can you move from the current state to one that solves these problems?

By repeating these steps over and over you’ll find new problems, look for new solutions, and leave yourself a big ground for testing. There’s never a fully completed project so there’s always room for more optimization.

Another step is creating believable personas that can fit into your target audience.

These are like marketing segments that may visit your website and be looking for a certain experience. And these general demographics can have very different goals that you need to support. UX designers go so far as to find custom CC photos for personas because they can make a difference.

When studying goals it helps to get into the head of your typical visitor. With a persona it’s easier to get into this theoretical mindset and look at the site from their point of view.

But personas can be far too vague to actually offer value. Try to use them sparingly and find situations where they’re useful.

And be sure to share ideas with other designers or project leaders to gather feedback. Goals need to be in line with KPIs so that your UX review results can improve the right metrics.

Pinpointing Issues

This is perhaps the most fun and ironically the most tedious stage of the review.

Once you know what the goals are you’ll want to dive through the website and look for issues. You can do a quick trial run through every page or give yourself set goals playing like a “typical user”.

As you spot issues organize them into a spreadsheet, or whatever system you prefer. This way you can sort issues by severity and tackle the most serious issues first.

I recommend Jakob Nielsen’s severity rating guidelines because they’re almost a staple in UX communities. This scale includes 5 rankings starting from 0(no problem) to 4(glaring usability problem).

  • 0 = I don’t agree that this is a usability problem at all
  • 1 = Cosmetic problem; doesn’t need fixing unless there’s extra time
  • 2 = Minor problem; should be fixed but lowest mandatory priority
  • 3 = Major problem; important to fix as soon as possible
  • 4 = Catastrophe; this needed to be fixed yesterday

Rate each problem you find with this scale and also consider ranking the difficulty level.

If the solution is obvious and only takes 15 minutes of coding then it’s a quick fix. If you need to brainstorm with other designers and spend a few days finding a solution then it’s a much more detailed problem.

Always look for the quick fixes and correct these ASAP. These can boost morale and help you feel like you’re actually getting somewhere.

Not all problems have obvious solutions and many problems require a good amount of brainpower to solve. But don’t try to solve everything at once.

Organizing all UX problems first can make solving them a heck of a lot easier.

Finding the Right Solutions

The toughest part of any UX review is finding the best solution for each problem. But this is basically the whole point of a UX review.

Oftentimes the best solutions come from common sense. You can study other websites to see how they’ve solved problems or look up case studies online. If you’re facing a common issue like increasing time on page you better believe others have too and many offer their solutions online.

I also recommend user testing if you can afford a simple test along with setting up aheuristic evaluation to get the most information possible. You’ll want eyes on the design because those eyes offer a fresh perspective that may come up with fresh ideas.

Test, implement something, gauge results, and test again. UX is in many ways scientific, but it’s also repetitive and the only way to know if something works is to try it out.

You will absolutely have questions during this process. Even professionals get stumped at times.

If you work alone and don’t have a team then you may feel lost at sea. But remember the Internet is a huge place with tons of communities willing to share advice.

Moving Forward

If you’re new to UX reviews then start small and work in steps. Research online when you have questions and make sure you’re always working towards a goal.