<img height="1" width="1" style="display:none" src="https://www.facebook.com/tr?id=1063935717132479&amp;ev=PageView&amp;noscript=1 https://www.facebook.com/tr?id=1063935717132479&amp;ev=PageView&amp;noscript=1 "> Bitovi Blog - UX and UI design, JavaScript and Front-end development

Design |

The Form & Function of Product Design

How do UX & UI work together to create a human-centered product design? Read this post to learn about product design fundamentals.

Eileen T. Ward

Eileen T. Ward

Twitter Reddit

Designer working at a computer creating a UX or UI design

Product design is a necessary part of the product development process. Although design might necessitate some level of creativity and an understanding of visual arts, design and art are not synonymous. Where arts are meant to express, designs are meant to function. This post explains the basics of creating a high quality product design.

Human-Centered Design

When designs are intended to serve people, it’s best to employ human-centered design principles. Human-centered design focuses on five key elements:

  1. Preferences
  2. Needs
  3. Problems
  4. Pain-points
  5. Goals

When a designer has these in mind, they’re able to design a product (or system) that adds to the human experience, rather than distracting from it.

Form & Function of Product Design

You might have heard the phrase “form follows function.” Well, that’s a great way to understand and break out the major parts of product design. Let’s start with form.


An interface is the “face” of a product, the part with which a user can interact. Even physical products have interfaces: think of the steering wheel in your car or the knobs on your stove. When it comes to digital products, like the ones we help our clients build, interfaces are the pages of an app or website (the stuff an end-user can see).

UI design stands for user interface design. UI designers are often talented visual designers who are familiar with best practices in composition, color theory, and typography. Unlike graphic designers, UI designers also understand interaction design.

A UI designer should be able to deliver high-fidelity interactive prototypes. Clicking a mouse isn’t the only way to interact with a digital product interface—a user can scroll through a page’s content, move their mouse pointer around, hover on certain objects, move from page to page, highlight information, use face-ID or touch-ID features … the list goes on and on.

But how does a UI designer know what to put on the page? Who decides what information should be displayed, and how, and when, and where? Who is responsible for the way the interface functions? Enter UX Design.


UX design stands for user experience design. An experience includes how the user interprets information and makes decisions to move through a process and ultimately achieve their goals. UX designers (sometimes with the help of UX Researchers) employ discovery methodologies to engage with users (customers) and stakeholders to identify the preferences, needs, problems, pain-points, and goals necessary to developing a human-centered design.

UX Designers are excellent at quickly synthesizing all of this data so teams can proceed to the ideation phase. During ideation, UX designers brainstorm possible solutions and work with product teams to define feature sets and scopes. From there, UX designers can start sketching out rough, low-fidelity wireframes. UX designers would then collaborate with UI designers to build prototypes that make their proposed solutions shine. Design phases are ideally iterative and agile in nature, collaborating with development teams to deliver work smoothly.

Product Design Reduces Business Risk

Great product design should rapidly produce prototypes that can be used during user testing and validation. When teams test products early and often, they avoid spending time and money building the wrong thing, therefore reducing business risk.

Product Design Teams

While not all companies are resourced to support a cross-functional product design team, human-centered design comes to life (pun intended) when it's supported in each aspect of the design process.

Research, UX design, and UI design all belong under the umbrella of digital product design. These roles aren’t mutually exclusive—there are amazing UI designers who are also great at research, researchers who also have a knack for UX. Regardless of who wears the hat, product design teams are responsible for researching, building, and testing the face of the product.


When you know there’s a problem with your product, but you’re not sure what’s wrong, you might need research. When you know what the problem is, but you’re not sure how to solve it, you might need a UX designer. When you know the solution, but you want to polish it and make it beautiful, you need a UI designer.

When you’re ready to build an amazing, human-centered product that addresses the preferences, needs, problems, pain-points, and goals of your user, you need a product design team.