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
1
vote
2answers
276 views

No matter how hard I try, I think this hotbar interface is going to suck

Here's a prototype with an animation of it being used on a scheduler app. https://codepen.io/TylerL-uxai/full/QvezdM/ Did some interviews and everyone said the hotbar would be "cool" or "sounds good....
0
votes
3answers
371 views

Language switcher menu

I want to design Language selection menu and the requirement is, on the right side menu should appear (which shows the selected language) on selection, it should list all the languages available ...
0
votes
0answers
49 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" ...
0
votes
2answers
102 views

Is there any term for an interface in which an application runs another application?

Is there any term for an interface in which an application runs another application? For example, one website rendering UI from other website within its frame.
0
votes
3answers
177 views

How to show a segmented control and multiselect buttongroup at top of a list

I'm struggling on how I can present the following to my users and that they understand how it works: In a desktop app, we have a 'Recent' phonecalls list. This list shows all calls that came in and ...
2
votes
3answers
436 views

How to adapt text and/or elements size while designing to smaller screens?

I have a layout I made some time ago on Adobe XD (that was just a personal project) and now I wanna put it on Behance. To do so, I need to duplicate/adapt that layout (designed for desktop) to smaller ...
3
votes
5answers
616 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 ...
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 "...
1
vote
5answers
285 views

What would be the best way to show 3 actions on the bottom half of the page

We are confused as to which of these UI should we go with to as we have three actions relating to the content on the bottom third of the screen. Three buttons are: 1. Write to Device 2. Load from ...
15
votes
4answers
38k views

How many characters should typical address fields allow on an international website?

On an HTML form, What is the maximum amount of characters that should be allowed for: Street Address 1 Street Address 2 Town/Suburb State/Province (I would have drop downs for main countries, but I ...
1
vote
2answers
70 views

Segmented control at the bottom of the screen in iOS

Is this a common pattern to put a segmented control at the bottom of the screen? I've seen this only in the native iOS 13 Photos app. This is a segmented control on the screenshot below, right? If ...
1
vote
2answers
81 views

Are there services out there that allow you to easily upgrade or downgrade?

I noticed that in many different types of products and services that offer a few different subscription plans, upgrading is easy. Downgrading, on the other hand, is a bit discreet. In most of them, ...
1
vote
1answer
156 views

Using cards as navigation to other cards

I am trying to become good at web design, but feel I am missing that 'visual eye' that so many of you have. The general flow of what I'm trying to make is a top-level subject (ex. Math), will bring ...
0
votes
1answer
308 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 ...
1
vote
1answer
72 views

How to express multi condition rules with flow diagram or truth table

I have a below mentioned multiple variable which match with the other variables and gives output like FALSE, HOLD or TRUE. I have tried to represent it here in table format. Variable ...
33
votes
9answers
37k views

How to make selecting a timezone more user-friendly?

The list of time zones is rather long, lots of duplication, and not very friendly to programmers let alone end-users. Is there a way to shorten the list to something friendlier and sufficient for 80%+...
2
votes
2answers
154 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. ...
1
vote
1answer
112 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 ...
1
vote
0answers
53 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 ...
0
votes
1answer
573 views

Is there a Material 'Chips' UI component in the IOS HIG?

If so, is there a resource somewhere I can grab it or some documentation on it? Basically just want to have a list of tags that a user can delete. If the HIG has something i'd prefer to use that.
1
vote
1answer
43 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 ...
0
votes
2answers
78 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 ...
3
votes
2answers
174 views

Screen with multiple list crud

I have a screen with CRUDs For example: I will register a department and identify all job positions, equipment and employees Solution A: Display everything on a scrollable page Solution B: Display ...
6
votes
4answers
392 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)
3
votes
2answers
1k 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 ...
1
vote
2answers
109 views

How to support a “Save draft” to a wizard approach when the user takes a long time to complete a step?

I have simple user workflow, in which the User has to complete the process sequentially. But the step 2 might take a day or more to get completed. In the Current UI, If user decides to complete the ...
1
vote
4answers
45 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 ...
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 ...
3
votes
3answers
147 views

Should a cross platform desktop application use a uniform UI and design language across platforms? Or entirely native UI and design language?

I'm designing a cross-platform, desktop engineering app. I'm wondering whether I should make the apps follow native design practices (a la MS Office) or use the same ones for all platforms (a la ...
1
vote
1answer
156 views

Android UX/UI guidelines for smaller vs larger screen size and pixel densities

I'm an Android Developer that's not all that well versed in UI/UX design principles. In the projects I work on, I find that the biggest issue is accounting for the myriad of screen densities and sizes....
2
votes
1answer
110 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 ...
0
votes
1answer
38 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
50 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 ...
1
vote
2answers
213 views

Is there a recommended size for embedded maps or videos?

Basically what the title says. I know that anyone can do what they want, and I also know that the embedded content can be integrated in a responsive way, thus maintaining its original proportion. ...
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
1answer
105 views

Laying out radio buttons and text area in a dialog

I have a dialog where I need to lay out radio buttons and their corresponding text and icons, and a text area. This is my current dialog layout, where the colors denote the icons. Note that the last ...
1
vote
3answers
49 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 ...
13
votes
5answers
3k views

When creating a GUI wizard, should all pages/tabs be of the same size?

I understand that some libraries would force me to, but my question is general. If I have a set of buttons at the bottom: Back, Next, Cancel?, (other?), then should their location ever change? If the ...
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 ...
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 ...
2
votes
2answers
87 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 ...
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 ...
4
votes
4answers
85 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 ...
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
4answers
397 views

Handling Dropdown conditional Dropdowns

I'm working on a material design web-app designed for a mobile/touch environment. Obviously I have tight space constrains and would like to know what is the best-practice for conditionally providing ...
5
votes
3answers
173 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 ...
2
votes
2answers
59 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
29 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 ...
38
votes
15answers
27k views

What is the difference between wireframing and prototyping?

What is the difference between wireframing and prototyping? Am I right to think that prototypes should be interactive and wireframes should be static?
86
votes
13answers
18k views

When a button contains text and an icon, which should come first?

Assuming I'm optimizing for making it as fast and easy as possible for most users to find the button they need, what's the optimal ordering?

1
2 3 4 5
51