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

learn more… | top users | synonyms (1)

8
votes
3answers
504 views

To lower user's cognitive memory load or not?

Naturally, it sounds like it is only best for our users if our design could reduce user's cognitive workload when performing a task. However, there are also theories that explain the need for a ...
1
vote
1answer
234 views

Status Bars and their Nature [closed]

I want to know more about status bars, what are they useful for and what is the appropriate way to use them. I've noticed the following: Status Bars are always located at the bottom with the most ...
0
votes
1answer
188 views

What's the most beautiful navigation experience you've seen in an app in the last year? [closed]

I've noticed that all apps are becoming the same. Top and bottom navigation bars, and everything where you expect it to be. This isn't necessarily a bad thing, but has anyone seen anything thing ...
7
votes
5answers
405 views

Design Pattern recommendations for application assignment visualisation

I'm sure there must be some terminology for what I require unfortunately I'm not sure what it is. Anyway, let me try to explain, I have a selection of applications for courses that are to be assigned ...
2
votes
2answers
134 views

Where can I find info about rudimentary navigation / architecture paradigms?

I need something that refers to classic approaches to structure content and the reason to choose them over others. For example: Tabs - use tabs when the different sections co exist and can be ...
2
votes
3answers
149 views

What's the best way to show efficacy/difficulty of a certain solution in guidelines?

Background: I'm in the process of writing guidelines for use within the company. These guidelines list all sorts of possible solutions to a given problem, and each of them are rated according either ...
1
vote
2answers
244 views

Is there a design pattern for pull-down to <action> gestures?

Wondering if there is a design pattern for the RealMac Clear app on iOS that enables uses to create a list item by pull down? I have seen pull down to refresh on Android and WP7 issue, btw: ...
3
votes
2answers
222 views

Name of this semi ubiquitous pattern in Google Now search field?

With Android JellyBean, Google introduced Google Now, which is a fantastic addition in itself as far as I'm concerned. One interesting feature usability wise, something that dmh pointed out in a ...
4
votes
1answer
242 views

How would you design a two stage bar chart drill down?

A common design pattern I've used is using a horizontal bar chart to visualize numeric data about a series, and a click through drilldown that discloses a pane with more detailed information about the ...
2
votes
1answer
221 views

How to display large data over a full screen image slider?

On my website www.goo.gl/uompd I have a full screen image slider which works just fine (the images are from screenshots of other websites I have done). On the slider I want to put 4 text boxes, a ...
2
votes
3answers
284 views

Alternatives to display radio buttons vertically?

My preference is to display radio buttons vertically per common recommendations, per some research on completion speed, and to take advantage of Fitt's Law. However, I often get push back with regard ...
2
votes
2answers
219 views

Best way of selecting one option and a list

What is the best way of display a list of options nested within two options?I placed a mockup for reference to my question. If the user click the top radio button he should pick just one among all the ...
4
votes
2answers
279 views

How to best enter long digits on a small touch device without using keyboard input

my current task is to create an user interface for a mobile strategy game. stuff can be transported from point a to point b. the user can select an amount of stuff between 1 and 1.000.000. it is ...
2
votes
3answers
399 views

UI: name of multiple column interface?

Is there a "proper" name for the UI wherein it has multiple columns, and as you interact with the first column, the second column gets populated with with appropriate data? These columns act as a ...
4
votes
5answers
273 views

How to visualize similarity of one file to another?

Problem My file-system is a mess, over the years I've been accumulating way too many downloads I didn't care to uncompress and organize, code that was subject to endless copy+pastes and improvements ...
2
votes
1answer
505 views

What UI design pattern for choice between 2 actions comes to your mind?

My goal: find optimal UX/UI pattern. Pattern's goal: give a user choice between two actions. Simple example: http://dribbble.com/shots/599154-Choose-Your-Option Here is UX/UI pattern I implemented ...
4
votes
3answers
127 views

When should feedback be in-page and when should feedback be a separate screen?

I've seen feedback/confirmation on a separate screen for example when the user has submitted a form. Then the next screen they see: "congratulations you have successfully..." Then on other occasions ...
0
votes
2answers
177 views

Android/iOS: Homescreen [closed]

I have noticed more and more mobile apps are removing their home screen, especially iOS apps. What do you think of this? Personally I think sometimes an app's home screen is redundant, just a pretty ...
11
votes
6answers
2k views

Should I stick to Google's Android UI Design Patterns or not?

Both the official Twitter application and Facebook application use a similar set of UI design patterns in their apps. These patterns were set out by google themselves in this blog post. The thing is ...
1
vote
2answers
419 views

Long form sales page techniques and / or examples? [closed]

I've worked with a number of UX experts over the last several months and while I have resisted going down the "long form" path, they have circled me back around to this time after time without fail. ...
5
votes
2answers
3k views

Side navigation menus for Android tablets

The new trend of side navigation menus has taken over Android apps - Facebook, Evernote and now youtube and google+ are all doing the side navigation menu like here: Though it seems like this has ...
4
votes
2answers
191 views

Data to reinforce the 'large login form fields' style?

We're working on a site that requires the user to login to use. We designed a sparse login page with a large login form. Akin to Gmail: This seems to be the trend as of late. And it makes sense for ...
1
vote
1answer
142 views

How to represent asynchronous states?

I am working on an interface where there is a list of things (tests) that can be running, drafts or running and pending tests. In the latter options the same object represents two states (A - the ...
4
votes
2answers
814 views

Pattern to display Many to Many Relationships in two grids

Following is the data that needs to be displayed, to which the user can make changes or add new entries. For capturing a contract, there is a set of documents that is maintained and for each document ...
4
votes
2answers
233 views

How can you show human element without showing pictures of people?

With a company that changes all the time, how can you show the personal touch of human interaction without showing pictures of humans? Essentially, blurring the line between technology and people, ...
0
votes
1answer
141 views

Contacts and content, many to many relationship

The below screen shot shows a prototype I am working on in which an email gets personalised for multiple people. Contacts might share part of a personalization with another contact but not the whole ...
2
votes
3answers
150 views

How to map dependent attributes into a table?

Is there a pattern, which allows mapping the following datastructure to table columns? The clue is, that there are 2 attributes, which depend on each other, one should be entered, when the other was ...
13
votes
5answers
4k views

What is the navigation concept Bootstrap uses called?

The Bootstrap documentation site uses a very interesting navigation concept. They have a per-page navigation bar that sticks on top of the page once you scroll down and highlights the current area on ...
3
votes
1answer
478 views

New design pattern for tagging documents?

Working on the design of platform for keeping annotations, I came up with a new way of tagging items, which I call 'Drag to tag': Drag the tag to the words that are typical for the webpage to add ...
3
votes
1answer
117 views

Name that pattern: Notifications on reaching bottom of page

Over the last couple of months I have begun to see a pattern, but I don't know what it's called. The concept is that when a user scrolls to the end of the page, or a point close to the end of the ...
4
votes
6answers
584 views

Good example of a Keyboard Shortcut Manager implementation [closed]

I am implementing a keyboard shortcut manager in which the user can assign shortcut keys to global (or contextual) commands in a Windows desktop application. Note that the application has load of ...
4
votes
2answers
341 views

Best practice for displaying no of records on datagrid

I am designing a banking application where i have a record count of over 1000 rows. I wanted to understand the ideal design patterns for pagination and displaying rows on a data grid. I am ...
3
votes
1answer
1k views

Which design pattern is the best option for drilling down into data?

I have quite a large dataset which I need to display to end users. These data are grouped by super group, medium group and junior group. Medium groups are children of super groups, and junior groups ...
21
votes
2answers
1k views

Do progress bars help completion rates?

I'm expanding on a question I posed in comments on How do you indicate progress to users in a multi-step form?. Roland made the comment "because everybody wants to reach 100% percent" when discussing ...
1
vote
1answer
437 views

What are the best practices for designing quote request forms in the insurance industry? [closed]

Can any of you suggest studies, usability test results and patterns for best insurance quote forms? How is this different from ecommerce checkouts or does much of the research around this also apply? ...
2
votes
3answers
104 views

Formation of groups in a webpage

I have to make a webpage to associate users (around 30) together into groups. I have thought about a vertical list of users with radio-buttons (number of users) in the line. Example: groups 1 2 ...
7
votes
7answers
315 views

Is there any resource for UI examples? [closed]

I run a Usability/UX blog, and my biggest hurdle right now is finding examples to illustrate the topics I write about (bad error messages, good implementation of tabs, bad interactions...etc) So is ...
7
votes
2answers
289 views

Layout for adding one or more contacts to a record

The context: The user is creating a client record. Against each record their could be one or more contacts (people) provided. Often this will be adding 1 or 2 but could sometimes be up to 5-10. The ...
28
votes
7answers
3k views

When should you use a modal dialog box?

There seems to be an increasing use of modal dialog boxes on the web, but when should you use them? Why would you choose to use them instead of inline controls or another page, and when should you ...
3
votes
0answers
440 views

Apple sharing icon the way to go? [closed]

Clearly the Apple share icon is coming a vert popular web standard for sharing. Do you think it can become an conventional usage? Should we adopt it and promote it more?
18
votes
6answers
3k views

Autosave UI pattern

I'm developing a web app that puts great focus on simplicity and "just-use" mentality. The basic idea is to write notes. When planning the concept, we where very positive towards the idea of ...
23
votes
10answers
12k views

Alternatives to checkboxes and radio buttons in web-based surveys?

I've been tasked with designing a simple questionnaire design with a lot of different types of questions. I've been taking a lot of web-based surveys myself as well as testing some with users. The ...
3
votes
3answers
623 views

What is the best way to represent audio visually?

I've only taken some basic signal analysis courses, so I might be missing some things. Purely theoretical question: What methods exist for representing audio? What methods could be made for ...
3
votes
1answer
126 views

Suitable patterns for stating general availability

Does anyone have any suggestions of how best to allow a user state their general availability? Scenario: managing appointments Further info: The user in their profile has the ability to set the ...
3
votes
1answer
227 views

UI pattern for shared editing scope among selected elements?

I'm having a hard time researching this pattern for WPF, partly because I'm not exactly sure of the correct term for it. As best as I can describe it, here is how this editing pattern works: ...
21
votes
3answers
4k views

Best pattern for international address forms?

I've noticed an emerging pattern in web-based forms is to put the country field before city/state. This is contrary to how we would normally fill out an address on paper, but it allows us to have ...
4
votes
2answers
363 views

What is the best way to organize all UI elements of a website in one place?

I'm looking for a good way to help us organize and keep track of the latest version of UI elements. The simple way I've found is to have one big file, maybe 10000 X 10000 pixels with all your UI on ...
0
votes
1answer
227 views

A Good “Invitation to Connect” Experience

We are building an "connect with your friends" part of our app and I curious as to a good way to do this. My first thought is do like everyone else...so I look to Facebook, twitter, LinkedIn, ...
2
votes
1answer
140 views

Linking to external sites on a portfolio website

I'm doing some work on a portfolio site for a freelance writer. Their published work can be seen on various other sites/blogs and I'm thinking about the best way to link to these works. A straight ...
5
votes
2answers
461 views

UI Metaphor or Examples of configuration preset selection

What is a good UI metaphor for selecting from a set of configuration options? The tool I'm designing for has nearly 200 (!) inputs that can be set depending on your particular application and needs. ...