7 Design Constraints Examples. What Is a Design Constraint?
- What is a design constraint?
- What are the design specifications?
- What are the differences between design specifications and design constraints?
- Our experience in design constraints management
Working on a design is not always a pleasurable and creative process, as every designer has to deal with design specifications and constraints regularly.
Not following them can easily lead to insufficient interfaces, lack of usability, or the impossibility of implementing the created design for a project.
Experienced designers always have design specifications and constraints in mind when they think of any interface. However, at the start of one’s career, it’s fairly easy to fail at creating a design when you don’t know enough about the project you start working on.
From the client’s point of view, taking time to research the design constraints before providing a task for the designer might seem unnecessary. He even might not think why a designer needs to know the constraints.
On the other hand, after the design is approved, and a client already envisions how it will look for an end-product, be it an application or a website, he might forget to include the specifications when providing a task for a developer. And the design might be ruined as a result.
But first things first. Let’s explore the differences between design specifications and constraints. How are they different, and what is the purpose of both?
What is a design constraint?
A design constraint is a limitation that lets the designer know what can or cannot be done in a design. Design constraints serve both as limits that define budget, resources, ETA, or format in which the design should be provided. In some cases, design constraints serve as self-imposed guidelines that allow the designer to create work of higher quality.
There are several types of design constraints that define the limits. Let’s briefly overview each of them.
Commercial constraints
Commercial design constraints examples would be limited budget, set ETA, and deadlines (especially important when the design is only a part of the full AGILE project cycle). These are the basic constraints that are important to know for every designer and client at the very start of the collaboration.
What Is UI / UX Design? Read the article.
A designer should know when the client needs a ready project, and if he’s ready to purchase additional fonts, icon sets, illustrations, etc., to create a design – before the actual start of work. Otherwise, there’s a chance the design won’t be delivered on time, or the client won’t be able to afford the resources the designer has used in his work.
Functional constraints
This type of constraint goes without saying when you provide a task for a designer because otherwise there might be problems with design implementation in later stages.
Functional design constraints examples are image formats (SVG, or PNG), and screen resolutions (some elements might look tiny on smaller screens, or a designer might use gigantic fonts thinking of application interface while in truth he’s creating a desktop version).
There might also be constraints connected to the logic that’s possible in an application, or, on the contrary, should be avoided because of difficult implementation.
It’s always better to consult with the actual developer for clear guidelines to provide the designer with all the necessary information before he starts work on a project. That will guarantee that both the developer and the designer will work in tune.
Compliance constraints
Bringing into focus compliance design constraints examples, we think about laws and regulations. For example, when one uses images on a website, he should think about image licensing.
If the image comes under a Creative Commons license, also known as CC0, this means you can use it for free and even build upon an image something other than what was there initially.
There are different types of licensing, some of which restrict using illustrations or fonts in commercial projects, etc.
When the designer works on a specific project, he should look into the licensing constraints and learn if he can use specific resources or not.
Style constraints
The style design constraints examples are a brand book or specific guidelines created for the product, which demand the usage of pre-defined fonts, icons, logos, images, proportions, etc.
Nearly every brand nowadays has its brand book, and it’s a good practice to let an outsourcing team know of the style constraints beforehand. This will grant that the client receives the end work that not only is functionally sufficient but represents an idea behind the brand.
Sensory constraints
Speaking of sensory design constraints examples, we mean the constraints that are not directly related to the brand book or style guide (which is related to the color scheme, fonts, logo, etc.).
Some brands are tightly connected with sensory feelings, like softness (if it’s fabric) or flavor (if it’s a food brand). Sometimes it’s even a specific emotion that makes the brand stand out from others. All these factors can be introduced in the design concept, so it’s a good thing to let the designer know about them.
Usability constraints
These are the constraints that will ensure the design works perfectly for a specific purpose. For example, if it’s a mobile app interface, here we should think about the rule of thumb in combination with the principle of least astonishment.
In other words, no matter how vivid the design is, it wouldn’t astonish the user. The simpler it is to use, the better, and the lower the learning curve.
What are the design specifications?
A perfect design specification example is a mobile mega menu that closes when someone clicks sideways if there’s no “close” button.
When the developer implements the design he can’t see how the mega menu should be closed, so he just won’t think of a way to close it. If the designer doesn’t let the developer know about this option, it will be easily missed or misinterpreted.
Another example of design specification is a tooltip that’s seen only on hover. It isn’t shown in a primary design or is shown but there’s no way to guess one should hover over an element to see it.
Also, read about free resources to begin learning UX design.
Some clients don’t think that design specifications are important enough and just let the developer decide on the way of implementing the interface.
But without the specifications given by an actual design author, it’s easy to miss something. And the consequences might vary from insignificant (like a missing hover effect) to drastic (like the lack of functionality and broken navigation in a menu).
What are the differences between design specifications and design constraints?
At first glance, they look similar, yet they are not.
A design constraint is a piece of information you provide for a designer to let him do his job. A design specification is what a designer provides you with, letting developers know about the effects, navigation principles, hidden logic, etc.
In Coreteka developers work hand-in-hand with designers, so there’s no chance to miss anything. We have been developing web and mobile applications for years. Please contact us for any project if you wish us to handle the task for you.
Also, you can read about tips for writing a web design RFP.
Our experience in design constraints management
To make sure your design project aligns with your expectations, we plan all of crafting the website’s look and interfaces in advance. For this, our team always turns to business analysis, a process that helps us pinpoint the tasks your application needs to tackle.
What’s more, our team boasts designers with over 7 years of hands-on experience. This means they’ve got a solid grasp of every essential UI/UX principle–from handling tight budgets to curating visual elements that match your company’s corporate style. Plus, we consistently follow top-notch interface design practices, focusing on simplicity, responsiveness, and adaptability.
If you are curious about how design projects are developed in our team, visit our Case Studies section, where the work on each project is detailed.
