Stack Exchange Network

Stack Exchange network consists of 174 Q&A communities including Stack Overflow, the largest, most trusted online community for developers to learn, share their knowledge, and build their careers.

Visit Stack Exchange

Questions tagged [design-patterns]

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

0
votes
3answers
120 views

Visualizing large tabular data

I'm trying to find the best way to visualise the following tabular data. Problem: There are several channels and each channel has two platforms. The value of the channel's platform could range ...
1
vote
2answers
95 views

Is there a particular name for this design element?

I have seen a lot of magazine/news templates that basically stick a set of posts together and they usually span 2 rows and 3 or more columns. The best I can think of is maybe calling it a collage, ...
0
votes
2answers
84 views

What is the name of the design pattern used to create, rename and load user-presets such as styles, favorites, and workspace layouts?

I want to find out what other people have found out about a very common design-pattern. However, my searches come up empty. The pattern is a minimalist save/load feature for things secondary to the ...
0
votes
1answer
83 views

Does this multi-line form interface pattern have a name?

I've got a form where the user needs to enter a number of records (varies for each screen), and the UI approach I'm considering is to have multiple rows, with the ability to add and remove rows, ...
4
votes
2answers
337 views

How to show dual list in responsive

I am showing a dual list on web application. It has desktop view and mobile responsive view. As we know that we can't show the dual list 2 columns side by side in mobile view due to less space. So ...
4
votes
2answers
353 views

What's a good pattern for mixing bulk-able actions and single actions?

I'm working on a web frontend for an existing API. We currently have a table that looks like this: You can perform various one-time actions on items. At the moment, every action you can take on an ...
0
votes
0answers
27 views

Alternate names / examples of the Subview design pattern?

I am using this design pattern in my work: http://www.cliptheme.com/demo/rapido/ui_subview.html I've searched but my Google Foo hasn't turned up any other examples of this design pattern. Can ...
0
votes
0answers
34 views

Devices Management / Limit Devices on mobile app

Specifically looking for a UX pattern/behavior that addresses the best way to handle device management on mobile. Ex.: user creates login credentials -> subscribe to the app (paid) -> share his ...
7
votes
3answers
705 views

How long should a toast message with 'undo' appear?

In our application, the user can make small changes, such as deleting a chart from a report. When they delete an item, a toast notification appears to say "Chart 2 was deleted successfully. Undo?" ...
1
vote
1answer
64 views

Should we anticipate when the user is asking for the menu when we hide the navigation on scroll?

A lot of websites nowadays, admittedly more so in desktop view, (which is now seen by fewer thanks to the world of mobile) hide the navigation bar when you scroll down. This is a good thing as it ...
0
votes
2answers
232 views

How to display a checkbox modal

I'm updating a legacy(12 y/o) system and one of the requirements is a cta that opens a model which lets the user make multiple selections, aswell as, typing an input that then gets added to a summary ...
1
vote
2answers
96 views

Is social sharing needed for every page of a B2B website?

I know this question has been asked previously. There are some more details in my case. I work with a technology company that makes software for insurance. The products are all B2B. We have social ...
4
votes
4answers
229 views

“Cut and Paste” in a tree structure

I am working on a web app that provides a visual programming environment to generate 3D models - Mobius It involves creating a scripts by adding lines of coding and just editing parameters. We are ...
3
votes
3answers
398 views

How to add one or more items to the table row?

Context I'm working on very complex enterprise solution. We have this table that shows list of let's call them contracts. Every contract (row) can contain one or more customers (and one or more ...
2
votes
3answers
151 views

Timer settings, when to use a combobox or spinbox?

I was creating a mockup for an login settings window, and when i came to the option for "auto logout", i was wondering if it should be a spinbox, allowing the user to set any value (in minutes), or a ...
0
votes
1answer
85 views

What would I call this element? [closed]

I am trying to create a card that has a position absolute show more div option. I need it to not move any other elements and be responsive. I don't know how to do a search for it because I don't know ...
1
vote
2answers
123 views

User Interface suggestions to unlock editing for critical elements

I'm developing a webpage for internal users who will spend a few hours a month using it. Most of the elements on the page are straightforward, but a few could cause hours of work to undo if they have ...
1
vote
2answers
396 views

Placement of anchor link buttons in a page with a lot of scrollable content

I am building a profile page (http://giga.brandvertisor.com) containing a lot of of information, visually organized in horizontal sections. For the sake of easier navigation, I have put anchor link ...
1
vote
1answer
226 views

Reading patterns, Z-pattern vs. layered-cake pattern

Im wondering if there is any difference between the reading patterns (Z and Layered-cake) since both of them require the user to read rtl or ltr whilest moving down a notch when going to the next line ...
0
votes
0answers
137 views

Fully boxed text fields vs lines

I'm wondering if there is any evidence-based research or studies on fully boxed text fields vs lines? It seems that using lines is the current trend, for example, Gmail, Invision, and even some ...
-1
votes
1answer
53 views

How can I collect and archive my sketches [closed]

I need your help if you can, so how you turn brief into a rough sketches for app & web design (need examples plz).
1
vote
1answer
77 views

Are components and patterns same in interface design?

I hear term component and pattern used widely on blogs, articles, books and by my team mates. Most of the time they are used interchangeably by few people, which makes little confusion if they are ...
1
vote
4answers
121 views

How do you define typography styles in your designs?

When defining a style guide, which of the following is most common when naming layout components? Stating the specific H-levels to be used (i.e. H1, H2, etc.) Create your own set of naming ...
0
votes
1answer
610 views

“Add attachment/file” button for a mobile app?

I'm re-designing a part of a mobile-first app for reading and answering customer feedback. My problem is: How would you display a button for uploading attachments/files in an interface that is going ...
0
votes
2answers
77 views

Is have a “x” in a domain to join word a good idea? [closed]

We all know there isn't much dictionary word .com domain out there, so many people are taking domains like my-clay.com or domain that has multi-words. So currently I'm finding a domain, and ...
1
vote
1answer
68 views

When should an inherited design pattern be avoided?

I'm currently working on a fairly old product that has been partially reworked 2 or 3 times by different teams. This has left the interface somewhat fragmented with different design patterns used in ...
4
votes
4answers
219 views

What's the name of the pattern where you draw a rectangle to select items?

I'm implementing a UI where you can draw a box by clicking and dragging your mouse to select multiple items. Like selecting multiple files/folders: Does this pattern have a name?
0
votes
2answers
530 views

Primary/Secondary button placement pattern

Button placement has been a debated topic at within my UX team recently and I am for feedback or direction to research that states a solution. The problem I am trying to solve is where to place ...
0
votes
1answer
187 views

What is this called and best practices of UI/UX? [duplicate]

What are best practices for settings (UI) like this? I am looking to find out more about good practices, good UI/UX for this component for removing, adding items to different profiles (profile 1 has ...
1
vote
2answers
136 views

Type of control for a non-interactive widget

I have a set of inputs whose type can be changed, and one of the input types is read-only. What's the best way to represent this in a cross-platform manner? Right now I went with a disabled button ...
1
vote
1answer
79 views

How is this semi-transparent content block called?

I have seen this pattern many times: the content is hidden with a semitransparent superposition that provides a sense of continuity. The content under this semi-transparency layer is displayed after ...
4
votes
4answers
322 views

Best way to display ranges where end range is inclusive

I have a table with one column displaying a range of values where the end range value is inclusive, but the start range value is exclusive. I'm having a hard time figuring out how to succinctly and ...
2
votes
4answers
1k views

Search-Bar in Header OR Navigation?

I design a online shop for a client. The searchbar is for the target group and the stakeholder very important. So I did the search in the header, on top over the navigation bar (variant 1). My client ...
5
votes
1answer
128 views

What is the proper term for these items/images [duplicate]

First, is there any generic term or style for this type of showcasing images/items in mobile? I'm trying to emulate the style used here but first I would like to know the proper team so that we could ...
2
votes
1answer
82 views

how i can display this paper on mobile interface

I work on a mobile application. I want to display the document used by the client on his daily work. I'm looking for a strategy that allows the client to use the interface as the same as it uses ...
1
vote
1answer
163 views

Is the flat design out of fashion? [closed]

We are planning on building a software and we had this discussion regarding the design. Someone mentioned that the flat design pattern is out of fashion, but when I asked them what replaced it, there ...
4
votes
2answers
423 views

Do bigger buttons improve usability and how they correspond with design? [case]

We're trying to incorporate a style guide which helps developers understand and build CSS across different resolutions. After reading these: https://uxplanet.org/buttons-in-ui-design-the-evolution-of-...
4
votes
2answers
241 views

What type of pattern is this called?

Recently I've across some website and they were using this pattern. What is this pattern called? PFA image.
4
votes
2answers
200 views

The best approach to display a long profile information

I was re-designing a desktop application and the target audiences are mostly eldery women (user average age is around 50 years old). This application keeps the data of church and medical members so it ...
-1
votes
0answers
72 views

Freemium model with multiple upgrade options depending on each user type

I am working on a freemium model online service which has multiple upgrade options depending on each user type. The question is about the CTA's that advertise the different upgrades. Different pages ...
0
votes
3answers
655 views

UI feedback for a complex web form [closed]

I am working with a complex system which will have a lot of different long forms. I did this first prototype and I would like to know what you think. Thanks. I updated the design adding the ...
3
votes
1answer
74 views

Best practice to communicate the existence of different tiers of access /membership on a Shopify website

My website has an invite-only section for a subset of account-holders. What would be the best way to make that understood to my users? Are there any design patterns that have been proven their ...
3
votes
1answer
274 views

Developer tells me I can't use dropdown in this context

I have a question regarding the attached picture, where I can choose one or more lines on screen 1 and make my choice on screen 2 allowing the "next" button to become available (in screen 1 it is gray ...
3
votes
3answers
176 views

Effective view switching when space is at a premium

I have an area in which space is at an absolute premium and I have a very small space to switch between a mailing address and a billing address. I'm struggling on deciding on a tight but effective UI ...
-4
votes
2answers
1k views

Where can I get a Free Material design based theme [closed]

We are starting a project, where we want to download free material design theme based framework (With MIT License) to reduced development effort and time. similar to angular material and bootstrap ...
1
vote
2answers
71 views

View time range selection on datagrid with limited space

I have a datagrid that shows realtime data. How ever, Users should select to see if they want 'Last 5 minutes' data or 'Real time' Data. I did this using radio buttons, however it doesn't fit and is ...
0
votes
1answer
71 views

List options order and groups

I have a group of options from a new button like this: I am not sure if six options are too much for the user. Perhaps it has too much cognitive load? Any suggestion? Another question is: "Project" ...
0
votes
2answers
318 views

When to use Action Overflow Menu vs Modal List

For a mobile web app when would you use an action overflow menu as opposed to a modal window list? Here is an example of a modal window list used on Instagram App (android): Here is an example of a ...
1
vote
2answers
392 views

Mobile design - price range pick

Im trying to improve UX of mobile version of our loan website and I have hard times figuring how to improve price range and day picker. I am enclosing you what I have so far and would like to improve. ...
1
vote
2answers
160 views

Design for ultra search

I would like to give my users another search option. Paid search. The budget is for X searches paid from advance during the registration to the service. That type of search is called VIP search or ...