Ui Test Flashcards
They are responsible for the more user-centered, behavioral and logical side of design.
UX Designers
They may be responsible for the copy and tone of voice of the product.
UX writers
These are the people you will be handing your designs over to build and to test
Developers
QA testers
Are the areas to the left and the right og the grid that act as a sort of frame for the content on the screen
Margins
Are vertical strips between columns
Gutters
Spacing slinside columns
Padding
A website or app that adjusts it’s appearance depending on the device by altering content hierarchy and layout, size, etc
Responsive website
Key Ranges in screen sizes that require particular changes to the layout
Breakpoints
Size of columb grids on each device
12 columns desktop
8 tablet
4 mobile
Are a set of laws arising from 1920s psychology, describing how humans typically see objects by grouping similar elements, recognizing patterns and simplify complex images. Designers use these via powerful - yet natural tricks of perspective and best practice design standards
Gestalt principles
Elements arranged close to each other are perceived as more rated than those placed further apart
Proximity
Elements placed within the same region are perceived as being groups of related information
Chunking
Visual clues that tell us how a product should be used
Affordances
Elements arranged in a line or a soft curve are perceived to be more related than those arranged randomly
Continuation
Our brain can perceive a group of elements as a single recognizable form or figure, so icons for example don’t need all the realistic detail to communicate what they are
Closure
Are visual clues that tell us how a product should be used
Affordances
The ability to present information with different levels of emphasis according to the importance of information
Visual hierarchy
Are go to solutions that solve common design problems
Design patterns
Are go to solutions that solve common design problems
Design patterns
For desktop apps and websites the most common types of navigation are
Horizontal (top) navigation
If you face problem with space which navigation you will use for websites?
Left hand navigation
If there are different categories and subcategories and sub-sun categories to your navigation, which navigation to use?
Global and secondary navigation
Apps that are built specifically for an operating system like ios or android
Native apps
Commonly used across many well-known apps like Facebook and Twitter. It allows us to buuble up key sections so users can quickly navigate
App bar navigation
This approach hides more detailed navigation in an off-canvas menu when users tap on hamburger or menu icon
Menu drawers
Bubbles up key actions that users may frequently take, like creating a calendar or event
Floating button
Mixture of navigation
Blended navigation
Are commonly used for contextual navigation, especially on website or app that go several layers deep.
Breadcrumbs
Are a well-established patterns on the web, especially with e-commerce sites. They’re commonly used in the hero area of sites that want to maximize the screen real estate, and give their content a dynamic feel.
Sliders/carousels
Are one of the most well-established patterns in UI design. Uses google
Search fields
A common navigational pattern used to display vast amounts of data in a manageable quantity
Pagination
Commonly used as a related content label, that can encourage browsing and serve as useful or interesting content for users to interact with
Tags
Some sort of movement in and movement out in animations
Easing
This is the default state of a form field before any slider interacts with it
Pristine
This is the state at which a cursor hovers over a text field
On hover
The state that appears on all screen types as it communicates to the user that they have interacted with the form and it’s ready for them to input their data
Selected/focused
Is a visual indicator that a UI element is not currently available for interaction
Disabled state
Is a useful visual indicator to confirm that users have interacted with a field and that a action has been successful on unsuccessful
Inline validation
A common method of selection in Ui. Are an effective control to select or deselect one or more elements
Checkboxes
Often used alongside checkboxes, serve as a single selection function
Radio buttons
Serve to contain multiple options in a space-efficient way.
Dropdown lists
Commonly known as call to actions
Buttons