In a nutshell
What do we do in UX and UI Design? In this article I list the characteristics that are at the base of this profession from user studies to final prototyping through the most common tools.
This article is part of another ⚠️
If this is your first visit here, welcome 👋 . Please note that this article is part of a more global one: Getting started in UX/UI Design, a comprehensive guide. Although it is not essential, I still recommend to start there first if you are new to UX/UI Design.
Table of contents
- Who does what?
- What does a UX Designer do?
- What does a UI Designer do?
- And the UX/UI Designer?
- Stay flexible (but not too much)
Who does what?
In the previous article, we clarified the meaning of the different job titles, now it’s time to go into more detail.
The following lists are of course not definitive, the domains evolve and depending on your position, you will have to use some of what I list below. Especially for the tools, they are not exhaustive, there are many tools for each need and new ones appear regularly.
Note: keep in mind that you will certainly be doing UX and UI, as a UX/UI Designer. But that doesn’t mean you’ll have to be an expert in UX and UI, that would be a lot, and in reality, not many people can boast that. I’ll talk about that again in this article.
In complement to my experience, I analyzed many job postings to see the skills required based on the title for the position. You can see the raw data here: UX UI Job offers list (you’ll find them in other articles of mine).
About the links
For some items in the lists, I’ve linked to a resource like a blog post to dig into the topic. To complete the list, I recommend my free book where I list many resources to learn UX/UI Design.
What does a UX Designer do?
The UX Designer is close to the users in order to understand them and produce adapted solutions. Among other things, he must show empathy and enjoy solving problems to help people. Knowledge in psychology and sociology will be welcome. He must also know how to adapt and be a good communicator.
Skills
- Psychological principles of UX
- Common UX patterns
- Handling and analysis of raw data
- Production of basic UX assets
- Information architecture
- Usability and accessibility
- UX microcopy
- Understanding of project management methods (Lean, Agile, Design Sprint etc.)
- Knowledge of UI
- Understanding of closes professions (UI Designers, product manager, developers, marketing etc.)
Tasks
- Keeping up to date with trends and news
- Competitive analysis
- Research and user studies
- Product or service structure
- Creation of wireframes and low fidelity prototypes (more infos)
- User testing
- Coordination with UI Designers and developers (and project stakeholders in general)
Soft skills
- Creativity
- Observation
- Communication
- Curiosity
- Self-education
- Empathy
Tools
- Data processing: Excel, Google Sheet, Notion, Airtable
- Documents: Google Docs, Notion (or whatever, but if it’s collaborative, it’s better)
- User research: Typeform, Google Forms, User Interviews, Respondent
- Sitemap, userflow and other diagrams: Miro, Diagrams
- Wireframes : Figma, Adobe XD, Sketch (if little time is allocated, they can do the trick on paper, but on a software it will save time to the UI Designer)
- User testing: Maze, User Testing, OneClickTest (to test a prototype)
- Analytics: Google Analytics, Hotjar
- User’s feedbacks: Canny, UserVoice, Hotjar
Below are some non-exhaustive examples of deliverables produced by a UX Designer:
About the texts
The UX Designer can take care of microcopy (e.g. the label of a button) but for longer texts (“copywriting” or “macrocopy”) it will rather be the marketing team and/or a copywriter, because it is a separate skill, especially in the context of a website for example which often has more text than a mobile application.
What does a UI Designer do?
As we defined before, the UI Designer will start from the work of the UX Designer (most often the wireframes) to dress and shape the product with the mockups. If we were talking about a house, the UX Designer would be the architect and the UI Designer, the decorator. Among other things, he must show visual creativity, empathy and good knowledge in the rules of UI Design (colors, typography, accessibility, types of components, etc.).
Remember, I’m talking about a UI Designer who works only on GUI types (see How to define UI?), but in general, the tasks are more or less the same for the other types of interfaces.
Skills
- UI Design foundations
- Colors
- Spacing and sizes
- Typography
- Icons
- Media types and their uses (photos, videos, illustrations etc.)
- How the different screens work
- Layout rules
- Grids, columns and rows
- Layout of components
- Responsive design
- Design constraints and rules for iOS and Android
- Knowledge of the main styles in UI Design
- Good practices
- Usability and accessibility
- Design principles (consistency, simplicity, hierarchy, balance)
- Common UI patterns
- Micro-interactions
- Understanding of project management methods (Lean, Agile, Design Sprint etc.)
- Knowledge in UX (at least wireframes)
- (Optional) HTML/CSS knowledge
- Understanding of closes professions (UX Designers, product manager, developers, marketing etc.)
Tasks
- Keep up to date with trends and news
- Visual analysis of competitors and similar products.
- Creation and maintenance of a styleguide (or a design system).
- Creation of mockups (non-interactive screens)
- Medium and high fidelity prototyping (mockup with interactions and animations, more infos)
- Testing of prototypes with users.
- Preparation of assets for development.
- Coordination with UX Designers and developers (and project stakeholders in general)
Soft skills
- Creativity
- Observation
- Communication
- Curiosity
- Self-education
- Empathy
Tools
- Prototypes: Figma, Adobe XD, Sketch
- High fidelity prototypes: Protopie, Principle (these tools allow to make prototypes even closer to the developed product). Or simply in HTML/CSS
- Assets (icon, illustration, etc.): Illustrator/Photoshop, Affinity Designer
- Management of inspirations and favorites: Eagle
- Design system : Zeroheight, Storybook, Notion, Figma
- Asset optimization: Optimage, Online-convert
Below are some non-exhaustive examples of deliverables produced by a UI Designer:
And the UX/UI Designer?
But then, a UX/UI Designer does the work of two people? No, because for example, he doesn’t do the whole UX methodology, that would be too much work.
I voluntarily listed first what a UX Designer and then a UI Designer do, but keep in mind that as a UX/UI Designer, you will have to do tasks in both areas, with a more or less UX or UI focus depending on the position.
In some companies (large ones in general), there are people who only do UX and others who only do UI, because if each topic is explored in depth, there’s plenty of room to specialize.
But of course, many startups and medium-sized companies have UX/UI Designers who work on both sides. Without putting in place all the practices of both domains, for reasons of time and budget, so we apply the minimum of methods, in order to release minimum viable products quickly.
Stay flexible (but not too much)
It’s actually almost impossible to define exactly what all UX/UI Designers on the planet will do, keep in mind that due to the youth of the profession, it’s likely that for example, you’ll be doing some HTML and graphic design, depending on your skills. That said, if you do more tasks outside of UX/UI Design, then your job is not well understood by your company.
We’ll see this later with the article on the job market and some offers that require way too many skills for a UX/UI Designer.
To keep the momentum going
After reviewing the UX and UI Design skills, let’s see how they are used in practice with a real-life situation:
Doko Zero
UI Designer with UX and web development skills