08

UI & UX Design
SWE4834

Key Frameworks in UX design

Source:
https://www.linkedin.com/pulse/5-types-design-frameworks-mohab-abdelrahman/
https://www.interaction-design.org/literature/topics/ux-design
https://www.interaction-design.org/literature/topics/design-thinking

1
 Key frameworks in UX design

● User-Centered Design

● The Five Elements of UX Design

● Design Thinking

● Lean UX

● Double Diamond

2
User-Centered Design

3
 User-Centered Design
Puts the user front and center. Focusing on user’s mean, considering their story, emotions, and the
insights you’ve gathered about them. Sometimes it requires comparative analysis of similar products and
always employes a lot of researches.

The key steps in the user-centered design process:

● Understand how the user experiences the product or similar products. You want to know how users
will engage with your design, as well as the environment or context in which they’ll experience the
product. Understanding this requires a lot of research, like observing users in action and conducting
interviews, which we’ll explore more later.

● Specify the user’s needs. Based on your research, figure out which user problems are the most
important to solve.

● Design solutions to those user problems. Come up with lots of ideas for designs that can address the
user problems you’ve identified. Then, start to actually design those ideas!

● Evaluate the solutions you designed against the user’s needs. Ask yourself, “Does the design I
created solve the user’s problem?” To answer this question, you should test the product you
designed with real people and collect feedback.
4
The Five Elements of UX Design

5
 The Five Elements of UX Design
These are the steps a designer takes to turn an idea into a working product. The five elements are, from
bottom to top: strategy, scope, structure, skeleton, and surface. Think of these as a set of five layers, where
each layer is dependent on the one below it.

● Strategy: The bottom layer is strategy, where you lay a foundation of your design goals. These goals
are based on user needs and the business objectives for the product.

● Scope: The next layer is scope, where you determine the type of product you’re building. At this
point, you will consider the kind of features and content you want to include in the product.

● Structure: The middle layer is structure. Here, you’ll figure out how to organize your design and how
you want users to interact with the product.

● Skeleton: The skeleton is the layout of the product. the skeleton layer details how your design works
– and like a skeleton, users won’t directly see its inner-workings.

● Surface: The top layer, surface, represents how the product looks to the user. The surface represents
the interface that users view and interact with. Think of the surface like the clothes or makeup you
wear that are visible to the outside world.

6
7
Design Thinking

8
 Design Thinking
Design thinking is a user-centered approach to problem-solving. It helps designers create solutions that
address a real user problem and are functional and affordable. There are five phases in the design process:
empathize, define, ideate, prototype, and test.

● Empathize phase: The goal is to understand users’ needs and how users think and feel. This involves
a lot of user research, such as conducting surveys, interviews, and observation sessions, so you can
get a clear picture of who your users are and the challenges they are facing.

● Define phase: Create a clear problem statement, a description of the user’s need that your designs
will address, based on your research findings. This will drive your team toward a clear goal for the
design of the product.

● Ideate phase: The goal of ideation is to come up with as many design solutions as possible.

● Prototype phase: A prototype is an early model of a product that demonstrates its functionality.

● Test phase: Users provide feedback about your designs, before the product is built by engineers and
launched to the public. You can use this feedback to make changes and improvements to your
designs, as many times as you need.

9
Lean UX

10
 Lean UX
The Lean UX process focuses on reducing wasted time and resources, and producing a workable product as
soon as possible. The process is iterative, meaning the team continues to update and make revisions to the
product as they gather user research and stakeholder feedback. The Lean UX process is broken into three
steps:

● Think. Explore the problems that users are experiencing and consider how you could solve them with
your design. This step is all about gathering research, so you can form a clear idea of who the product
is for and how it will help them.

● Make. Start designing the product by creating sketches, wireframes, and prototypes. You’ll also
create a minimum viable product, or MVP for short, which is a simple prototype of your designs that
you can test with the target audience. Be prepared to go back and update your prototype as you
gather feedback!

● Check. Find out how users respond to your design and gather feedback from project stakeholders.
Make adjustments to your designs accordingly, and repeat the three steps again, if necessary.

11
Double Diamond

12
 Double Diamond
Double Diamond is a more traditional UX process, which breaks down UX design into two main phases (or
“diamonds”): research and design. Each phase has two steps. When combined, these are the four steps:

● Discover the problem. Gather information about potential issues users are facing.

● Define the problem. Filter through the data, and focus on the main issue your product aims to solve.

● Develop solutions for the problem. Begin designing your product as a work in progress. This is where
wireframes and prototypes come into play.

● Deliver the product. Review and test your product to prepare it for release.

13
14
15