Guide to Digital Design — Introduction to UX & UI | Bornfight

The constant growth of the tech industry and advancements in mobile technology have moved human-computer interaction into all areas of human activity — we use digital devices and products on a daily basis. This made digital design one of the most advanced and fastest-forming industries in the world, and design is no longer just about what we see, but about how we feel when using different systems, devices and digital products.

What is digital design?

Digital design covers a wide range of different disciplines and roles, but its main aspect is the interaction of humans with a digital device or a digital interface. Two main parts of digital design are User Experience design (UX) and User Interface design (UI). A digital designer is creating both the user experience and the look and feel of a digital product. “Designing screens” is just a small part of it — the main focus is on the needs of real people, usability aligned with the problems of real personas, and definition of the minimum functionality needed to enable those people to fulfill their purpose with the product we are designing. This means that digital design involves a lot of in-depth techniques like user research, creating personas, wireframing, user testing, sketching, creating prototypes and storytelling.

I came across one great analogy about UX, UI and coding, so let me share it with you. If you imagine a digital product as the human body, the skeleton represents the code and it gives the body a structure. The organs represent the UX design, as they measure, optimize and support all life functions, and UI design is represented by the visible part of the body — its presentation, its senses, reactions and the skin itself. And the main conclusion is — one can’t function without the other.

Let’s dig deeper into UX and UI!

What is UX design?

Every product that is being used by someone has its own user experience — from a coffee cup, table and lamp, to a hairbrush, deodorant, or a skateboard. As designers can influence the user experience of the physical objects when designing them, they can also influence the experience of the digital products. The field of user experience focuses exactly on that — maximizing the pleasurable, satisfying, efficient, motivating, and productive aspects of using a physical or a digital, system-based product. 

User experience encompasses all aspects of the end-user’s interaction with the company, its services, and its products.

— Don Norman, Cognitive Scientist & User Experience Architect

The first mention of the term UX was in the 1990s by Dr. Donald Norman, an electrical engineer, cognitive scientist and user experience architect at Apple. He emphasized the importance of user-centered design — a design process based on the needs and goals of the user. He introduced the term “user experience”. For Norman, the term “user experience” presented all aspects of a person’s experience with a system, product or service — from the materials, shape and feel, and the interaction itself (physical or digital), to the look of the interface, colors and quality of the product.

User experience is one of the main factors that decide if a digital product will disappear from the market, or if it will become profitable and record big sales. When developing digital products and devices, many factors distract designers from the most important ones — creating products intended for the end-user. The multidisciplinary field of user experience design is based exclusively on that — the user is in the center of attention, and the main purpose of the product is to be created to fulfill the wishes and fit the needs of the user for whom the product is intended. That is why UX designers come from a variety of backgrounds such as graphic and visual design, art, science, sociology, psychology, programming and interaction design. If a digital product is easy and intuitive for the user to use, and allows him to easily fulfill his desires and goals using that product, we can say that the product has a well-designed user experience.

UX designers combine different methods and approaches to fully understand the users’ needs. Other than designing the product functionalities, UX designers are working on user research and participating in the process of planning a strategy to create products and services with great user experience — they are the knot that brings together the goals of the business and the needs of the users. If a business doesn’t understand the needs, goals and wishes of the users that will use their product, they will have a product that won’t have value, and that will, in the end, fail, and all the money spent on it will be wasted.

The most important thing for a designer is to create a product that fits both the user’s and the client’s needs. To make the digital solution work for the end user, it is extremely important to combine all insights to a full story — from marketing and branding to visual design and usability. UX designers need to find an answer to many questions about the user and product, but the main questions are why, what and how. 

• Why is the real person motivated to use the product?
• What is the purpose of the real person that our product needs to support? 
• How can a real person fulfill his/hers purpose by using the product in the most simple and usable way possible?

These are all questions that need to be answered in order to create a product with a good user experience that fits the users’ needs.

Main disciplines of UX design

There are 4 main disciplines of UX — Interaction design (IxD), Information architecture (IA), User research (UR) and Experience strategy (ExS). 

1. Interaction design — creating a product or a system that is easy to use and navigate through is what interaction design is all about (buttons, page transitions and animations are the main parts of it)
2. Information architecture — this part of UX is focused on organizing content and information in a meaningful way that users can understand and easily navigate
3. User research — to design the perfect solution, the real problem needs to be defined, and the best way to understand the users’ problems is to create personas, conduct interviews with users and do usability testing
4. Experience strategy — its main role is to connect both the users' and clients' needs and reflect them through business strategy

No product is an island. A product is more than the product. It is a cohesive, integrated set of experiences. Think through all of the stages of a product or service – from initial intentions through final reflections, from first usage to help, service, and maintenance. Make them all work together seamlessly.

— Don Norman, inventor of the term “User Experience”

What is UI design?

User interface is the point of interaction between the user and the digital product or device — it can be a touchscreen on your mobile phone, a touchpad on a vending machine, interface on some online platform you are using or even a website URL. Everything your person will see and use to fulfill her or his purpose.

UI designers work on translating discovered user needs into usable interfaces by designing all visible elements and interactions to fit the need of the persona. To do this, they need to choose things like the right typography, colors, put the right buttons at the right place and make sure the interactions are making sense for the flow. UI designers create attractive and responsive interfaces that are easy to navigate through for users, and that they can use intuitively without a lot of thinking. 

UX is focused on the user’s journey to solve a problem; UI is focused on how a product’s surfaces look and function.

— Ken Norton, Partner at Google Ventures, Ex-Product Manager at Google

UI design elements

In UI design, it is important to be consistent and predictable when designing and choosing user interface elements. When UI elements are chosen wisely, they help users navigate through pages, accomplish their goals and actions, and convert them into loyal customers. Some of the most common user interface elements are input controls, navigational components and informational components.

01 Navigational Components 

Navigational components help users navigate through the website, product or an app, and they include icons, menus, search bars/tabs, pagination, breadcrumbs, sliders and tags.

02 Input Controls 

Input controls allow users to put needed information and they come in many forms such as checkboxes, combo boxes, buttons, toggles, dropdown lists, list boxes, radio buttons, text/password fields and date and time pickers.

03 Informational Components

Informational components are there to help users receive information while using the product, and they include notifications, tooltips, icons, progress bars, alerts, message boxes and pop-up windows.

04 Containers

The main purpose of containers is to hold related content together as they can include a large amount of information in limited space, and the best examples of this are accordions, widgets and sidebars.

Principles of UI design

Visual design, typography, information architecture and copywriting — all of these disciplines are part of interface design and UI designers should keep in mind while designing for screens. There’s a lot of UI design principles that need to be considered both from UI and UX designers, and now we will look further into some of the most important ones.

01 User-centered approach 

The main focus of user interface design is the user, and the main goal is to create an environment that is intuitive and easy to navigate. To accomplish this, designers often conduct user interviews — to find out more about this topic, check out this blog!

02 Clear and simple design

Successful interaction is the main part of UI design, and to use the interface effectively, users need to understand it fully and predict what will happen in their interaction with the digital product. The interface should be designed in a simple and clear way so that users can feel comfortable while using it. 

03 Minimized number of actions on screen

When designing multiple screens, you should minimize the number of steps and actions by focusing on one primary action per screen. Leave other actions as secondary ones, or if it’s an action that gives an enormous value to the user, create another screen for it. 

04 Consistency & familiarity

When things behave the way they’re expected to behave, people feel comfortable. If something looks like a link, and users click it, it drags them over to another page, that’s when they feel safe and trust you and your product. Users should be able to predict how an interface element will behave simply by looking at it, and that’s what makes a good design. 

05 Be intuitive — Don’t make users think

The best design is the one that goes unnoticed by users, it’s invisible. When users accomplish their goals on the website or through an app without any difficulty and errors, that means that their focus wasn’t on the interface and its complexity, but on their own actions and mission. 

06 Be forgivable & give feedback

How many times have you accidentally clicked something and then get stuck while figuring out how to undo your last action? This is something that happens very often, and designers need to have that in mind while designing interfaces. Allow your users to make mistakes and correct them afterward, make actions reversible and don’t let them stress about it. Also, it is important to provide useful feedback to your users after taking an action — to confirm your users that their action is completed, use pop-up notification or micro interactions.

07 Accessibility & Flexibility

When designing for screens, accessibility issues should be taken into consideration as they can affect the users' behavior and experience. There are many users with vision impairment or color blindness and they can have problems when using screen devices such as laptops or smartphones, and designers should also adapt their design for multiple different screens and platforms. Design should be flexible to work on any device or a platform and provide the same values to different users.

The future of digital design – what’s next?

The rapid growth of technology affects many areas and industries, and because of that, design is constantly evolving and changing. Some tools that designers use today on a daily basis didn’t even exist a couple of years ago, new ones are constantly being created and they are replacing the old ones, or even replacing a few of them at the same time. With that in mind, it’s important to stay on track with tech trends and think about the future of design and all the possibilities and challenges it will bring both to users and designers. 

If you don’t consider the future of design, you’ll get left behind. A couple of years ago, designers were designing CD players and mp3 players, and nowadays they’re designing UI for Spotify, Deezer and Apple music. Designers need to be adaptable and continuously work on improving their skills based on the growth of technology and new trends. The same thing applies to businesses and companies — if they’re not aware of changing trends in the industry, they’ll create products that no one will want to use, and they’ll go down the drain together with all the investments. 

Everything mentioned above comes down to this — design is live, and it keeps evolving and adapting to new technology trends and users’ needs, but one thing is sure — digital design is just at the beginning of its journey and we can’t wait to see what is coming next.