The Complete User Interface Flashcards

1
Q

Why is it important to analyze how other designers use design patterns?

A

Because it helps you understand what works and what doesn’t.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

What is Center Stage?

A

Center stage is a design pattern where the most important information, panel, window, or toolset appears prominently at the center of the user interface. It helps users focus on what’s important when carrying out tasks.

Center stage, a common user interface design pattern, appears in most application: websites, spreadsheets, and software packages.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

What are Movable Pieces?

A

Movable pieces form a design pattern that supports multitasking. It allows users to resize and move panels or windows around the user interface. The ability to customize the user interface in this way also allows the users to prioritize their tasks and actions. It is a relatively problem-free design pattern to implement in a design.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

What are Titled Sections?

A

Titled sections form a design pattern that helps the user skim contents and identify interesting or useful information. They are sections of content in which each section has a title that clearly indicates the subject of that section. Users will be able to navigate a page quickly and effortlessly. Titled sections thereby help users to complete tasks.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

What is Responsive Enabling?

A

Responsive enabling is a design pattern in which the user is shown all of the information and user interface elements he or she needs for a task, but only those items necessary for the first sub-component of the task are enabled. As the user makes a selection, more options are enabled, whilst other, redundant options are deactivated.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

What are Two-panel selectors?

A

Two-panel selectors form a design pattern that enables users to view a list of items in one panel and view the content of a selected item in another. Traditionally used in email and file management applications, they are helpful when users need to switch between overall items and specific content multiple times while performing a task.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

What are scrolling lists?

A

A scrolling list makes all options available on the page, window or panel, with items further down the list accessed by scrolling. Scrolling lists are often used in user interface designs where there are a number of options that open in a separate section of the dialog box, window, page, or in another panel. Typically, scrolling lists consist of a column of options, arranged in alphabetical order, or some other meaningful sequence. The user can move back and forth (up and down) through these options by clicking the arrows, pressing the directional keys on the computer keyboard, swiping a touchscreen or scrolling a mouse.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

What are archive lists?

A

Archive lists consolidate data sets into broad categories, listed by the day, week, month or year in which the information items were uploaded or edited. As you can see from the example archive list below, for each action on a certain date, the type of action is added to allow the users to narrow their search according to the day and the group to which their target item would belong.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

What are list inlays?

A

A list inlay allows the user to view the contents of all items in a list, from one screen, by simply clicking on the item. Typically, the list shows clear labels or brief descriptions of the contents; then, upon the user’s clicking on an individual item, more in-depth details are shown beneath the corresponding label. The user is then provided with the utility to close the item by clicking on the general region of space occupied by the item contents, the brief list description/label or some designated button/icon, such as a plus/minus symbol.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

What are mega dropdown menus?

A

Mega menus (sometimes spelled “megamenus”) are a type of expandable menu in which many choices are displayed in a two-dimensional dropdown layout. They are an excellent design choice for accommodating a large number of options or for revealing lower-level site pages at a glance.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What are navigation module tabs?

A

A module tab is a User Interface (UI) design pattern where content is separated into different panes, and each pane is viewable one at a time. The user requests content to be displayed by clicking (or in some instances hovering over) the content’s corresponding tab control.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

What is Pagination?

A

Pagination is a user interface pattern that divides content into separate pages. If you scroll to the bottom of a page and see the row of numbers — that row of numbers is a site’s or app’s pagination.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

What is a Global Navigation?

A

Global navigation is a region of the graphical user interface reserved for buttons, links, search bars, or any other design element affording movement from one set of content to another.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

What are Breadcrumbs?

A

Breadcrumbs are an important navigational element that supports wayfinding — making users aware of their current location within the hierarchical structure of a website. Breadcrumbs are a list of links representing the current page and its “ancestors” (parent page, grandparent page, and so on), typically going all the way back to the site homepage.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

What are Search boxes?

A

A search box, search field, or search bar is a graphical control element used in computer programs, such as file managers or web browsers, and on websites with the dedicated function of accepting user input to be searched for in a database.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

What is Inline Linking?

A

Inline links are a design pattern that uses hyperlinked words—conventionally blue, underlined words—to guide users to another page containing related information. Designers employ inline links so that the information linked from the highlighted words does not clutter the user’s current webpage. Instead, users can follow the link if they are interested in finding out more.

17
Q

What are Tag clouds?

A

A tag cloud is a list of tags, where the font size of each tag is larger or bigger depending on its weight. Weight in tag clouds can be represented in three different ways: Size represents the number of times that a tag has been applied to a single item.

Tag clouds were a huge fad in 2009 and have actually been a fad for several years. Even so, usability studies show that most normal users don’t know what they are and don’t know how to deal with them.

18
Q

What are Sitemap footers?

A

A sitemap footer is a design pattern used to provide users with links that are important to all users regardless of their current position within the site hierarchy. In this respect, they act similar to the global navigation section of a webpage. Especially in larger websites, sitemap footers tend to relieve the pressure on global navigation bars.

19
Q

What are input fields?

A

Input fields are an essential user interface design element, providing users with the means to enter non-standardized responses. They are used in many different situations, but most people will have come across them when entering personal details and delivery addresses on e-commerce web forms, or sending online queries

20
Q

What is auto-complete?

A

By giving users the option of completing words and forms based on what they’ve typed before, it shortcuts their search and input tasks.

21
Q

What is refined search?

A

A refined search design pattern allows users to zero in on their desired content by indicating the specific category for which they want to display the results. It increases the users’ sense of control of events in the user interface, thereby ensuring the options are more and more specific to their current aims and objectives.

22
Q

What is a forgiving format?

A

The forgiving format design pattern allows the user to make mistakes. A forgiving format does not just correct mistakes users make; it also allows the users to take a variety of approaches to a problem so that in the event they do not know or have the ability to take one particular approach, they can resort to another.

23
Q

What are input hints?

A

Input hints form a design pattern that helps users establish what information they should enter into an input field. They are concise descriptions given inside or just beside the data entry fields, descriptions that guide users to input the right information. Such hints give users the confidence to complete their tasks without too much mental effort.

24
Q

What are your achievements?

A

Displaying achievements involves providing users with information relating to their performance levels. This design pattern can give them the incentive to persevere with a task, depending on the nature of the experience. Moreover, it can encourage users to get involved in an online community by offering them the opportunity to gain collectible achievements (e.g., ‘medals’ or elevated status).

25
Q

What are leaderboards?

A

A leader board is a design pattern containing a list of rankings representing performance in a particular category or overall standings. It helps to show users exactly how they are performing in relation to others, which can increase competitiveness. Examples from leader boards in user interface design include online gaming communities and online courses.

26
Q

What are starred reviews?

A

The starred reviews design pattern provides a visual rating system, by showing how many of the available stars other customers have awarded a product or service on average, helping users skim through collections of available items and compare them without having to wade through review texts. Showing the number of reviews used to determine the average adds comprehensibility.

27
Q

What are imported connections?

A

The imported connections design pattern allows users to import contacts from one application into another. Allowing the users to import contacts from one contact list to another saves them time and effort. It involves a series of steps that a user must take, which is communicated via a user manual, a step-by-step installation guide or a pop-up.

28
Q

What are Sign-in reminders?

A

A sign-in reminder is a design pattern that helps minimize the amount of time and effort the user must invest before he or she is able to resume an intended activity.

29
Q

What are update alerts?

A

Typically, update alerts appear when the user signs in to an account, such as a social media profile, displaying a list of activities that have taken place since the user last logged in. Ensuring the update alert is concise is vital, so the user can consume the information quickly.

30
Q

What are prioritized advertisements?

A

The prioritized advertisements design pattern seduces users into buying products or services that third parties offer. It is a dark pattern in which companies show advertisements as part of their own content. Designed responsibly, it clearly distinguishes the advertisements from the rest of the content. This way, users will be able to proceed with their tasks efficiently.

31
Q

What is Forced registration?

A

The forced registration design pattern is a dark pattern with which companies force the user to establish an account, providing the companies with his/her personal information. This information is not essential for using the user interface. Rather, companies gather personal information about the user to sell to third parties or send unwanted advertisement emails.

32
Q

What is Automatic opt-in?

A

The automatic opt-in design pattern is a dark pattern used to secretly subscribe you to newsletters or set an application as your default for a particular action. It uses a checked checkbox which, unless you uncheck it, indicates your agreement to whatever the company wants. Combined with unchecked checkboxes and cleverly phrased labels, a confusing opt-in/opt-out dance appears.

33
Q

What is Sneaking Into Basket?

A

Sneaking products into users’ shopping baskets is a dark pattern that tricks people into purchasing more than they intended to do. For this very reason, the European Commission illegalized this design pattern under the consumer rights directive. Often, this dark pattern is now replaced by suggestions of products that may be of interest to a customer.

34
Q

What is Implied Consent?

A

Implied consent is a dark pattern designed to trick users into not rejecting terms and conditions. By continuing to use a site, the users are providing their consent indirectly. Designers bury the message informing the user of this consent. They make the message visually compete for the users’ attention so as to make it easy to miss.