10 Steps to Transition from Visual to User Experience Design
My curiosity around working as a UX designer started when I mentioned an open position for UX and Visual Design to a friend that has been working as visual designer for the past 10 years, and she replied with a simple “Oh No, this is definitely not for me. I am not UX.”
I started to ask myself why some visual designers are so laid back about transitioning to UX, and I realized this is so common that I decided to create this quick guide on “how to let your fear about transitioning to UX go” (and I just realized the title sounds like a yoga class).
So let’s start with awareness.
First of all: I started as Visual Designer and I do consider myself a hybrid UI/UX Designer nowadays. But this article isn’t about me — because that is not how UX works. This article is about my observation of a few skeptical friends that are even afraid to talk about the topic. #DramaAlert.
So what exactly is the difference between Visual and UX?
As a visual or graphic designer you probably love typography, branding, mood boards and pixel perfection. You know how to communicate through colors and shapes and how to make any type of content more digestible and pleasant. You probably love that colorful chair that costs $9,000 and dream about that time of your life that you will actually be able to afford a proper decoration! Don’t give up, my friend.
As an User Experience designer, your goal is to ensure that your user will be able to complete a task from begin to end. You are worried about their understanding of your screen/product, the ease of use, the findability of new features/content and how natural their flow will be. You prioritize their tasks. The flow needs to be effortless and that is your new life goal. Instead of looking for fancy chairs around deco shops, you are probably criticizing why the self service checkout is so inefficient or why paying for a parking in a different country is such an impossible task. And can anyone please tell me why plug sockets are not the same everywhere?
But despite these “two” roles being completely different, it is hard to separate them. Both of them are making sure the content will be digestible and delightful, UX just goes a bit deeper on the flow. An efficient flow becomes delightful when great visuals are applied — but great visuals won’t turn a complicated interface into a good experience. This is not hard to know.
So, finally, what does it take for a Visual Designer to start the transition to UX?
Think about this as a recipe, just get your pencil, a notebook and your laptop and start mixing the ingredients. And the secret of this recipe is how you observe and reflect about your findings:
1. Start from scratch: you know nothing! So go do some research!
The first step is always the same. You need to know everything about the world you are working on. Ask yourself what is the task your user is trying to accomplish and what exactly is their need behind the task. Why are they doing this? Is this task the only way to attend their need? What else can be done? What are all the possibilities? What is the industry doing? Who is doing it well? What are the experts from the industry saying about it? And about the future of the industry?
2. Sketch and go blue sky!
Draw a draft of your user flow. Identify the gaps on the flow. Start sketching ideas. Throw them away and start again. Work on two, three or thirty different concepts. Go blue sky. Ask yourself “What would be amazing?”. You can validate your ideas with the team later — but make sure you won’t limit yourself when you are brainstorming and exploring different concepts.
3. Prototype it. And test your prototype.
As soon as you find that your concepts are on an acceptable level, start validating your assumptions. Talk to users, ask for feedback from your team, your colleagues, your neighbor. Avoid asking for feedback from your parents, though, but keep in mind that feedback is like chocolate: the more the merrier! Test every single idea you have.
I don’t want to expand too much on this topic, but make sure you find the ideal prototyping technique for the different stages of your project. Testing ideas with sketches or paper prototype are absolutely fine, but work with middle-fidelity wireframes if you are looking for feedback on the usability of yours screens and positioning of content on a deeper level, for example.
4. And hold your horses
As a visual designer, it will be just natural to add colors and personality to your work. Hold on a bit and start by making it simple, comprehensive, accessible and usable before making it delightful. Go low-fidelity as long as you need, but make sure people understand that you are looking for feedback on the concept, on the flow or on a few key areas, but visuals are not being covered yet.
It is important to set up expectations before you test anything, so your users always need to know what type of feedback you are looking for.
5. Sketch again. Test again. And again. And again.
Iterate, iterate and iterate. And iterate and test again. Final dot.
6. Redefine the user flow.
At this point, you probably have a good understanding of the problem you are solving and of your user’s needs. Reflect about the user flow again and ask yourself how you can make it even more simple. Identify stupid and unnecessary steps!
Your mantra now is “Don’t make anyone think”. Red flag if you catch yourself thinking “users will get it, they know what they are doing.” Always assume they don’t have time to learn anything new and if your product is not good enough, your competitor’s product will be. Tough but true.
7. Test it again.
And again. Just never stop testing. Even if you reach the unreachable perfect scenario, the world is changing quite fast… Make sure your product is always up to date.
8. Tell a story through your screens.
This is how you bring life and playfulness to your screens. Are the users able to feel part of a story while going through the flow you designed? I know it sounds pretty abstract, but just try to identify if there are any “Wow, this is interesting” or “Wow, this is fun.”. No matter what problem you are solving: any type of product can bring some joy and this should be your goal too!
9. Think about every single scenario. What if?
If you are not an unicorn, you will probably handle your designs to developers at some stage. Make sure your experience is delightful even when the screen says “No results found, my friend!”. 404 is just not acceptable, ok? You should predict every single scenario and make sure nothing has been forgotten. Try to do this exercise with your development team if possible.
10. But, do I need to code?
Knowing CSS, HTML and/or JS will help you designing for web since you will be aware of best practices and feasibility, but it is definitely not essential. Don’t let this fear get in your way! Just make sure you get feedback from your development team so you make sure you are not designing anything that is not feasible.
And… Ooops, you will be wrong.
This is my favourite part about design. Or about life, if I can be a bit dramatic here. We start by making assumptions that will be validated over time, so make sure you keep yourself open to new ideas, to problems that you hadn’t identified before and to things that made sense for you but are not making sense for your users. Just make sure you are always flexible and your opinion is not the strongest one. This exercise is easier in theory than in practice, but this is how your designs (and you!) improve.
And start doing it. You learn by doing, by reviewing, by getting feedback and taking every single-big-and-tough NO as a step up on the ladder. Reflecting about the “NO’s” is understanding what went wrong. Is about understanding your users and more important than that, it is about understanding that design is never perfect and is never “ready”. There is always something that could be improved and if you wait for this moment, your designs will never get out of the door. Infinite iterations and improvements are part of the process.
So start doing it. And never stop doing it.
Ps.: this article is not hoping to replace any formal education neither saying that working as a UX designer is as simple as a recipe. It is just to encourage Visual Designers to take the first step and start exploring this awesome world — so hopefully, someone, somewhere, will design universal socket plugs and we won’t need to run out of battery during holidays in Greece!
Happy UXing!
But before I leave… Where can you find more?
1. Observation and reflection were mentioned a few times and are part of the IBM Design Thinking framework, which is the IBM approach to deliver user centered outcomes at speed and scale.
You can read more about it here: http://www.ibm.com/design/thinking/
2. There are uncountable free courses, online books and articles about UX. Don’t be lazy. Get inspired. Get confident about your decisions by following the leads on the subject. My favorites are:
- Studio by UXPin: https://studio.uxpin.com/
- Invision Blog: http://blog.invisionapp.com/
- NN/G https://www.nngroup.com/
3. These two books are a “must” if you want to get in this world. I won’t tell anyone if you haven’t read yet:
- The design of everyday things (by Donald Norman) https://www.amazon.com/Design-Everyday-Things-Donald-Norman/dp/1452654123
- Don’t make me think (by Steve Krug) https://www.amazon.com/Dont-Make-Me-Think-Usability/dp/0321344758
