101 User Experience Design Handbook.

Liliia Mandrino
9 min readMar 8, 2020
Image by Liliia Mandrino.

I have been getting similar emails in my inbox; people are asking how to start a User Experience Designer career or transition into it from another field. Usually, people who are entertaining this thought are students that have limited or no financial support, people with established careers that are seeking ways to transition out of their field gradually, and people who wanted to learn something new. And so the range of questions is: Where should I start? Is it possible to transition? How do I get in? My answer to all this — everything is possible if you want it and ready to put your hours into the learning process. I know well how that all feels, to be hungry for knowledge, and having a limited budget at the same time. You have choices — try to win a grant or scholarship, learn on your own through available resources, online videos, etc., or giving up is also a choice. It’s better to learn with financial support, but it’s possible to invest in yourself as you go with no student debt. It’s harder, but it’s possible.

Get Basic Design Skills

My main goal here is to provide you with affordable ways of learning the basics of user experience design. In this post, I’ll share essential tools, links, books, and names. Keep in mind it’s a fraction of the available information out there. There are more great people, literature, and tools.

Buy a notepad and a pen

Sketching is one of the most powerful ways of solving any problem, even the user experience one. It’s a great way of finding an optimal solution. Before you invest time into digitally creating an interaction pattern, get your ideas on the paper, all them the bad ones too. That’s where a thoughtful selection and validation start; a good employer will be glad to see this in your case studies. $5

Sketch App

This design tool will be an excellent long term investment and an affordable one-time license purchase. SketchApp is used for user interface and user experience design of websites and mobile apps. The only downside about Sketch is it’s only available on Mac. If you’re working on PC, then Figma is your best choice. $100

Figma

You can also design in Figma; It’s design and prototyping capabilities are even more power than SketchApp. Chances are you’ll want to create interactive (clickable or tappable) to test your designs with real people or include those into your portfolio’s case studies. Figma is software agnostic and available for both PC and Mac. 12/month

Flinto

Flinto is a rad design prototyping tool that will allow you to create more complex animated transitions and micro-interactions with bits of sound. Flinto will enable you to fine-tune transitions, add customizable behaviors, etc. Flinto integrates well with SketchApp. Just import your artboards and animate away! $99

Nucleo App

Nucleo is an icon library and icon manager; what often gives up the fact that you are a junior or aspiring designer is the inconsistent use of iconography in your project pulled from all over the web. Don’t fall into this bad design habit; get yourself a nice library of basic vector icons that contains multiple styles — outlines, glyphs, colored ones, with consistent sizes. Nucleo is not your only choice, there are plenty of icon sets free for personal and commercial use, make sure though you are using consistent styles, widths, etc. $99

Keynote or PowerPoint

These tools will allow you to create compelling presentations whenever you are interviewing or pitching, or discussing the vision for a feature/product. Keynote is available for you if you’re using Apple products. Powerpoint is a part of Microsoft Office subscription. Keynote is free; Powerpoint is a subscription-based app. Design is a highly visible discipline, and storytelling is a big part of how you help people get on board with your ideas.

Extra

Adobe Photoshop, Adobe Illustrator, Invision Studio, FramerX, Principle, Adobe XD

Learn from the best. For free where possible.

We have a great design community presence on social media with crash course videos and individual how-tos. Leverage that. Being resourceful is one of the best traits you can possess. Today, as long as you have internet and curiosity, you will almost always be able to find an answer to your questions. Most design software and products have their own YouTube channels with knowledge libraries.

Learn from Pablo Stanley

Pablo regularly is sharing his thoughts on Medium. Pablo’s Medium Profile. He also has many video crash courses for the main design tools.

Sketch App Crash Course
Principle Crash Course
Flinto Crash Course
Framer Crash Course

Learn from Nguyen Le

Fewer people know about him, but Nguyen has a ton of courses, and he is also letting you download some of the old stuff. At this point, even the ability to take a look at his files is golden and a great learning experience. Also, don’t forget to subscribe to his Newsletter.
Nguyen’s Website

Learn from Matt D. Smith

Matt is an independent Design Director; his work is a great example of a thoughtful design thinking and design doing. Matt is also highly versed in technical skills and shares useful videos from time to time on his YouTube Channel.
http://mds.is/

Prominent Tastemakers.

Like in any field, you have teachers and practitioners. Please pay attention to their portfolio, often studying how others approach their work is the best way to learn. I do not suggest you copy it but try instead to analyze why some of those portfolios are compelling to you. Maintain your design hygiene by going further than visiting Dribbble or Behance.

Videos & shows to watch:

Abstract
Objectified
Helvetica
Presspauseplay
Design is One
Eames: The Architect and the Painter

People to follow:

Claudioguglieri
Bek Stone
Pablo Stanley
Jessica Walsh
Matt D. Smith
Bethany Heck
Luke Wroblewski
Liz Wells

Portfolios to see:

Milkinside
Ueno
Mvsm
Fantasyinteractive
Milkinside
Work.co

Mobile App Patterns

https://pttrns.com
https://mobbin.design

Game Design Resource

https://www.gamasutra.com

Websites

www.designcollector.net
www.peopleofcraft.com
www.siteinspire.com
www.awwwards.com

Best Graphic Designers

Margo Chase
Saul Bass
Paul Rand
Paula Sher
Dieter Rams
Massimo and Lella Vignelli
Herb Lubalin
Susan Kare

There are obviously many more; eventually you’ll discover them all.

Visual Psychology.

You are using design to communicate with your user. Learn how to do it well. Gestalt Psychology will teach you how to influence the perception using color, shape language, grouping, and the common laws that influence the perception.

Books:

Art and Visual Perception, Second Edition: A Psychology of the Creative Eye
Laws of Seeing
Visual Grammar: A Design Handbook

Typography.

Absolutely learn how to use Typography. Even if you plan to spend the rest of your life wireframing experiences, an understanding of good typography and its function is a big part of your job. Type is an essential part of any interface and is informing visual hierarchy and usability.

Jeremiah Shoaf created this helpful resource, it will be the best investment; it’s pricey for a student pocket, but it’s worth it!

Accessibility.

The copy you can’t read on the website because it’s too small, confusing colors on primary and secondary buttons, the color of the text that is barely contrasting with the backgrount and prevents you from effortless reading… all it is the outcome of accessibility negleckt. Designing for accessibility means designing for everyone, not only for abled people.

Articles on accessibility:

Pablo’s Article
Smashingmagazine’s Article

Add Motion.

Learn how to communicate through motion. Portfolios that contain examples of interaction explained through motion always stand out. Figma and Flinto will give you enough functionality to achieve that. This paragraph is short, but not because it’s not as important. It’s critical you have this one checked off. I provided links to crash courses earlier in this document. Learn how to use FlintoApp.

Originality.

Find your own. Look where no one is looking to produce what no one is producing. A lot of design principles are transferable from other disciplines. Craft yourself by studying great moviemakers (Alfred Hitchcock, Stanley Kubrick, Martin Scorsese, etc.), look into the automotive design (What about cars is not beautiful?!), architecture (Antoni Gaudi, Zaha Hadid, Michelangelo, etc.), history, nature… Permit yourself to be curious. Go on the journey of discovery. As you get used to this, you’ll learn how to pick something and choose to learn and how to ignore the rest. Allow yourself to be a student of someone’s work, but not the copier.

Self-initiate.

When hiring other designers, I am often trying to see if this person is a self-starter. The way to show it is to showcase the passion project or a self-initiated project. No one is keeping you from self-initiated projects; thankfully, there are a lot of experiences that you can revisit and redesign. Dare to undertake something already existing out there, and you think you can make it better, or take something terrible, and you can make it a lot better. I tend to notice that people naturally are at their best when they are working on something they have passion for. (ex. A website for your favorite rock band, an app for your favorite fitness influencer, or fashion brand, etc.)

Some designers are doing 100-day challenges where they would share work every single day. It does not have to be a complete user flow; those are just small motion or interaction examples, a great way to boost your skills in a variety of design tools.

Nonprofits and Charities often don’t have budgets, but they still have ideas and needs they need help with. That is your opportunity to hone your skill and gain experience in the environment where mistakes are less critical, or at least the team is more forgiving.

Learn Rules. Break Rules.

But first, learn rules. You’ll be better off learning conventions and standards for common UX patterns (ex. How other apps and websites let you onboard or checkout, manage your profile). But you have to be ready to deviate from those if they do not add to the user experience, or you feel like it can be better. Visit https://www.nngroup.com/online-seminars/ to find yourself an affordable online seminar in various fields ranging from UX to Research. Most of these topics are available online in various sources.

Seek Feedback

Observation is the way to gather the most truthful feedback. If you came up with a feature or an app idea, put it into your user’s hands and make them perform core tasks. While the design language of the app might be dependent on subjective opinions, but interaction model should work for most of your potential users. Seek feedback from the best or people who’s been the practitioners in the field for a while now.

Grow Your Presentation Muscle.

Learn how to present your work. Your work does not speak for itself just yet, and people generally are suckers for good storytelling. But how? Storytelling is hard! What you have to do is to take people on a visual journey of your project. Here are basic steps that will help you build a solid case study and structure for your presentations.

Basic case study or a presentation has:

1. Problem Statement
2. Competitive Analysis for a particular feature or product
3. Rapid Prototyping (yes your sketches)
4. Wireframes
5. Hi-Fidelity Mockups
6. Prototype with motion
7. Before & After

Once you compile case studies into a Keynote or PowerPoint presentation, don’t let people just stare at slides; talk about all the details in it. Draw attention to smaller elements and micro-interactions, type choice, and color feedback. While it might be evident to you see all what’s changed or got done, it’s not that obvious to others; help them appreciate your work and the effort you put in.

Be Nice.

I’ve been a part of the hiring panel many times and looked through more than 100 resumes last year, interviewed a couple of dozens, and hired a handful. I can tell you one thing: Jerks come in all genders, and I don’t hire jerks. No one does. If you get feedback, say “thank you” and take it in, learn from it, try doing better next time. Do not overreact or make negative public statements. Interviews are nerve-wracking, and we all know it, so when you get the chance to interview someone, also be nice. Remember how that felt when you were looking for an opportunity. If you happen to be interviewed by a jerk, it’s the red flag that you don’t want to spend 8hrs of your life in that company. Politely thank them and move on. There are design teams with a positive, inclusive, and empowering culture. They will gladly have you onboard.

There Are No Shortcuts.

You gotta put your time in. You’ll learn a lot, you’ll fail a lot, but you have to keep working on your craft. Your future is in your hands, and you can choose how to live your life — as a victim of circumstances or a victor of your destiny.

Recommended Books:

  1. Amazon has a great choice of used books in a great condition. IT will save 50% of your budget.
  2. The Gamer’s Brain: How Neuroscience and UX Can Impact Video Game Design.
  3. How to Use Graphic Design to Sell Things, Explain Things, Make Things Look Better, Make People Laugh, Make People Cry, and (Every Once in a While) Change the World
  4. White by Kenya Hara
  5. Irresistible. The Rise of Addictive Technology and the Business of Keeping Us Hooked
  6. The Design of Everyday Things: Revised and Expanded Edition
  7. Universal Principles of Design by William Lidwell
  8. 100 Things Every Designer Needs to Know About People by Susan Weinschenk

Recommended Podcasts:

  1. Design Better Podcast by Invision
  2. Remarkable People by Guy Kawasaki
  3. Meet The Creatives by Rob Jonston

--

--