Overview of UI/UX Design for Website and Mobile App

The term “UI/UX design process” was first introduced in the late 1990s by renowned designer and psychologist Donald Norman. Since then, extensive research across various fields has been conducted to leverage this concept. He once said:

“I invented the term because I thought human interface and usability were extremely good. I wanted to cover all aspects of a person’s experience with a system, including industrial graphic design, interface, physical interaction, and user manuals. Since then, the term has spread widely, to the point where it starts to make sense.”
— Donald Norman

Donald Norman’s words are sufficient to understand the value of a systematic and effective UI/UX design process to build user interfaces for end users. When Apple designed its first product, it paid close attention to the design process. Later on, Apple’s approach became a benchmark for tech giants like Microsoft, Hewlett-Packard, etc.

Today, design plays a crucial role in product development. It’s what differentiates companies and provides a competitive advantage.

When designing a website or a mobile application, always consider who the design is for. From there, we can better define the product’s objectives and develop the most optimal design approach.

In this article, I will provide an overview to help UI/UX designers create products with the best user experience. I will start with a basic definition of product design, followed by breaking it down into stages such as research and analysis, ideation, and the design process.

What is Product Design?

Product design is a process of identifying user needs and goals, clarifying the problems they face, and proposing realistic product development solutions.

Design thinking is the foundation of the entire process

Always approach with a human-centered mindset to innovate by integrating human needs, technological capabilities, and business requirements to drive product success.

When discussing a product or feature, we should understand the intended use and answer the following questions:

• What problem are we solving?
• Who is facing these problems?
• What are we aiming to achieve?

Answering these questions helps us understand the user experience beyond just the design visuals.

Design Process

With an understanding of design thinking, let’s define the design process. The design process is a series of steps followed by product teams to build a product from start to finish. A well-structured process is crucial for two reasons: it helps maintain focus and stay on track.

Although there’s no one-size-fits-all process for every project, a typical product design process includes the following steps:

• User research and analysis
• Design ideation
• Design
• Post-design activities

1. User Research and Analysis

Once the product goal is defined, we need to study and research the target users. Without understanding the users, how can we create a product that suits them?

Effective user research helps uncover user experiences and needs. This directs the style and techniques used in the product design.

There are various methods to conduct user research—for example, conducting guided surveys or gathering statistics. Other techniques exist but will be discussed in detail in separate articles.

2. Design Ideation

This stage requires all project members to brainstorm, discuss, and propose design concepts. The focus here is not to create actual designs but to hypothesize and finalize the most suitable approach for the current product.

How users will interact with the product

User journey maps help us understand how users interact with the product. They reflect a sequence of actions users perform to achieve a goal.

User stories describe what users want to achieve through the product. Typically structured as: someone performs an action to accomplish or solve something.

Product Structure Design

The product structure helps generate design concepts that are more accessible to users. It provides a view of the product’s form before it is developed, allowing proper design segmentation.

3. Design

From the agreed-upon ideas, we proceed to product design.

Wireframe Design

Wireframes outline the structure of a page, its hierarchy, and key elements. They are used to discuss ideas among team members and stakeholders and guide designers and developers. Wireframes act as the product’s skeleton.

Product Design

After the ideation stage, both design and development teams should have a clear understanding of what they want to build. In this phase, the product team begins designing solutions to solve customer problems.

4. Post-Design Activities

Testing & Feedback

A good designer doesn’t stop at completing the design. The testing and validation phase ensures that the design concept works as intended. This phase includes:

• Testing with the development team.
• Testing with actual users.

Maintenance and Improvement

A product launch doesn’t mean the design process is over. In fact, it continues as the design and development teams study user behavior and release updates to improve the product continuously.

Conclusion

The above roadmap summarizes the fundamental steps in starting a UI/UX design project. Stay tuned for the next articles in this series for more detailed insights.

Reference: aufaitux.com
	Lê Việt Á UI/UX Designer