by Miriam Isaac
Okay, first things first. Who is this guide for?
- Web designers, visual designers, graphic designers, and students who want to break into user experience design (UXD).
- People who are already familiar with the six principles of design (I won’t be going into visual design here).
- People who already know design tools like Photoshop or Sketch.
Now don’t worry —here’s some impractical advice this article doesn’t contain:
- “subscribe to x newsletter”
- “here’s a ton of links you’ll never read”
- or “find a mentor” — because lets face it, you wouldn't be reading this article if you found the rare unicorn that is a UX mentor.
Here we go.
Thing #1: Learn to code
Just do it. You’ll be fine. Learn HTML / CSS and as much JavaScript as you can handle.
Now before you get all hyped up, listen to what I’m not saying.
I’m not saying learn all the different types of JavaScript out there, I’m not saying go build a ton of websites or apps. All I’m saying is take one online course.
Why? This will give you a deeper understanding of the rules of web design. Once you know these rules, you’ll know how to break them. Plus, you’ll learn what is possible and what is not. This will give you instant cred with the dev team, and save you and your company a whole load of heartache.
I am recommending freeCodeCamp, which of course is free! It’s easy to get started, and the courses are broken down into easy-to-consume bitesizes. The HTML5 and CSS course only takes five hours to complete, and provides you with all the basics you need to know. Go on, dive in.
Thing #2: Print out an entire website or app
If you work at a company, print out their entire website/app. Yes, the entire thing. I once took over a whole room for this purpose. Then look at it. Look for inconsistency on these print outs. From this, create a style guide. Instant cred as a UXer.
If you’re a freelancer, throw in a style guide for free for your next client. Make sure to put that piece of gold in your portfolio. More on style guides here. (Don’t worry, you don’t have to make an interactive one. That would be nice, but it can just be a PDF.)
View this post on Instagram
A post shared by Miriam Isaac (@misaac85) on Dec 19, 2015 at 8:56am PST
Thing #3: Make a user flow map
Now that your entire website is on a wall. It is time to look at it critically and make a user flow chart.
For example for an eCommerce website your simplest user map would be home > category > product > basket > checkout.
You’ll discover that product is the pinnacle page of an eCommerce website. Most opportunities to increase conversion will lie there.
If you aren’t yet part of a company, see Thing #4 below.
View this post on Instagram
A post shared by Miriam Isaac (@misaac85) on Jul 31, 2016 at 5:36am PDT
Thing #4. Reverse Engineer a Website or App
If you aren’t part of a company, one of the best ways to learn UX is to do some good old reverse engineering.
Now don’t take just any website, do this with award winning apps and websites.
The way I learnt web design originally was downloading entire websites to learn how they were made. What you need to do is take a bunch of post it notes and for every interaction write it down as shown below.
View this post on Instagram
A post shared by Miriam Isaac (@misaac85) on Jul 19, 2016 at 2:32am PDT
Thing #5: Sketch, Sketch, Sketch
…out your designs and user flow first. This will eliminate a lot of headache in Photoshop.
My graphic design teacher taught me to always sketch first. This advise was for book covers and posters, but I’ve always found sketching first is always a winner.
Nothing starts until your pencil hits that paper. Before that point its just an abstract idea.
View this post on Instagram
A post shared by Miriam Isaac (@misaac85) on Nov 13, 2016 at 1:10am PST
Thing #6: Start prototyping
Of course you’ll need to learn some sort of prototyping tool. Remember that this doesn’t actually make you a good UX designer, it’s just a tool that connects your mock-ups together.
The purpose of prototypes is to show stakeholders the interactivity that you and your developers can imagine, but they can’t. Don’t think its more than that. Its not magic.
Invision has a small learning curve and plays nicely with Sketch and Photoshop. The first 3 projects are free! It is by far the simplest of all cloud based prototyping tools. Plus the collaboration feature is pretty sweet. Here’s the link.
Thing #7: Get into Google Analytics
Put the script in your website header, then start tracking. Seek opportunities. If your company has Google Analytics, ask for permission to access it.
It’s easy to learn, and if you want to get really into it, there are online courses. If you’re a freelancer, offer this service to one of your clients. Of course you’ll have to do it for free initially, but you’ll get there.
The main area of value to you is the pages area. (Found under the behavior section) Here you can see which pages your users bounce off or spend the longest time on. These pages will highlight your highest areas of opportunities as a UXer.
Now, go to those pages you identified and do the following:
- Run a Heatmap
- Gather User Feedback
- Conduct User Testing
All you need for these three tactics is one tool called Hotjar
Hotjar is incredible. It’s super cheap and super useful. Its actually free for your first 3 websites. It has all, yes, all of the UX tools you need to create user centric experiences. Includes, heat-maps, customer feedback and user testing, everything else is meh. Here’s the link.
Thing #8: Run heatmaps
OK, what you’ll need to do here is run a heatmap for a few weeks, depending on your website traffic. Then you can look for what they call, “opportunities.”
Basically you’re looking for broken patterns. The ones that do well are great validation, so give kudos to the designer who designed that.
The most valuable heatmaps will be the ones where the call to action (CTA) isn’t the color red, which shows users are clicking in the wrong places.
If you are seeking to design an engaging article, what you want is warm colors all the way down and red on the CTAs. If this is not happening: OPPORTUNITY!
Thing #9: Use A Customer Feedback Form
Yep, Hotjar has one of those too, plus it will generate one of those cute word clouds for you. (Everyone loves those.) Plus there’s the option to customize the question being asked. Make use of this feature.
When analyzing customer feedback look for patterns. If you have a Customer Service department, go speak to them and note the patterns in what they are saying. If you have a company event, seek out the reps and hear what they have to say, the advantage being the informal setting. By the way, CS REPS LOVE VENTING, THEY WILL LOVE YOU!
Collect all this feedback and now you get to:
Thing #10: Conduct user testing
Hotjar does offer this, but you can also user test with people in the office, if they’re in your target market. If you’re a freelancer, use your very nice friends.
What you do is, sit them down with the app or website, do not say a word and watch them use it. Write notes on where they struggled or where they easily flowed through the app/website.
With These Three Data Points
…you can now make a UX plan for your clients or manager. What you’ll need to do is create mock ups of the improvements with these key data points. Then present them, then execute.
Thing #11: Don’t be afraid of A/B testing
The best way to prove your worth as an UXer is by testing your designs via A/B testing.
Now, there are not many free ones out there, but luckily you can do this with Google Analytics, with their feature content experiments. It has a steep learning curve though.
Or, the quick ‘n dirty way is, make a mark of your goals in Google Analytics (conversion / average order value / average time spent on page) and then publish your changes. After around 4 weeks (depending on your traffic), make a new mark and compare. If you did your homework, you should be seeing the results you want.
If you are in a company, and you have the budget, try and advocate for a third party vendor. I do recommend Qubit. Plus, they have awesome customer service.
Thing #12: Master the art of communication
You’ll need to learn how to convince people of your designs. I’m not gonna sugar coat this, it’s hard. It is — in essence — selling.
OK, so how do you achieve this?
Listen, Listen, Listen and then Listen Some More
Understanding the client is key in your work. In your kick off meeting, start noting down the words the client / manager / director / CEO consistently repeats, circle them, and then say hello to your new vocabulary.
Now when its your turn to present, use those words in your presentation. But don’t just use them, make sure your designs integrates them. This is a form of mirroring and shows you know how to integrate business objectives into your work.
They want people to buy more? Suggest making the CTA bigger and in an accent color, You can also talk about the artsy-farsty stuff of using a warm color on a cool background to make it “pop.” (Yep. I said that.)
They want people to sign up? Recommend giving the form field more contrast and adding an incentive, think, sign up and receive 10% off.
Customers don’t understand the product? Recommend designing diagrams for the info section or highlighting the FAQs.
They want more branding? You put that logo everywhere: think in the chat icon, store locator map icons, in the footer, create a library of custom icons!
But seriously,
You must always be thinking of ways design, can solve business problems.
The crux of being a UXer is solving problems. If the customer is having a hard time checking out, you can fix that. (Well, not if it’s server issues.) If your customer doesn’t understand what your website does, you can solve that. If your CEO wants to decrease bounce rate, boom you are there.
You are a problem solver, not a pixel pusher.
The best thing you can do in a large company is combine customer feedback and management wishes ($$$). It is actually quite simpler than it sounds, because most of the time it’s two sides of the same coin. You be the one to connect the dots.
Thanks for reading please feel free to inbox me with any questions or feedback.
You can also find me here:
- Instagram: https://www.instagram.com/misaac85/
- Twitter: https://twitter.com/MiriamIsaacDsgn
- LinkedIn: https://www.linkedin.com/in/miriam-isaac-1b4bb531/