Introduction

One afternoon, I took a break from Figma and scrolled through my Instagram feed when I got a DM. It was from a graphic designer who was interested in becoming a UX Designer. He had a few UI shots on dribble and asked me for feedback as well as tips for starting a UX Design career.

I gave him some feedback mostly regarding the visuals as well as some UX book recommendations. Deep down, I knew there was so much more information to share so I started this side project to put together a few notes on topics that I think are essential as well as things I have learned so far.

My goal was NOT to write a UX Design Textbook. I’m hoping this can help you get started if you are new to UX Design. I get how easy it is to be overwhelmed when you don't know where to start, so think of this as a starter kit to point you in the right direction.

Only reading it will not be enough though. Ultimately, your persistence, curiosity, and willingness to grow will determine your success as a UX Designer. If you went as far as reading this book, it means you have a decent amount of interest in the subject and that is all you need to start your journey.

Terminologies

Before getting into the details, I think it’s a good idea to understand how I define User Interface (UI) Design versus User Experience (UX) Design. There are different perspectives on this. Some people separate them while others believe that the interface is also part of the experience as a whole, so they use UX Design as an umbrella for both subjects.

I agree with the latter. But for the sake of clarity, I will be using UX Research for the “UX” side of things and UI Design for the visual side of things.
UI Design focuses on the visible aspects of the experience. It involves the design of the different components that make up the interface as well as the interactions that help the user achieve their goals.

UX Research focuses on the use of different research methods (interviews, surveys, and analytics) to understand the user’s pain points, needs, and motivations with the goal of identifying opportunities for a product or solution. I will also be using “Product” as an umbrella term for tech products like mobile apps and websites.

A Summary of my UX Design Journey

I didn’t know UX was a thing until about late 2018. Prior to that, I was working in IT as a Database Admin at a bank in Lagos, Nigeria. I worked there for 4 years. Right around my 2nd year of writing SQL code, I knew it wasn’t for me. I always had a creative mind. A repetitive job like that was mentally draining.

I had an opportunity to study abroad and I started looking for courses. I’m glad I didn’t pick a Masters in Business Intelligence. I needed something different. I eventually settled on a Diploma in Graphic Design and Interactive Media at Toronto Film school. It was in my third semester that a colleague told me about UI/UX Design. Shoutout to Isco. I became curious from then.

What drew me to UX Design were the clean and minimalistic visuals and UI animations on dribble. I had no idea of the amount of thought that had to be put in to build a good user experience. It wasn’t the wrong motivation, it just meant that I was more interested in how things looked. This was probably a result of my background as a graphic designer.

Three months after graduating, I got an internship with an ed-tech startup. It was unpaid. I documented everything I worked on. During my free time, I built my portfolio and took two courses on Interaction Design Foundation (Design Thinking & Become a UX Designer from Scratch).

I kept applying for jobs that required 1-3 years of UX Experience and five months later, I landed my first job as a UI Designer at an agency. I never went to a UX Bootcamp, everything I have ever known about UX Design was self-taught. Nothing is wrong with bootcamps, personally, I think they can save you a lot of time. However, not everyone can afford to pay $2000 for a 6-12week course. I definitely couldn’t when I was starting out. That’s why I took the self-taught path.

Identify Your Strengths

I didn't know what my strengths were so I started with improving on my weaknesses. They were the things I was least confident about. Gradually, I learned what I was good at. I spent my first two years focusing on interface design because it was a weakness, now I’m looking to go deeper into UX research, strategy, and product design as a whole.

If you are more passionate about interacting with users to understand their needs and documenting insights and opportunities, then you are more likely to lean towards UX Research. As I stated earlier, there is a lot of ambiguity in terms of how roles are advertised. Most companies that are looking for a “UX Designer” are looking for someone to do both UX Research and User Interface Design. Only in specific cases will you see a job explicitly titled UX Researcher or UI Designer.

Product Designer is also becoming a popular role these days. It requires a good knowledge of UI Design and UX Research as well as an understanding of how the product fits into the business as a whole.

My opinion is to have an understanding of both UI Design and UX Research but play to your strengths. In my case, I had a graphic design background so I was more passionate about UI Design and I made sure to highlight it in the way I presented my work. I recommend you do the same if research is your strength or passion.

Also, It’s your career at the end of the day so don’t feel pressured to pick one and stick to it. You can always drift between design and research if you are looking for a new challenge in the future.

Research and Documentation

I wasn't excited about research when I first became a UX Designer but I realized it is the foundation for everything else. We’ve all used apps that make us want to smash our phones. For every product, you were able to use without stress, know that hours or even months have gone into user research and testing.
The depth of the research ultimately depends on how much time and money a company is willing to invest. Most startups and agencies are Agile. This means time is usually a constraint so you may not have months or weeks to do research. In a very competitive industry, the product is quickly launched to acquire customers and then improved over several iterations.

There are many research methods out there. You don’t have to know all of them. You just need to know how to use the ones that fit the project and provide useful or actionable insights. One of my favorites is a simple user interview.  All you need to do is identify what problems you are trying to solve and the information gaps that exist around them. Next, you will use them to form questions for the user. The goal is not to ask leading questions but to ask open-ended questions that allow the user to express deeper thoughts. That is where the insights are.

Depending on what stage of the project you are in, you may have a prototype to show to gather feedback during an interview. Surveys are also a great way to save time when gathering data from a large number of people. Just keep in mind that actual interviews provide deeper insights that may be lost when people fill out a google survey.

For existing products, another popular form of research is extracting insights from data on platforms like Google Analytics, Hotjar, etc. They often provide a very broad view of the user activity. Such data is mostly quantitative and may not necessarily capture the users’ true feelings or emotions.
After conducting multiple interviews, you may start to see patterns. A pattern can be something that is highlighted by two or more users. When several users highlight a specific issue with your prototype, you already know real-world users will face the same challenges. Don’t overlook them.

You will need to extract all the actionable insights. These could be features, functionalities, or potential pitfalls for the product or solution. Documenting your process is also important. Your documentation comes in handy when building presentations of your findings for stakeholders or case studies for your portfolio.

Mapping out The Experience

Engineers need a blueprint to follow. You are the architect of the product. But wait, you shouldn’t just jump into Figma to start designing the UI. You need to first define the user flow. It starts by asking these two questions:

To answer the second question, you can make quick sketches/wireframes with a pen and paper. It doesn’t have to be perfect. You can use a pencil if you are one of those perfectionists. You can also use a wireframe kit in Figma if you are pressed for time. I recommend starting with sketches because you don’t want to worry about layout and alignment at this stage. This is called a low-fidelity prototype. The goal is to have a map that can guide you when you start the actual designs.

Personally, I don’t show my lo-fi Prototypes to stakeholders except they are design-minded or they specifically ask for it. Most people will have a hard time visualizing your concepts from a sketch. Remember to document.

Designing The Interface

Finally, the fun part. Your sketches can now be converted into high-fidelity prototypes. Most times when I skip the "mapping out" stage, I end up spending more time experimenting with different designs.
Even though I had a graphic design background, I still had to spend hours replicating different UI shots that inspire me, just to train my eye and boost my creativity. I recommend you do the same.

To level up your UI Design skills, you will need to be comfortable in these main areas:

Layout

Layout was one of the topics covered in my graphic design course. It was useful for print design. However, I was wrong to assume I could directly transfer that knowledge to UI Design. Print is very different from UI Design for obvious reasons. In UI Design, It’s all about sizing and arrangement of components in the viewport to create a clean and user-friendly interface.

A major topic in layout is responsiveness. Users will most likely use the product on multiple devices (Desktop, Tablet, Mobile ). UX Designers are also responsible for the product being usable on different screen sizes. Don’t just focus on the desktop view, think of how it will look on mobile as well. Always consider the feasibility of your designs so you don’t end up with something developers can’t build.

Color

Color can be an intimidating subject for many designers. There are so may combinations to choose from so it’s easy to get overwhelmed. Color was one of my weaknesses so I focused on it. The way I improved my use of color was to observe color combinations that drew my attention and experiment with new colors that I rarely use. Few of my favorite tools for exploring new palettes are coolors.co and color.adobe.com.

You should also practice how to apply the right text colors on backgrounds that comply with accessibility standards for contrast (more on this in the typography section). This will make your design useable even when a user is visually impaired. Installing an accessibility plugin in Figma or XD can help with this. Sometimes, you will have a limited palette of colors to work with depending on the brand. Great designers know how to stay creative within constraints.

Typography

Strong typography takes your designs to another level. There are five ways you can improve your typography for UI Design :

1. Typescales

They help you keep the font sizing across your designs consistent. It is a guide that outlines all the font weights and sizing from the largest to the smallest. Developers can easily convert them to CSS styles and apply them across the product. It also makes it a lot easier to make global changes to text styles. Google's Material Design and type-scale.com have great examples.

2. Explore new fonts

Most Designers will have a favorite font. That’s not a bad thing but don't limit yourself to being comfortable with just one font style. Explore others. As you work with different brands, you will have to step out of your comfort zone to produce consistent results.

3. Install a contrast checker

White text on a bright purple background may be legible to you but illegible to a person that is visually impaired. As I mentioned earlier, a plugin like stark can help you make better decisions with color. The more accessible your design, the better the product.

4. Use Visual Hierarchy

This is essential when you have different texts close to each other that serve distinct purposes. Adding subtle differentiators like font-weight and size will make your UI less overwhelming for the user. The most important text should be the most prominent.

5. Explore Alignment

With the current minimalist trend, most texts are left-aligned. Exploring both center and left alignment will help you make better decisions when aligning text instead of just going with the trend.

Ultimately, what will make you stand out as a UX Designer is your process and the thought you put into the designs you produce.

Design Systems

Creating my first design system was a challenge. I was the only designer on the team. I had to figure it out. I started by understanding the value it brings.
When different people are working on the same product, there needs to be a consensus for the design language. That is the purpose of the design system. It is a guide that is based on the company’s brand identity. It shapes the look and feel of the product. A style guide on steroids. It covers everything from the colors and typography to components like buttons, navigation bars, and dropdown menus. Basically, it makes the product have a consistent look no matter who is working on it.

Creating a design system is a lot of work but you can start with the smallest steps. For your next project, I recommend creating a color palette, Typescale, Buttons, Text Fields, and any other components you might need to create the UI design. The goal is to try as much as possible not to deviate from the guides you have created for yourself.
If you can master this, you will have no issues working within the UX team of a larger company with an already existing Design System. To get a better sense of design systems check out these examples:

My Design Process

My process keeps evolving with time. The Design Thinking process was the first problem-solving approach I heard of. I found it simple and easy to use. It involved the following steps:

Design processes don’t have to follow a specific sequence. I jump between steps depending on what the project demands. I created a process that works for me;

Presenting Your Work

Presentation is all about storytelling. Describe your UX Design journey by highlighting the challenges and how you overcame them. End it with the key results or insights. Most of the time, your presentations will be in these two formats:

In stakeholder/client meetings

When I’m not designing, I’m presenting my designs to stakeholders via a zoom or teams call. Presentations make up about 30% of my UX Design workload. I have had my share of awkward presentations. The one thing that was common among them was my lack of proper preparation. Sometimes I was too occupied, other times I was over-confident.
Here are a few ways to improve your presentations.

Take Deep Breaths

Sounds obvious. I know. It supplies more oxygen to the brain which keeps you calm and focused. If you feel anxious, just before you start; try taking about 5-10 deep breaths as you exhale slowly. You’ll feel the difference.

Start with the User

Before showing the prototype; Give the stakeholders some context on the user to avoid confusion. If your product involves multiple user types, be sure to clarify from whom’s perspective you designed the prototype.

Design with Real Data

People learn by connecting the dots. By using real data, you’ll allow your prototype to speak for itself. You’ll also have less explaining to do.

Make Notes

You might have a sharp memory, but easy things can be hard to remember when you are under pressure. Make small notes of things you would like to highlight or get clarity on

Anticipate Questions

Thinking ahead of your stakeholders to anticipate questions they might ask is a huge plus. Even if you don’t have the perfect answer, you will at least not be caught off guard.

In a portfolio

My first portfolio was on Adobe, then I switched to a webflow site with a custom domain name. Having a website for your portfolio is not a must but definitely makes you look more professional. If cost is a constraint, there are free alternatives like notion or webflow (without a custom domain name). Regardless of your approach, your work must speak for itself.

Showcasing your work in a portfolio is all about highlighting your strengths. Recruiters or clients are not likely to read through every line of your case study. Focus on showing that you have a process for solving problems and select the right visuals that communicate it effectively. My formula is 60% visuals, 40% text. Before you find your niche, the best strategy for starting out is to include projects from different industries to show that you are versatile.  Overall three to four of your best projects are enough to show.

Dealing with Feedback

My designs are regularly subject to feedback or criticism from stakeholders and users. Feedback doesn’t always come in a constructive form. Don’t take it personally. You will need to develop tough skin so you don’t get demotivated. Use these tips to overcome negative feedback.

Design with Purpose

Have a solid reason for every design decision you make. It will help you have a more objective standpoint when defending your work.

Be open-minded

Even experienced UX Designers could have blind spots. Getting feedback from a different perspective can shed light on those areas.

Be Honest

There will be times when you know you made the wrong call. That's okay, it's better to learn and make progress than to argue for the sake of being right.

Detach

You are not your work. Feedback is only an opinion on it.

Agile Environments

Agile is simply an iterative approach to building products. In Agile environments, the team meets up periodically (daily, weekly or bi-weekly) for sprints to review progress, provide feedback and make necessary adjustments or changes. It can be pretty fast-paced but it provides opportunities to quickly identify and resolve issues with the product. Have a collaborative mindset and adjust to the company’s pace.

Coding

I never liked coding. Even though I had a background in IT, it has always been a struggle for me. However, I took the time to understand HTML & CSS by watching tutorials on youtube and taking a few courses on Udemy. Companies often have time and budget constraints and your role is not only to create awesome designs but also to create something that is feasible for the developers. Without an understanding of basic HTML and CSS, you could end up designing something that looks nice but makes a developer’s work necessarily difficult.  Feel free to push the limits but don’t go too crazy with the effects and animations.

Overall, a good understanding of HTML, CSS, and Javascript gives you the ability to collaborate effectively with developers. It is also a great competitive advantage if you are looking to get hired in today’s job market. You don’t necessarily have to write code, a basic understanding should be fine for starters.

A Day in the Life

UX Design is very fulfilling. I wake up each morning knowing I play a key role in my team. I have been working from home since March 2020. My day starts off with making a list of new or outstanding tasks. My team then meets for a daily sprint where we all give updates on our current tasks and address any challenges each person may have. For the rest of the day, I am either in a stakeholder meeting, presenting a prototype to gather feedback, or designing prototypes. I cross paths with lots of people from front-end and back-end developers to product managers and people in top-level management. Just like every other career, there are challenging days but 90% of the days are extremely chill. I spend my free time working on personal projects and creating content.

The Future of UX Design

In my mind, UX Designers are like architects. As long as engineers want to build structures, we will always be in demand. However, the landscape will change as technology advances. With the emergence of cryptocurrency, Web3, and the metaverse, there will be a high demand for UX Designers with a good understanding of these technologies to build new products that make it easier for the average person to use. Some areas worth reading about are NFTs, Smart Contracts, Defi, GameFi, AR, VR, and Web3. Start thinking of what roles UX Designers can play to stay ahead of the pack.

Leveling Up your Skills

Like everything else, practice and consistency are required. You don't have to be perfect. Get started today with any of the following challenges.

UX Research Challenge

Think of a problem you would like to solve. Come up with a tech product as a solution. It can also be an additional feature to an app or website you use. It can be anything. Try to follow a design process. When you create your prototype, stage a user interview with one or two friends or family members. It can be via zoom. Use the feedback you get to improve the design. The goal is for you to start thinking like a UX Designer.

3 UI Design Challenges

Let's Connect

Need some feedback on your project or portfolio ?

Share your Thoughts

Thanks for making it to the very end. I hope this book has been able to give you some value. I would like to know what you liked and what I can improve on. Please click the link below to share. Thank You

Drop some Feedback

Resources

Use the links below to find some useful tools and resources to start your journey

Book Recommendations

Books have played a big role in my self-taught UX Journey. Check out some of the books that have impacted me.

Level up your Knowledge

My UX Design toolkit

Youtube UX  channels I follow:

Written by Dami Osoba. ©2022