Questions tagged [design-patterns]

Reusable solutions for commonly occurring problems in user interface and user experience design.

Filter by
Sorted by
Tagged with
0 votes
1 answer
33 views

Can a bottom drawer common in mobile apps be used on mobile webpages?

I was trying out the GenAI features in Instagram, and loved how they used a drawer for hiding information a user doesn't need all the time. Can this pattern be implemented on web through either native ...
harshikerfuffle's user avatar
2 votes
1 answer
37 views

Conveying Unknown Locations on a Map

Scenario: You have a list of machines with some missing location data due to privacy restrictions or incomplete information. You offer both a list view and a map view for users to explore these ...
Peter OnDesign 's user avatar
0 votes
2 answers
119 views

What's the name of this element?

Consider the part in black right above the navigation header. I always knew it as "supra-header," but every time I mention it, nobody seems to know what I'm talking about, so I guess there's ...
Devin's user avatar
  • 37.9k
0 votes
1 answer
52 views

Simplifying Matrix UI Approach

I have a current design which is in matrix form where columns and rows can be added and value is added. Is there any other solution for this other than using matrix. I dont want to use the matrix ...
BiZay Sunuwar's user avatar
0 votes
0 answers
44 views

Why does Material 3 contains no color for success, while there is one for error?

Why does Material 3 contains no color for success, while there is one for error? Seems a bit asymmetric? Wonder if this is intentional, as in: "success is a normal flow, no further color ...
Giorgi Sh.'s user avatar
0 votes
1 answer
39 views

Managing a large list of selectable, uncategorizable items

I'm having a difficult time solving this problem and i'd appreciate any input. Context: During checkout, a user has the option to pick one of 41 plans. Each plan has a corresponding value that the ...
Moemin's user avatar
  • 3
0 votes
1 answer
110 views

Best practices for alerting user they must leave an app [closed]

I'm working on a healthcare data flow tool where the workflows sometimes require the user to leave the current system and proceed with their task in a fully separate 3rd party system. I'm trying to ...
Bryce Howitson's user avatar
0 votes
1 answer
96 views

HTML element or UI control to accomplish the following scenario to select a range of page numbers in various orders

Seeking some insight on what HTML Elements or UI control would be best suited to accomplish the following scenario. The ability to select a range of page numbers that could include a number of ...
Tanooki Mario's user avatar
0 votes
2 answers
175 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,491
1 vote
1 answer
67 views

Is providing a user with a 'change view' option when completing a long form a good user experience?

For context, I am designing a new form that a user is required to complete in a modal window. I have two options designed: a long scrollable form, and the same form broken into sections displayed ...
DAC84's user avatar
  • 113
1 vote
0 answers
35 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
4 votes
1 answer
427 views

Bento Grid Trend: Interactive Dashboards [closed]

I am exploring the integration of the Bento Grid trend in interactive dashboards and seeking insights based on your experiences and knowledge. Background: The "bento box/grid" concept, ...
Alex Marcevoi's user avatar
2 votes
1 answer
66 views

Feedback on a Error Summary

There's a use case where we plan on having an error summary to describe better the errors they might have on a form. The documentation on the UK Government site is well-written and covers most ...
Raphael Aleixo's user avatar
4 votes
0 answers
137 views

Does this pattern have a name?

I just came to a very known website that I found pretty weird and confusing because of its onload behavior. You can see it at https://wetransfer.com and what I mean is the image below: Just in case ...
Devin's user avatar
  • 37.9k
3 votes
3 answers
160 views

What type of design pattern to use to toggle list actions?

In the design draft pictured below, you can see a number of events in a list. Users reviewing this list want to be able to add events to other lists: a watchlist or send list -- or both. They also ...
Levano's user avatar
  • 132
3 votes
1 answer
80 views

Seeking Help with a UI Pattern for Segment Selection in Analytical System

My team and I are currently working on developing an analytical system that employs a segment-based filtering mechanism. In essence, this system shares similarities with Google Analytics, where ...
Vee's user avatar
  • 31
2 votes
1 answer
181 views

Should I include sold out items?

I'm working on an e-commerce site that doesn't have many products (actually there are only 5). These products are high quality and quite expensive. Now the most desirable product (the 2nd most ...
Devin's user avatar
  • 37.9k
3 votes
2 answers
86 views

Keeping the text handle visible at all times when in text editing mode on mobile devices, any accessibility issues?

There is a very interesting article on the 'invisible' problem of editing text on mobile that highlights the lack of novel and tailored UI design patterns for text editing. One of the really ...
Michael Lai's user avatar
  • 27.1k
3 votes
1 answer
93 views

Use of T menus for text editing in mobile

There is a very interesting article on the 'invisible' problem of editing text on mobile that highlights the lack of novel and tailored UI design patterns for text editing. In particular, the idea of ...
Michael Lai's user avatar
  • 27.1k
1 vote
1 answer
75 views

Looking for library of resources on real product's design, Information Architecture, etc

For my current project, I am looking for inspiration related to how different digital products (web applications, mobile apps) are organized: navigation + menu structure, Information Architecture So ...
adam.heleniak's user avatar
1 vote
3 answers
125 views

Stepper - max. item count

I currently have an annoying discussion with one of the business guys as he wants to turn a freely configurable tool into a stepper. First of all the tool don't have mandatory steps, it's more like a ...
Cobo Kay's user avatar
1 vote
1 answer
141 views

Components in graph based UI with more complex interactions

Something that I noticed has become a feature of complex no-code software applications is the use of graph-like interfaces with more complex interactions such as the Unreal Engine 5 user interface. I ...
Michael Lai's user avatar
  • 27.1k
0 votes
0 answers
25 views

What is the best UI element for selecting OPTION 1, OPTION 2 or NONE? [duplicate]

I am designing a very long form with around 40% of fields being a dropdown with options: [NOTHING SELECTED] Enabled (On / True) Disabled (Off / False) The [NOTHING SELECTED] option is important, ...
melanctha's user avatar
2 votes
1 answer
244 views

Struggling to make an accessible data table with clickable rows!

We're currently working on making our data table accessible. Our main concern is the whole clickable row that triggers a side sheet. The entire row is clickable, and a part of its content may be ...
Genevieve Morency's user avatar
5 votes
3 answers
256 views

Show included dates in a matrix/table

I’m stuck on that problem since last friday. I work for a white-label company. My task here is to display multiple date ranges concerning cancellation fees based on the number of days before the ...
jagal's user avatar
  • 51
2 votes
1 answer
175 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
  • 37.9k
0 votes
2 answers
88 views

how to make card with more detail [closed]

How can I display all the information on this blood donation request card without cluttering the card's visibility on Stack UX? Additionally, I have a long text that describes the user's blood need, ...
Muhammadoufi's user avatar
0 votes
3 answers
138 views

Should "primary" buttons always perform an action?

I have 2 buttons, one is only to open a menu below and the other is to navigate to the view to create a new employee. I recently read an article where they say primary buttons should only be for ...
leonardo's user avatar
5 votes
2 answers
3k views

Design Patterns - like WYSIWYG

We have seen multiple applications using WYSIWYG.Eg: MS office applications, Adobe Photoshop, Illustrator and so on. Recently I came across Miro and started using it extensively. What does the Layout ...
Ashwin Kulkarni's user avatar
0 votes
2 answers
133 views

Problems with UI UX design for grid elements

i am facing a problem with my grid elements, the design is made to look good when the grid element is filled with long information, but it looks empty and filled with lots of white space when there is ...
Atharv Choudhary's user avatar
3 votes
2 answers
126 views

What is the name of this 'recommendation smorgasbord' UX pattern?

Here we see the main landing page of a food delivery app. The page is crammed full of recommendations; the user is presented with several different "channels" of recommendations as well as ...
user253751's user avatar
1 vote
3 answers
236 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
0 votes
2 answers
123 views

Confirm Dialog after swipe to delete

I am building an application where I have a vertical list with cards and I want to delete a single item from the list by swiping left. Nothing wrong with this, right? Well, these items are "...
pochopsp's user avatar
  • 101
0 votes
1 answer
89 views

LED blink pattern on Boot - Any best practices for UX?

I have an embedded device. During the boot process, the only feedback the user receives comes from a programmable RGB LED. That is, I am able to blink, fade, turn on/off etc. The whole boot process ...
Mo_'s user avatar
  • 3
11 votes
2 answers
1k views

File tree expander arrow directions

Is there any explanation on why the expanded node/folder has an arrow pointing down and collapsed pointing to the right? My guess, an arrow pointing down directs user down to the content of that node. ...
Masius's user avatar
  • 211
5 votes
1 answer
138 views

Why does "jump link" pattern not copy?

I am asking this question as a user. I have used several websites with the "jump link" feature, and after clicking on the button I go somewhere else and press Ctrl+V only to find out that ...
simplegamer's user avatar
0 votes
2 answers
245 views

Design intended to discourage certain actions

I call it negative design, it's sort of like hostile design, without the social nonsense attached. I don't know what it's called in UX or UI terms though, I'm sure it isn't negative design. A good ...
Kitanga Nday's user avatar
  • 1,684
1 vote
1 answer
138 views

Examples of label/highlight color pickers

I'm looking for application examples where the user can select a color for a label/tag/highlight, choosing both the background color and foreground color. Gmail provides a two-stage UI for this with ...
Jon's user avatar
  • 11
1 vote
1 answer
82 views

How to display 3 nested content in an edtech platform

The learner in the edtech platform are having issues in accessing this nested structure, which is currently available on click. They want a single area where they can access this structure. I don't ...
Rishabh Mittal's user avatar
-1 votes
1 answer
192 views

How should a multiple choice form response behave in a web UI chatbot?

I have a wireframe for a chatbot that includes a web form with multiple choice (radio selection). It's essentially a quiz; the chatbot asks a question with one possible response, then, after ...
Daniel Vianna's user avatar
3 votes
3 answers
592 views

What's the best way to name a toggle switch label?

I'm creating a section in an app that includes a toggle switch. Initially, I used the same name as the section for the toggle label, but I started wondering if that might be too repetitive for the ...
Júnior Beluzzo's user avatar
1 vote
1 answer
940 views

What are best practices in form element color vs background color? Should they be different?

I'm designing forms for healthcare applications. In our team there are some different opinions which of the designs below is the best. It's all about colors. There are rough 3 options Form elements ...
Lisette's user avatar
  • 101
1 vote
1 answer
43 views

Need help for Svg-typed-Info section

I'm currently trying to create an SVG image for my GitHub readme's top. This image would include a profile for the user, a few links for social networks or similar sites to post(pinned), and some ...
EarlGreytea16's user avatar
1 vote
1 answer
134 views

Can UI design patterns be patented?

Just like any other product innovations safeguarded with patents, are there any provisions for UX design patterns to be patented? Does anyone know of any research related to design patterns?
veteran's user avatar
  • 53
3 votes
3 answers
843 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
76 views

Modal or Non Modal functionality on UX Stack exchange portal - Behaviour Confusion

I was going through the profile section of the stack exchange site today and i found an interesting behaviour of modal window. As far as what I have observed in various articles and design systems ...
Ashwin Kulkarni's user avatar
0 votes
1 answer
348 views

Most user friendly way to select a time slot when booking a table

I'm designing the table reservation process for a website with multiple restaurants. After selecting the day, the user has to select the time of the reservation. The restaurants have multiple shifts (...
Danielst's user avatar
  • 371
1 vote
1 answer
84 views

Help me identify a formal name for the "workspace pattern"

I'm trying to find if there is a formal description of what I've tried to call the "workspace pattern", seen in apps like Figma, Canva, Notion, etc. In this pattern, users to start out on ...
Merjit's user avatar
  • 11
0 votes
1 answer
165 views

Is this navigation pattern a good idea?

I have noticed the following navigation pattern recently and am wondering if this is a "good" pattern in your experience. - Can you point to any usability research about the pattern? It ...
Tony Bolero's user avatar
  • 7,304
1 vote
4 answers
8k views

What is the best method to choose between two options in UI?

What is the best method to choose between two options - toggle, dropdown, radio or segmented button? For example, the two options I have are 1. horizontal 2. vertical They are mutually exclusive. Eg:
Neha Kamath's user avatar

1
2 3 4 5
20