Skip to main content

Questions tagged [design-system]

The tag has no usage guidance.

Filter by
Sorted by
Tagged with
1 vote
1 answer
43 views

I'm creating a detailed component spec for an input field in iOS and I don't know exactly how to specify certain accessibility details

I'm building a detailed accessibility spec for an iOS input field component for a design system. I want to outline in the spec how voiceover should work. The design system needs an input field that ...
keganonyous's user avatar
2 votes
6 answers
254 views

Will a Global Design System improve accessibility of web applications?

I read Brad Frost's post on A Global Design System with interest. After all, Atomic Design is one of the most popular concepts in UI Design since Bootstrap came out years ago, and there hasn't really ...
Michael Lai's user avatar
  • 27.3k
0 votes
2 answers
179 views

Is skeuomorphic design out of style? [closed]

Is skeuomorphic style out of fashion? Is it necessary for design system to have skeuomorphic style for other elements in the system? Is flat design not in trend anymore?
NB4's user avatar
  • 2,501
1 vote
0 answers
38 views

How to initiate designing a iPaas Product from scratch? [closed]

As a Product designer working in an iPaas company, I have worked on various features of the product. On both the scenarios like designing a new feature and also improving the existing features. The ...
swagstruck's user avatar
1 vote
1 answer
54 views

Checklist for merging changes in a Figma branch of a Design System library

Does anyone follow any checklists when reviewing and approving branch changes in a design system library and if so, what kind of things would you check to maintain quality in your design system.
Not My Problem's user avatar
1 vote
1 answer
53 views

Adopt or create new design system

Would it be a best practice to recreate a new design library made of only components we used or just use this big library? The team bought a design system library in Figma that is comprehensive but we ...
Izy's user avatar
  • 11
2 votes
2 answers
618 views

What is a Pattern that is part of the Design System?

I am researching Patterns and I am confused by the following definition. Patterns are reusable combinations of components that solve common user problems. These best practice solutions help users ...
ardacarofficial's user avatar
1 vote
2 answers
132 views

Should the components be drawn in the Design System?

I wanted to investigate what an design system is, but there is a part I cannot understand. In design systems, buttons, forms, that is, every component we see on the website or mobile application is ...
ardacarofficial's user avatar
2 votes
1 answer
74 views

Alert message component variants

I work in an e-commerce platform and we recently had a lively discussion about the variations of our alert message. Would you agree that it is useful to have different versions of an alert or would ...
Helge's user avatar
  • 73
1 vote
2 answers
448 views

Do I need to follow scale while defining typography in design system?

I'm confused if I should use scale or not while defining our typography. While using it I'm not able to use 14px and 16px at the same time plus it's giving font sizes like '16.80'(just an example) and ...
Kritarth's user avatar
  • 126
2 votes
1 answer
196 views

UI: Why not negative elevations?

Since Material Design came to the surface, we "learned" to design according to 3D planes based on the sheets metaphor. This replaced flat design, which in turn replaced skeuomorphic design. ...
Devin's user avatar
  • 38.1k
1 vote
3 answers
284 views

Is it a good practice to display only one tab

Working on an experience where there are multiple tabs that have forms in them, but they show up only if a user has selected to fill them. There is one form and thus tab by default. Is it a good ...
harshikerfuffle's user avatar
1 vote
1 answer
137 views

Persistent Rich Tooltips

Material Design has rich tooltips which can also be persistent. As it's explained here, these tooltips: remain active even when leaving the target region can contain links only disappear once you ...
fury's user avatar
  • 145
0 votes
1 answer
467 views

Scalable naming convention for ordinal sizes?

Hopefully this is a good place for this question. I'm trying to put together concepts for a Design system, and I have a stumbling block on naming tokens. Essentially, when I've got elements that are ...
turpentyne's user avatar
0 votes
3 answers
1k views

Using Display S, M, L, XL, 2XL instead of H1 -H6 for typography in a Design System Manager (DSM)

I find using specific H1 - H6 is confining since different pages may need a different size H1 and so on. Also instead of making 2 sets for desktop and mobile this would work as one file. Does anyone ...
Keano's user avatar
  • 71
3 votes
3 answers
888 views

What can be the strategy to build a Design System?

I often wonder whether it should be a component first approach or what exactly should be the strategy to build a design system.
veteran's user avatar
  • 53
0 votes
1 answer
69 views

How to give name while creating Typography in Design Systems?

How to give name while creating Typography in Design Systems? which of the following is most common when naming typography?
 System default typography naming. (or) Create your own set of naming.
 ...
Saba's user avatar
  • 1
0 votes
2 answers
845 views

APCA (WCAG 3.0) does not allow for 14px font to be used as a regular base

According to APCA (WCAG 3.0), we are not able to use 14px font as a regular base, but when it comes to SaaS application design, 14px is commonly used as the base font size. Despite my attempt to use ...
Iroshan De Zilva's user avatar
2 votes
2 answers
1k views

UI Design: I can't understand the concept of design tokens

I have created a few design systems in Figma for different companies. Some are simple, and some are complex. But till now I can't understand the concept of design tokens. Every article or video I ...
Bluebug's user avatar
  • 336
0 votes
1 answer
527 views

Creating a Dark Mode

A lot of my colleagues work in quite large companies and have created some very robust and large Design Systems, however, they always say that they haven't quite determined the Dark Theme color ...
Antistandard's user avatar
0 votes
2 answers
3k views

Does a hover state background need to pass color contrast for accessibility?

We have some discussion going on between myself (design) and lead engineer. With this key question: Does the background of a hover state have to pass color contrast? Our current system has our ...
Aaron Merritt's user avatar
1 vote
3 answers
294 views

Design system – Different font sizes for small an big viewports

everyone! We are currently working in a project team on a design system that is primarily used to develop web applications. These web applications mainly consist of forms. One requirement here is that ...
s-lauer's user avatar
  • 21
17 votes
6 answers
7k views

Our brand (and design system)'s primary colour is green: how should we indicate success?

Our brand's primary colour is green, and so we've been using it for a while as the primary colour for our design system (clickable buttons, elements, etc. as shown here): Now I've just realised that ...
Tom H's user avatar
  • 291
0 votes
1 answer
477 views

How do you use the 4px grid in a mobile screen for iPhone 11 Pro that is 375px?

How do you use the 4px grid in a mobile screen for iPhone 11 Pro that is 375px? Margin 16px / gutter 16px? Then it requires to be four columns with a width of 74px however, one of them should be 73px. ...
user162044's user avatar
0 votes
2 answers
732 views

How do you define input length?

I'm working on an online banking website and its design system. UI designers tend to want all form input elements to be the same size so that everything is perfectly aligned. I've explained that the ...
Raphaëlle M's user avatar
1 vote
4 answers
2k views

Check box and radio button - hover and focus states

I'm currently defining the hover and focus states for my Design System and looking at the major DSs (carbon, material, spectrum, eg) out there I see that the focus and hover definitions for these are ...
ananeto's user avatar
  • 1,357
0 votes
0 answers
358 views

How to define label text vs body text?

I am setting up the initial typography style guide for a mobile fintech application, the issue I am stuck with is how to communicate what part of content needs to use "label" style vs "...
AASHISH METHANI's user avatar
0 votes
1 answer
519 views

How should I design this, not sure if it's a container or card

I'm currently in charge of the design system and we have this component which I'm not sure if I can consider it a card, or should I just use the general term 'container'. I tried googling and results ...
Cassie Ho's user avatar
1 vote
2 answers
141 views

Improve the current UI library or build a new one?

I recently joined a company with a small team but not a startup. I'm working on a CRM SaaS product, which has a few years, but it's not very sophisticated (UX and UI wise). When they started to build ...
casuin's user avatar
  • 11
2 votes
1 answer
94 views

Is it OK to break with a design system in certain cases?

I am designing a lengthy questionairre (36 questions). Per our design system, I am supposed to use a modal popup (because it will make production faster). I think that I should break with the design ...
Artur Gubar's user avatar
0 votes
1 answer
88 views

Different heading sizes for different platforms in design tokens [closed]

Currently I'm doing an experiment with my first Design System(I have chosen Bootstrap) and Design Tokens(Style Dictionary npm module) I configured and build all good, Later I wanted to achieve as ...
Sameera Thilakasiri's user avatar
0 votes
1 answer
80 views

What is the meaning of Drive, Drive Compact, Focus, Focus Compact in Style Guide

When I read this article, https://design.lyft.com/building-a-design-system-library-3a1f0d09088f#2cf8 found following image. Its talking about Frame Name The frame name is the top-level grouping of ...
Sameera Thilakasiri's user avatar
3 votes
3 answers
157 views

Differentiate Design Systems incl. code-snippets from repositories

I'm currently doing some research on design systems (hereafter DS) because we want build one. Context Requirements for a DS guides our designers when building something that needs to conform to our ...
Arthur Boni's user avatar
4 votes
1 answer
320 views

Design tokens in design systems - are designers working with developers?

Usually when I have worked on design systems in the past, a clear and robust IA helps to create a convention and vocabulary to describe all the abstract and concrete elements contained within. And ...
Michael Lai's user avatar
  • 27.3k
2 votes
3 answers
200 views

Design System rules

I would like to get your input and experiences with styleguides. Some of the designers I work with insist that the design system should have rules to be followed to the T. Some sample rules are: A ...
Jay Bob's user avatar
  • 29
1 vote
1 answer
71 views

What is the standard for the text alignment for Text Styles in a Design System?

What is the standard for Design System Text Styles alignment? Figma defaults to align top. What are the advantages / disadvantages of using Align Top / Align Center / Align Right when designs get ...
jeancode's user avatar
  • 225
1 vote
3 answers
214 views

Why designers buy the UI kit for designers?

There are many design systems available online noways, but I am getting confused - what was the purpose of buying a designer system for the designers.  Why designers buy the UI kit instead of making ...
Rishi Shah's user avatar
0 votes
3 answers
104 views

Preferred Mobile dimension for Design System examples

Design Systems usually contain details about the components, typography, tone, etc. There are some systems that also provide screens/page/views, but the majority I've seen online are optimized for ...
Ecaterina Moraru's user avatar
-2 votes
1 answer
87 views

What parts does a design system have, how to support development? some documentation with step by step examples uu [closed]

I'm just starting in the world of ux, I would like to know what a design system has I have read but I still don't understand, the only thing I have been able to do is create some components in figma ...
Katherin Tacas Arangoitia's user avatar
1 vote
2 answers
115 views

Why are design systems by many companies publicly available?

Why do many companies like IBM, GE, VMWare, etc make their design systems publicly available? Designers find it useful, but how is is helpful to those companies and why do they do it?
Surya Teja's user avatar
1 vote
2 answers
159 views

How do you call top block with user info on a profile screen?

There is this block in every social media app, on a user profile screen. It contains user's userpic, name and other info, before their content starts below it. How do UX designers and developers call ...
Daniel Vorobyov's user avatar
8 votes
1 answer
321 views

Why are design patterns normally not included as part of a design system?

I have seen many front-end development frameworks that are simple a collection of UI components and page layouts to be used by developers to build new applications. However, it should come as no ...
Michael Lai's user avatar
  • 27.3k
1 vote
3 answers
160 views

How to Improve "Select" Component's Experience When Lots of Informations in it?

I have a component select and it has a lot of information about Bank accounts. I need to improve it because this component will have more then 300 bank accounts. Is it a good idea to put in order the ...
tatah's user avatar
  • 35
0 votes
1 answer
76 views

HELP tackling huge WCAG 2.0 compliance project! Need advice, please

I need advice on how to tackle a really big project. The project consists of getting the production and future support website WCAG 2.0 complaint - for both mobile and web: Production website: is ...
Koumtti's user avatar
  • 108
2 votes
4 answers
1k views

What would you call a font size between "small" and "regular"

I have these tokens in a design system for font sizes: tiny small ??? regular medium large huge mega giga Design needs to add a size between small and regular and I'm stuck trying to find something ...
Yann's user avatar
  • 131
1 vote
1 answer
194 views

What frameworks exists for UI documentation?

I´m working on a style guide which I want to put on the web with info, examples etc. I know there is one API / framework called Fractal, but it does not have the look and feel I want. I see a lot of ...
Steven's user avatar
  • 201
5 votes
4 answers
2k views

UX design guidelines for audio/sound feedback and interaction of UI

I came across a brief guideline that talked about how to do UX design for sound, and there were some very sensible advice that covered a number of points including: How to decide what type of sound ...
Michael Lai's user avatar
  • 27.3k
3 votes
1 answer
148 views

Design systems that cover both physical and digital use cases

When companies created design systems, it is typically applied to their products and services rather than something that can be used throughout the entire organisations. Atlassian's update of their ...
Michael Lai's user avatar
  • 27.3k