Questions tagged [gui-design]

Graphical User Interface design (GUI-design for short) refers to the visual aspect of designing computers, appliances, machines, mobile communication devices, software applications, and websites with the focus on the user's experience and interaction. Generally refers to digital rather than physical design.

70 questions with no upvoted or accepted answers
Filter by
Sorted by
Tagged with
4
votes
2answers
95 views

Statistics (or tools) on screen calibration & readability

Fairly straight forward question, but I could not find any answers to it. Are there any known statistics regarding screen calibration & readability? Are there any colors to avoid where screen ...
4
votes
2answers
2k views

Best way to design dynamic table of inputs. Like rate-lists

I am trying to design a rate-list input for parking lot management system. Where inputs are like this: But it needs to be customizable in time field of inputs, e.g. 3-4 hours based on user ...
3
votes
5answers
342 views

How consistent should icons be in sizing?

New to UX and confused about size consistency. I know icons that belong in the same group are supposed to have the same visual weight, but what if there's different groups of icons on the same page or ...
3
votes
2answers
310 views

How to merge login/signup into one option

Currently for our platform, we are using facebook login & Mobile number verification for login and sign up pages. User does not need to have any additional password to complete his registration. ...
3
votes
3answers
229 views

Should fields be hidden if another field could appear in between?

I'm making a form which will have various yes/no answers. In response to the user's action, the form might display more fields. Some fields will always be displayed. For example (completely made up ...
3
votes
5answers
897 views

What is the best way to display user company role and application role when logged in to the application

An application having two roles i.e Company Role and Application Role based on which different sections of the application are accessible to the person. Company Role describes either Admin or Users ...
3
votes
2answers
925 views

Is it a good idea to hide logout button with error/warning message?

I'm building a secure website, closer to banking. I'm bit hesitant to hide the logout link with the error/warning message. I think design look simplistic when I add error/warning over the logout panel....
2
votes
1answer
93 views

What are some modern examples of "steps involved" UI user patterns?

I need to create a UI element for my website that illustrates how the main process works, using some steps. The element will have the header "How It Works" followed by three steps. However, ...
2
votes
2answers
541 views

What should be the vertical placement of primary button on a mobile screen? And why?

A user scans the screen from left to right and top to bottom. So, we use the primary action (or primary CTA) on the right side while designing for the web. If we consider top to bottom scan approach ...
2
votes
3answers
97 views

How to display comparison of two versions of a blog post?

Suppose I develop a blog web application with a blog post editor. The blog posts are stored as JSON files. The web application renders these JSON files to display blog posts with their titles, headers,...
2
votes
1answer
176 views

What is the name for Flutter's sliver-like behaviors?

I'm looking for a component name that behaves like flutter's sliver: Here is an example of sliver. What i'm looking for exactly is a list that collapses or expands based on how much you dragged, ...
2
votes
2answers
123 views

Marketing preferences in a checkout process

I can see there's different approaches to showing the marketing preferences when buying a product. In your opinion, if the marketing preferences has a long text and a long list of opt-ins, do you ...
2
votes
2answers
242 views

Use inline table editing or multiple rows of dropdowns?

What is the preferred approach when the goal of a page is for a user to edit some values of multiple combinations? Inline editing in a table or multiple rows consisting of dropdowns and inputs? The ...
2
votes
3answers
154 views

Inventory - how to add range of items and reduce the probability of human error?

Problem: I have an inventory that fills one purpose -> insert the same type of item (dongles) which only varies it's serial number. Every month someone buys a box which comes with a perfect range ...
2
votes
2answers
250 views

Layers in editor for multiple images

I'm working on a desktop software that is in its core a simple image editor (apply filter, draw on image etc.) but the catch is that the user should be able to open multiple images, edit, and compare ...
2
votes
1answer
135 views

Floating Or Flat Mockup?

While Designing a mockup for an App or a concept, I find it difficult to choose between Flat Mockup and Floating Mockup. I'm interested to know why Floating Mockup gives a more 3-dimensional look and ...
1
vote
0answers
29 views

Adding an option that only works with some buttons and options

I am a software developer for a plugin for Blender. I am new to UX, but have created UIs and GUIs for some time. My plugin has three buttons - two with filter options grouped visually with them. Above ...
1
vote
1answer
44 views

Specific name for a collapsible bottom drawer menu?

I am looking for examples of this, because I eventually want to use it in a long scrolling Jupyter notebook - however, when I use "collapsible bottom drawer menu" in search, I mostly get ...
1
vote
0answers
62 views

Why does handlebar not appear consistently in the native iOS UI design?

Handlebars usually appear at the top of Modal View: But in other system-level views, there is no handlebar, even if they functionally act like a Modal View. (For instance, this screen, where you can ...
1
vote
1answer
74 views

How to showcase additional menu level items within the current menu UI without breaking it

We have an app that lets users modify their face as they are taking selfies. Under the Beauty option, users have the option to Smooth their skin, add Lipstick, edit Eyes, etc. The user can see in real ...
1
vote
3answers
107 views

Restrict the user to login to an URL from mobile

I am currently working as a product owner for a web based application. We have a requirement to restrict the mobile uses to access our URL from the mobile. I would like to know the standard UI pattern ...
1
vote
1answer
369 views

Custom select component with filtering

Custom select components are seen everywhere these days due to the limitations of the native HTML select element. Ignoring the virtues (or lack thereof) of select components (c.f. https://gerireid.com/...
1
vote
0answers
61 views

Are there any similar progress bars with interactions like this?

I'm actually looking at circular progress bars that can fit in the 45px x 45px space, as such there's a limit to what can be displayed (so the typical long and narrow progress bar isn't going to work ...
1
vote
1answer
88 views

Browse and select from a list at the same time

We're looking for a way to cut down on pogosticking - users popping back and forth between a summary view and various detail views. One pattern we're experimenting with is pager arrows, for when users ...
1
vote
0answers
198 views

Best UX for Tree Input

I have made a UI for creating recursive groups that can be made up of many items or other groups. I have a UI that looks like the following: It is not more likely one way or the other that the tree ...
1
vote
0answers
38 views

Is there any guidelines regarding forms cancelling on iOS 13?

iOS 13 added the “swipe to dismiss” feature to form sheets. I’m trying to find how to manage saving and cancelling on my forms to be as practical as possible. On native apps I took a look at iOS ...
1
vote
0answers
163 views

Soft input panel for 480x320 LCD screen

I'm working on a Qt-based C++ project. The project includes a 480x320 TFT LCD screen for display. The screen is also capacitive and used for touch-based input. The screen is about the size of a credit ...
1
vote
3answers
105 views

What is the name for component of menu board in front of home slider app

What's the name / the called for the component of menus board in front of home slider app. Usually it's contains of several feature services/action of the app. I mark with red frame on this image ...
1
vote
0answers
80 views

Suggestion in putting nav bar in centred website design

Can anyone suggest where I can add navigation bar in this kind of design. items I want on the nav bar logo (optional) call to action button one more link user/profile/login/signup Can anyone ...
1
vote
1answer
234 views

conceptual, semantic, syntactic, and lexical levels

In relation to symbols or icons, the conceptual level is defined as the mental model of the viewer; semantic level is the meaning it conveys; syntactic level is attributed to its aesthetic quality or ...
1
vote
0answers
63 views

Specific UI preferences & user behaviours in Singapore

Background I am currently working on an ecommerce site for Singapore, in particular their product detail page. A design was already provided but I worked on a small task where I have changed the ...
1
vote
0answers
101 views

Best way to design custom apps to plug in Microsoft dynamics 365

We are a small team of 2 customizing a Dynamics 365 for our ~100 people company. Using built-in customization tools from dynamics for basic forms and actions works (fairly) great. However, for more ...
1
vote
1answer
371 views

Design patterns to indicate status on infinite scroll pages

There are several questions regarding design patterns that apply to infinite scroll such as What's the design pattern at the end of infinite scroll? and also What are best mobile navigation ...
1
vote
0answers
179 views

Large data migration workflow

Can anyone suggest the best way to represent this workflow for managing a large data migration which requires a manual FTP stage on the customer end? I am thinking a wizard to take us up to the FTP ...
1
vote
0answers
60 views

Correct way to associate user with tags, and ways to properly add them?

Context: An environment where users have a suite of various products at their hands, containing information about hospital patients. The people using these tags tend to be physicians or technicians ...
1
vote
0answers
41 views

Create and edit M:N binding in large tables in GUI/Web app?

How to enable end-user to create M:N bindings for large multi-column tables? In our case there are tables up to thousands items large. Each table has number of columns. For example Cars (...
1
vote
1answer
286 views

(Color) scheme for quiz/trivia/test type app/game

here is the example: | Answers | User Input | Results | |:----------:|:-----------:|:----------:| | (OK) A | selected | correct | | (OK) B | | incorrect | | ( ) C ...
0
votes
1answer
32 views

Minimum table column width when resizing the column

In the table that I’m working on, user are able to resize any columns within the table. However, we would like to prevent user from resizing the column to a point where it’s like collapsing the column....
0
votes
0answers
45 views

Managing groups, users and their roles and permissions

I'm working on improving the current layout for managing group and user permissions - mainly the presentation of these things. The way it currently works is that all permissions from a group (Read/...
0
votes
1answer
70 views

Which is the best approach for key value pair representation in mobile material ui

I am having limitted data for a page as given below Key Value First name John Last name Doe Phone +9099999999 City Chicago I want to represent the above data in an Android view. I tried to avoid ...
0
votes
1answer
94 views

Expander before selector? Or other way around?

The scenario: I'm designing a table that will have both expanders (chevron icons) and multi-select action checkboxes on each row. Expanded, the rows look like this (and will eventually have more data ...
0
votes
1answer
51 views

Multi-select tree in which parent also is a child

I am working on a multi-select tree in which the user should be able to select all children of a parent. Normally you would be using the parent checkbox to do so, but in this case it should also be ...
0
votes
1answer
54 views

Wich one do you think is a better solution for the product card of a grocery app

Which of the options do you think to have better usability for the product cards for a grocery app (Shoppers) The problem: I need to give to shoppers a better visualization of the basic products ...
0
votes
0answers
111 views

Examples for a modern home screen in a Windows desktop application?

I have a 15 year old Windows desktop application, and I'd like to refresh the look of it to be more modern, in line with current trends in UI design. The main functions are launched from a home screen ...
0
votes
2answers
153 views

Is a good user experience to display actions on the top of the screen on the web?

Navigation on the top of the screen is common on the web. To add actions like "Edit", "See details", "Copy" in the navbar is more specific on the desktop. Fluent UI, ...
0
votes
0answers
59 views

Why would someone use a button as a link and vice versa

I've seen people trying hard to make an <a> tag look like a <button> (by CSS), and people doing vice versa. Why would they do that? IMHO, they encourage clicks on (fake) buttons, and ...
0
votes
0answers
14 views

UI for enumerated OpenType font features

Can you think of a tidy and efficient way to present 1–99 different text display options to users, given that more than one option may be active at any time, and text selection may include multiple ...
0
votes
0answers
34 views

Good ways to show detailed info selecting from a table?

Lists (tables or grids) may hold much information behind the list. I have seen popup windows and split screens etc. Most of them works in a desktop environment, but on a small smartphone the detailed ...
0
votes
0answers
39 views

What title could differentiate an "Inventory" page (containing items on-hand) from an "Ingredients" page (containing a full list of existing items)?

I'm making a recipe app with an inventory. When making a recipe, the user can add ingredients from an included list of available ingredient. If the users cannot find an ingredient, he can add a custom ...
0
votes
1answer
37 views

In a validator app, how to keep focus on the content you're validating?

I've got a specialized text validation application where the user can either type, copy/paste the text or load file in - then hit Validate for the screen to transition to the results area. Here's a ...