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.

Filter by
Sorted by
Tagged with
0
votes
0answers
23 views

Can a slide up panel have a temporary navigation drawer?

You are in a slides presentation editor, to add an image you open the Image Gallery that slides up as a slide-up panel. Once here, you can check out other Galleries, Shutterstock synched gallery, ...
0
votes
3answers
149 views

How do I make the UI of this app look less “amateur” while maintaining the brand's style?

I'm redesigning an app and I used the company's brand/website colours and fonts. However, a user tester said my design looked "amateur." How do I make this look more professional while ...
0
votes
0answers
27 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/...
0
votes
0answers
18 views

Google Forms with Interactive Passage Design?

I'm currently trying to design an editor for an application where quiz questions are linked to specific parts of a passage. This editor is essentially for people to create these type of special ...
0
votes
0answers
20 views

Designing for Incorporating multiple workspaces into one interface (WYSIWYG) with a live preview

I'm currently working on an editor for an interactive quiz program my mates have worked on. The quiz has interactive questions that require the user to interact with a passage (i.e. the photo below ...
0
votes
0answers
16 views

Integrate combobox/dropdown in smartphone app?

I'm working on a smartphone app for searching prices. This is what the menu looks like. In the app, I can switch between the results of "CHEAPEST" and "CLOSEST" without moving away ...
0
votes
2answers
62 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 ...
0
votes
0answers
17 views

Multiple Input in wizard to determine next page

So I have a Wizard in QT5, I have a table and need to pick a data source and type. Based on those 2 fields, transition to the next page. I have the components working properly, but I am looking for a ...
0
votes
0answers
53 views

Best practice for dealing with configuration conflicts?

I have a problem with applying configuration to two groups of devices. The config is applying IP security settings to routers. For any industry setting user can specify "allow/alert/deny" ...
15
votes
3answers
3k views

Make Optional Buttons More Clickable

I currently have a UI where I have three optional buttons. By clicking on a button, it will go to another user flow and the button is "completed". Unclicked buttons are considered "...
0
votes
1answer
335 views

Are “Ross's GUI Truths” factually accurate?

Ross Scott of Accursed Farms released a very extensive (albeit outsider POV) analysis of the GUIs of modern operating systems, titled The GUI should be better. A lot better. I saw it shared in ...
0
votes
2answers
79 views

What is the best way to change proportions?

I would like to find the best widget(s) to change proportions. Let's say I have 2 to 12 parts that sum up to 100%. I would like to create a widget where the user could those parts as they want. For ...
1
vote
0answers
54 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
4answers
48 views

Floated label form fields - displaying hint text and validation

I'm making updates to a form, which features form fields with floated labels. I want to add hint text to some of the fields, but I'm unsure how to format these fields when I need to display validation ...
6
votes
4answers
396 views

Why does Airbnb put the close button for a dialog on the top left corner?

It seems this pattern is quite common in mobile apps, but not so common on the web. (Assuming that most people use their right hand to control the mouse)
1
vote
1answer
52 views

Why do modern GUIs tend to have buttons on the side of message boxes?

Message boxes used to have buttons centered horizontally. E.g. here's one you'd get with MessageBoxW API function on Windows XP: But more modern systems have message boxes with the buttons on the ...
0
votes
1answer
39 views

Is it ok for a button to open in a new tab?

We have an application that allows users to write posts/articles. Within this application, there are a couple features that require users to upgrade. I think it's reasonable for the upgrade button to ...
1
vote
1answer
128 views

Are there some modern UI equivalents that can be used instead of a ComboBox?

ComboBoxes do a good job when on (e.g.) web forms. However, they just look dated in a modern UI with a touch screen. Is there a more modern alternative to them? Or is it just a case of stripping away ...
2
votes
1answer
47 views

Navigation fake door test

My team have decided to run a fake door test in order to help us, quickly, understand if there is an appetite for a product showcase page. We've added the fake door link, but I'm wondering what would ...
7
votes
3answers
2k views

Avoiding Repetitive Actions

I'm developing a UI for a product that will have "Install/Configure" option and "Documentation" on the search of the cards. However, the UI looks ugly because of the repetitive buttons. Is there any ...
1
vote
1answer
35 views

Where the personalization / customization of specific UI elements/components is occurring in modern applications

Facebook has progressively released the customizable avatars stickers for its users around the world Messenger app (apparently to compete with the Bitmojis), which follows the trend for instant ...
2
votes
2answers
90 views

How to display “Select all” in multi select auto complete pattern?

Existing Design: Scenarios: In the default state, we don't show the entire list to the user. Once user starts typing, we show the predictive matches We don't use a checkbox pattern for the ...
3
votes
2answers
145 views

Rationale for persistent UI elements that is overlayed onto video windows

With a lot of people now using video conferencing tools, there has been a lot of articles highlighting the usability of these applications. Microsoft, which boasts a very large research and design ...
1
vote
3answers
50 views

Adding extra information to a file that's being uploaded via dropzone

We're redesigning a file upload experience. The use case is to add supporting documentation to a support ticket. The user selects a file, indicates the document type, and then clicks Upload. Once ...
1
vote
1answer
53 views

How would you input sequential data?

Let's say I want a user to enter a sequence, such as boxing combos (e.g., jab-cross-hook) or even skateboarding tricks, along with individual moves/tricks, how would you go about designing the UX for ...
2
votes
2answers
60 views

How to best present end date to the user? Inclusive, exclusive, 23:59, something else?

In our app you can select a start date and the app calculates the end date (we're talking about subscriptions here). This is from midnight to midnight, so the actual points in time are, for example: ...
3
votes
1answer
31 views

Technical terms linking vertical lists to Instructions

I once read a study where it described that displaying information vertically hints/implies to the user that it is instructions. I tried searching for proof of this concept again and couldn't find it ...
3
votes
1answer
120 views

Form fill by viewing document on same UI

What could be the best UI desing if we need to provide a user a single UI where user can view the document uploaded at the backend and fill the form by viewing the details available in the documents. ...
2
votes
0answers
89 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, ...
5
votes
3answers
176 views

Live/interactive elements in browser tab bars

I saw another interesting example of an interactive/live UI element in browser tab bars recently, this time it is a %scrolled value for a page. A very popular and common example I have seen ...
0
votes
1answer
52 views

Is it okay to show the loads of data on modal or on the new web page?

I am working on an application which has some data in tabular format. There is a view button for each row. So my question is: After clicking on that button, should I show the data on the new web ...
1
vote
1answer
44 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 ...
3
votes
1answer
79 views

Help designing an e-commerce 'build your own product' interface

I'm designing a 'build your own product' interface which allows a user to upgrade a base product. Currently I'm unable to get feedback from our users, but I did share the design internally. For ...
3
votes
1answer
60 views

Is there a best practice for redirecting users in a web application during an interaction?

To be more clear, my scenario is something like this: User interacts with a dynamic form that might or not create a new record on the system. When this record is created, I want to give the user the ...
1
vote
0answers
78 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
2answers
44 views

Appropriate menu labels for controls regarding background image editing

I am working on the app which has the following controls which do two things Size - It contains for controlling the background size of an element's background image. As per https://tailwindcss.com/...
10
votes
5answers
253 views

Novel design patterns used to attract user attention but not a call-to-action

On the seek.com job website there is an interesting little character on the top of the navigation: When you hover over this character, there is a small interaction/animation Which basically extends ...
32
votes
6answers
6k views

Multiple breadcrumbs

Breadcrumbs allow users to keep track of locations within websites. They show the path used to achieve the resource. But if the resource could have different categories, has the sense to create ...
4
votes
4answers
115 views

How should I indicate that a button or input is disabled in a dark theme?

As is the web standard, disabled inputs become "grayed out", getting a little darker and sometimes less opaque: So my question is how to replicate this in dark mode. This is how it looks when they're ...
0
votes
1answer
57 views

Can Task-Based UI be considered to be slower in context of complex enterprise apps?

Question Are there studies that prove overall user performance degradation when interacting with Task-Based/Driven UIs in complex enterprise web applications and domains? Use case Considering, ...
0
votes
0answers
44 views

Are there guidelines or best practices for notifications or prompts for how to use your app?

I have even seen this in high-end professional 3d applications, where they will always show you messages, notifications, or prompts for how to perform the most basic tasks such as selecting things, ...
25
votes
6answers
2k views

Form layout with fields which are sometimes input and sometimes output

I'm designing the UI for a desktop application. In one of the windows certain interdependent properties of an object are listed. I want the user to be able to choose which properties are to be used as ...
1
vote
0answers
36 views

What are the best ways to redirect user from page 01 to page 02 and then redirecting them to screen 01?

I am working on a feature where I have some constraints. To perform an operation on screen 01 I can't use a modal and have to redirect users to screen 02 for performing operations (As it involves ...
12
votes
7answers
5k views

“Realistic” Thermostat Interface vs Minimalist

I am developing a Web Interface for Temperature control of certain rooms/zones. Every time the + icon is clicked, a new card appears as shown. The large number will be the temperature based on a ...
0
votes
1answer
48 views

Design Principles for Applying Configurations to Multiple Destinations

Do solid design principles exist for a scenario where one would have a dashboard for applying configurations to multiple different locations? As an example - let's say you have a dashboard to ...
1
vote
1answer
60 views

GUI Settings Menu

So happy to find this forum! First post here, hope I understand the intent: I am trying to design a settings menu for HVAC control and I just really can't figure out the best way to portray the ...
1
vote
0answers
35 views

The right Layout grid for iOS UI design

I just downloaded the free iOS 13 GUI for figma and I tried to see whether their app templates follow a standard grid layout format, and by the way it looks they don't - components are not aligned ...
1
vote
1answer
50 views

Using Select All with button checkboxes

I like the usability enhancement that button checkboxes provide -- nice big click targets, plus we can add a little sliver of color that's used elsewhere in our application to impart a status ...
0
votes
0answers
38 views

Need help with toolbar layout

I have a toolbar that needs 4 controls and a company icon on it. I cannot figure out the best placement of the controls and I cannot figure out the best look for the search controls and need advice. ...
3
votes
1answer
57 views

What type of colours should I use for 3 level of message bars for better user experience?

We have designed an assessment test mobile application. Where we need to show 3 levels of information after the header bar. Here are the screenshots: As shown in the above screenshots, we are showing ...

1
2 3 4 5
51