1 / 7

UI Design Patterns

Autocomplete & Collectable Achievements. UI Design Patterns. Autocomplete. Problem: Users needs to enter information into a text box which can be easy to mistyped, hard to remember or has many alternative options. Solution:

iris-campos
Download Presentation

UI Design Patterns

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Autocomplete & Collectable Achievements UI Design Patterns

  2. Autocomplete • Problem: • Users needs to enter information into a text box which can be easy to mistyped, hard to remember or has many alternative options. • Solution: • Present items that match what the user is entering into a text field, even though the user is not entirely done typing in his or her search query. • Matching items are narrowed down as the query gets more specific. • Make it possible to select one of the presented items by a mouse-click or keyboard arrow navigation as the user types text into the text field.

  3. Pros & Cons of Autocomplete • Pros: • Relies on the principle of recognition over recall; instead of users having to recall a full and exact text query, they rely on recognition to select the best match from parts of the query they recalls. • The user can search or select the query he or she was looking for a lot faster. • Helps to ensure that the user submits a valid form by providing accurate information to the users. • Helps to remove alternative options when the user inputs his or her query. • Cons: • Users might forget what their searching for when they see the list of options. • Annoy the users when it doesn’t display their query that their searching for.

  4. Examples • Good Examples: • Google • Some travel booking sites (hotwire, expedia, orbitz, kayak, and etc.) • Some product buying sites(amazon, ebay and etc.) • Bad Examples: • Some social media sites (facebook and etc.)

  5. Collectible Achievements • Problem: • Some users respond to opportunities to earn or win awards that can be collected and display to other community members. • Solution: • Reward users for attaining or completing certain goals within the community. • Develop attractive trophies, icons or game pieces to represent each achievement. • Provide a mix of difficulties; make some achievements very easy and quick while having others require time and effort to conquer.

  6. Pros & Cons of Collectible Achievements • Pros: • Gives users a sense of accomplishment when visiting your site. • Keeps the user’s interest in the site by allowing them to earn rewards. • Gains user’s loyalty. • Cons: • Have to develop and design new achievements for the users, or users will get bore and tire of the site. • Have to decide a good balance for easy and hard achievements.

  7. Examples • Good Examples: • Xbox live community • Steam community • Bad Examples: • Facebook games achievements

More Related