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
449
votes
21answers
78k views

Should a toggle button show its current state or the state to which it will change?

I have a quick question about buttons that toggle between two states. (Think Play/Pause, or Shuffle/Regular Play.) As the title says, should the toggle show it's current state or the state to which it ...
297
votes
15answers
47k views

Are carousels effective?

Go to just about any eCommerce site and the homepage is nearly guaranteed to feature a carousel - an auto-rotating panel, usually with some sort of small navigation, usually highlighting new product ...
87
votes
9answers
92k views

What is this side menu called that can be found in many multi-touch apps, and where does it originate from?

It can be found for example in the YouTube and Facebook app.
130
votes
8answers
21k views

Why might right aligned field labels be better?

For the longest time, I've used left-aligned labels in my forms, like this: I did this because I thought having the labels left aligned made it easier for readers to scan the list of labels. However,...
58
votes
5answers
47k views

What is the optimum button size of touch screen applications?

There was a not so recent blog post about the ideal button size of touch screen control sizes (sorry there is no link, the website is now a spam trap) that was based on the study form the MIT touch ...
74
votes
2answers
35k views

What is the significance of the three dots “…” on menus and buttons and how to use them right?

Adding three dots after the title of items in a dropdown menu seems to be a common practice (as you can see on the picture of a drop down menu in Google Chrome). They generaly mean that there is "...
30
votes
5answers
5k views

Should I use country flags in language selection fields?

My users can create content in different languages, and I need to provide an option to choose the language when they enter new content. Right now there are only 5 languages (en, fr, de, pt, es), and ...
38
votes
8answers
25k views

Should hyperlinks be blue?

I've built a site where all hyperlinks have the default colors: blue for links, purple for visited links. They turn red on hover. I believe that always using blue for hyperlinks is a good thing, so ...
49
votes
5answers
54k views

What are the best practices for tooltips on mobile websites?

What are the best practices for tooltips on mobile websites? I'm designing the mobile version of a website for customers' accounts (where they can see their latest bill and settings for their accounts)...
21
votes
8answers
21k views

How to indicate that specific sections of a page can be swiped

There are a lot of mobile UI design patterns that support swiping, and these are designed based on interaction and animation that indicate the behaviour. Examples include the 'swipe/pull down to ...
17
votes
6answers
4k views

Blinking, bouncing and flashing elements

I'm responsible for the UI/UX in a software development company. During my absence, some developers decided to implement a "bounce" effect on a button of a website that they think should have more ...
70
votes
12answers
8k views

What kind of design do users like the most at the time of this question, 'Flat' or 'Skeuomorphic'? [closed]

I have read multiple articles on-line that say that the era of Skeuomorphic design on the web is over, and that a new era of so-called 'flat design' is now the new thing for developers, but do users ...
60
votes
9answers
8k views

Adding a “none of the above” option to a list of checkboxes

I am working on a series of complex life insurance forms and trying to optimize using standard conventions... I have this nasty list of medical diseases and a mutually exclusive option, "None of the ...
12
votes
3answers
2k views

n-to-n selector UI [duplicate]

I am looking for a name of one specific UI element. I have unsuccessful tried to identify it before but this attempt failed. What I am looking for is an n-to-n selector where items move between two ...
374
votes
20answers
33k views

What explains the current shift from glossy UIs to matte UIs?

I've noticed an interesting phenomenon in the user interfaces of many famous applications, they're moving away from the glossy complex to a more dull and bare minimum design. Why the sudden change? ...
37
votes
8answers
45k views

Hamburger menu icons - should they be on the left or right?

Hamburger menus (the three small horizontal bars: the new menu icon). Should they be on the right or left? I'm only thinking of mobile and tablet applications. The pattern I see the most is on the ...
5
votes
2answers
2k views

What affords scrolling?

Besides the obvious: Scrollbar Touch interfaces (especially mobile ones) A sign saying "You can scroll here you know!" This for a desktop application.
17
votes
9answers
5k views

Scrollbar on the left

Is there a deep study that suggests to place a scrollbar on the right? Personally I move it to the left whenever possible (Firefox allow this, as well as xterm and emacs). I know that placing a ...
77
votes
9answers
21k views

How should you show that an accordion is expanded?

When you have an accordion, you need some way of showing the current state is expanded. There are a number of different ways of handling this, and each is used by a number of respected websites and ...
37
votes
11answers
7k views

Good reasons to use bad UI

When should we make a conscious decision to retain poor UI, even if temporarily? Not because of budget or time constraints but because of what I call the QWERTY paradox. In short, the QWERTY paradox ...
16
votes
7answers
1k views

Minimalism, Maximalism(?) or whatever?

Tufte & Nielsen believe that screen real estate is one of the most important asset for a (UX) designer. Utilize available screen space - Jakob Nielsen’s Alertbox: May 9, 2011 & The Visual ...
40
votes
9answers
5k views

What are the drawbacks of designing a Windows application to look like a Mac application?

I'm working with a company whose product is a Microsoft Windows application. As the UI/UX designer (and as a Mac user) I want to redesign the application so it is more visually appealing. Are there ...
30
votes
3answers
4k views

What to do when a page's content doesn't fill up enough of a fixed area?

An application has a fixed size, i.e 800x600 px. However, a problem I often run in to is that the page's content isn't enough. It's simply too little content on a big area. Consider the mockup below, ...
49
votes
6answers
22k views

What's the point of a “Read full story” button?

I've noticed a lot of news websites, particularly on mobile, sometimes will cut off their story with a button you have to click to see the rest of it. I can understand why they'd do this if they ...
11
votes
4answers
15k views

Multi-selection dropdown list implementation best practice

Many websites do not use multi-selection dropdown lists anymore, and the reason often cited by UX practitioners is that this UI element does not 'test well' with users. An example of what I am ...
10
votes
3answers
3k views

Mixing rounded corners and square corners

The question of the usability of rounded corners versus square corners has already be answered here. My question revolves more about the consequence of having them intermingled. I've heard some ...
9
votes
2answers
3k views

(One to many) to many form?

What is a good pattern for displaying a form with a One-to-many-to-many relationship in a web form for data entry? One parent element (a case - 15 data fields) One or more 2nd level elements (...
5
votes
3answers
800 views

Usage of Golden Ratio [duplicate]

Possible Duplicate: Why does the golden ratio work? Or does it? How is that to use the Golden Ratio for the design of graphical interfaces. when I use it or should I? and on designing ...
45
votes
4answers
108k views

Which color scheme to choose for applications that require long work hours?

I'm working on a ERP / Accounting (lots of tables and data) web app and was wondering what color scheme would be appropriate for this type of application? Users will be sitting in front of their ...
92
votes
11answers
40k views

Should a button become lighter or darker on hover?

We're having a discussion in the office about whether a button should become lighter or darker when a user hovers over it. Here are some examples from the field: Apple "Buy Now" button (Second is ...
66
votes
13answers
16k views

Best UI to allow expert users to enter an ip address? (IPv4)

I am working on a web application which requires users to enter an IPv4 address (in dotted-quad decimal notation) for most of the primary tasks they need to perform. Our primary target "user" is a ...
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?
14
votes
2answers
22k views

Modern Alternative to Tree View for Hierarchical Data

There are other similar questions to this, but none of the solutions really fit my problem space. Breadcrumbs and drill-down menus are not the solution. So without further ado: The design problem ...
37
votes
4answers
3k views

Where should the GUI light source come from?

I know that historically the light source on GUIs is in the upper left, casting a shadow on the bottom-right of buttons and the upper left of fields. Now, I see some places (like Apple) use a top ...
30
votes
11answers
18k views

What's the least confusing UI for offering to either enter a URL or upload a file?

I have a simple form where a user may contribute a link or upload a document adding a title and optionally some notes. What's the best UI for allowing for either a URL or a file (but not both)?
36
votes
6answers
6k views

What is the preferred behavior of form validation?

What is really the preferred behavior of form validation? When should the validation take place? When the user clicks "save" When the input field is out of focus As the user types Is the preferred ...
44
votes
7answers
2k views

Could scaring users be good UX?

I work on an application that's designed to be usable by new users, but has a lot of complicated configuration for advanced users. Our approach to keeping users away from delicate settings is to make ...
22
votes
2answers
9k views

Most intuitive multi-select component for the web

My target audience are users that are not familiar so much with computers so i try to simplify the UI elements in use as much as possible. For instance I try to avoid drop down menus and use big ...
28
votes
5answers
3k views

Best way to handle long URLs

I have a list that contains long, in terms of character count, links and I am wondering if my solution is a good solution in terms of UX. My solution is that if the link is over 80 characters, then ...
17
votes
7answers
7k views

What are some reference works for capitalization in UI text?

I'm currently in the process of updating the language files for a large web portal. Over time, a lot of inconsistencies have crept in, and so in different places you might see contrasting: Titles > ...
10
votes
3answers
18k views

What is the difference between web design, interaction design, user experience design, and user interface design?

It seems all four of these branches of design relate to each other at one point or another, and one can easily be confused for another by novices or outsiders looking in. Job postings online ...
46
votes
6answers
4k views

How can I highlight errors when bright red is the main color of the brand?

I'm working on a mobile website for a client whose main brand color is red. The website header and headings are all red. CTA buttons are red too. How can I effectively separate errors (mostly in form ...
16
votes
2answers
5k views

What is the expected paging behavior of a tree?

I'm working with a tree data structure, which should be visualised (like in a file manager). The server can calculate the whole tree and the client will display it. The possible size of a tree can ...
9
votes
3answers
1k views

What is the rationale for the design of search input fields?

Having read through a whole bunch of literature on search behaviour and looking at different design patterns, I am interested in the large variation of search input field on the web. Specifically, I ...
20
votes
6answers
63k views

What is the iOS alternative to a radio button?

There is a radio button in android and WEB but what is the best alternative in iOS? And please don't say segmented control becuase it's not working in my case. The case is a list of items 3-6 which ...
11
votes
3answers
5k views

Are there any special design guidelines for big touch screens (30–50 inch)?

I'm about to develop an application for a large touch screen (around 40″). Now to my question, are there any special design guidelines for such a large screen? I have read Android/iOS/Windows RT ...
10
votes
7answers
2k views

Why do the popular browsers copy each other's user interfaces?

Why do all the popular browsers blatantly copy each other's user interface? See these screenshots to understand what I mean: Mozilla Firefox (see Australis is landing in Firefox Nightly and ...
23
votes
5answers
6k views

What are the best practices of button alignment?

There are reasons to align buttons to the left, center, or right. What are the best practices of button alignment and what factors should we consider? Which buttons should be on the left, center, and ...
12
votes
6answers
28k views

What default font to choose for desktop applications?

Finding the right font for an application seems to be an art. There seem to be many standards. Arial seems to be used in most applications I have seen, Segoe UI is the standard for Microsoft Windows ...
12
votes
5answers
2k views

Zebra striping in dynamic table

Here's a hypothetical question partially inspired by a real scenario. Assume that you have a table with many rows of data. This table isn't static; rows can be dynamically altered, added and removed ...