GROUP 9 kabarak uni DESIGN IMPLICATIONS.pptx

Design implications

1. GROUP 9 design implications The model human processor Cognition Attention Memory Perception Recognition Interface Metaphors Affordance Gestalt principles Mental models prototyping MEMBERS MBAKA AGGREY JOAN CHELENGAT NIXON CHERUYOT RONNIE ODHIAMBO COLLINS OMWOYO

2. Memory The Model Human Processor Analogy : “Processing and storage facilities in a computer system with the perceptual, cognitive, memory and motor activities of a computer user.” M emory refers to the ability to store and recall information over time. It refers to the storage of information in the brain and subsequent recall of this information at a later point in time. It is important to understand the impact of the user's memory on the design of the user interface in order to develop interfaces that are easy to use and understand. The design of an interface based on the characteristics of the user's memory can result in better recall and retention of the information contained in the interface. The use of virtual reality and touch-sensitive screens has been shown to improve the user's memory recall of the information presented in an interface.

3. Types of Memory Sensory Memories: They originate from sensory organs and are stored for a short period of time. In design, visual sensory memory ( iconic memory ), is the raw information from optic nerves that is stored and processed without conscious effort ( Preattentive Processing ). Short Term Memories: These are sensory memories of interest to us and they can be retained for longer if rehearsed. The capacity of short term memories can be increased by chunking (grouping items to form larger items). Long Term Memories: These are consciously transferred short term memories. Informational visualizations are often not committed to long term memory .

4. Design Implications Short term memory defines screen design and usability guidelines such as distinguishing visited links in browsers. To support recognition rather than recall ; visual hierarchy is used to show organization, the number of elements in each interface is reduced and larger interface contexts are divided into smaller chunks ( George A Miller’s Theory ). Designers are supposed to enable self-generation through interfaces that allow users to influence the customization because intentionally customized interfaces are easier to recall ( Jakob’s Law of Internet User Experiences ).

5. Cognition Cognition refers to the ability of the brain to understand and process information. In the field of user interface design, it has been shown that a good user interface is not only easy to use but also effective and understandable. It is therefore important to consider the user's perspective to develop effective and efficient user interfaces. Cognition has two general modes: Experiential Reflective

6. Experiential Cognition Patterns of information are perceived and assimilated. Appropriate responses are generated without apparent effort. Essential to skilled thought and behavior since it appears natural but might need training and experience. Reflective Cognition Involves thinking, comparing and decision making. Often leads to innovation and creativity. Requires the ability of a user to store temporary results and make inferences from stored knowledge. Implicates design because designers have to provide a theoretical basis for cognitive models of users. This will often characterize computer-mediated cognitive tasks as well as how information is processed at the interface.

7. Attention Attention refers to the ability of the brain to focus on specific items or events in the environment. it is the cognitive process of selectively focusing on specific information while disregarding other information in the environment. It is taking possession by the mind in clear and vivid form, of one out of what may seem several simultaneous possible trains of thought. Factors that might affect attentional focus include: Movement and Change Color Shifts Size and Intensity Number of stimuli

8. Design Implications Make information salient when it needs to be Use techniques that make things stand out like color ordering, spacing, underlining and animated visuals. Adopt temporal cues on user interfaces such as progress bars.

9. Recognition The major difference between Recognition & Recall is the  number of cues provided or given by the context  that can help memory retrieval.  Recall has fewer cues than Recognition  that’s why it is difficult and error-prone. In simple terms, the user’s should provided everything like visual cues, options, actions, instructions available which helps to avoid the memory load or cognition load and make the decisions error-prone.

10. Implications For Design The traditional affordance cue for a link is blue, underlined text. But that’s no longer always the case. Underlines can be omitted, and colors may be changed. But users still need to know that certain text is a link that they can click on. UX designers can communicate this by using a certain color for only links and nothing else, and by not underlining things that aren’t links. Because of patterning, users have come to expect that underlined text is a link, so don’t confuse them.

11. Interface metaphors A metaphor is a mapping process from a familiar object to an unfamiliar object. Roles * Facilitates interface development * Facilitates maintenance * Facilitates user orientation Interface metaphors evoke an initial mental model in users of the system’s structure and operation. Learning and retention of a system’s functionality is considerably facilitated by meaningful and consistent metaphors.

12. Interface metaphors have several design implications , including: They help users understand and navigate a digital interface more easily by providing familiar and recognizable concepts. They can make a digital interface feel more intuitive and less intimidating to use as users can leverage their prior knowledge and understanding of physical objects. They can help create a consistent and predictable interface as users can apply their understanding of the metaphor to similar interfaces in other contexts.

13. Implications for design Typewriter Metaphor : This metaphor is evoked easily and should be avoided. Desktop Metaphor: The direct association of user activity, and it is slowly disappearing. Filing Cabinet Metaphor: Used in online documentations, Multi-tab Web Configurations and Document Handling. Building/City Metaphor: Used to depict virtual worlds

14. AFFORDANCE The relationship between a person and a physical or digital object. UI affordances are perceivable actionable possibilities. Users observe a UI and decide which actions are possible based on their expectations and previous experiences. Categorized as : Explicit : Visible appearances clearly indicate possible actions Hidden : Hidden by default and become apparent once right conditions are met (Hamburger). Negative : Obvious that UI element does not currently afford any capabilities (Grayed Content). False: Offer false suggestions to users but fail to accomplish functionality.

15. Implications for Design Designers should follow design conventions by providing signifiers such as Home Icon> Homepage. Designers should provide immediate user feedback through functional animations They help us understand what actions are possible in an interface and how to perform them. They reduce the need for explicit instructions or labels as visual cues themselves can provide enough information for the user to understand how to interact with an element. They can help create a consistent and predictable interface as users can learn and apply affordances from one interface to others.

16. Mental models They are what people have in their heads and what guides their use of things. Designers design a conceptual model into their system in order to make it graspable and coherent to users. Mental models are vehicles for exploration and illustration.

17. Design Implications They help bridge the gap between the user's understanding of the real world and their understanding of a digital interface making the interface feel more intuitive and less intimidating to use. They can help create a consistent and predictable interface as users can apply their mental models to similar interfaces in their contexts. They can help users to understand the purpose and behavior of an interface as mental models provide a framework for understanding and interaction.

18. Prototyping Prototyping is an experimental process where design teams implement ideas into tangible forms from paper to digital. Teams build prototypes of varying degrees of fidelity to capture design concepts and test on users. You can refine and validate your designs with prototypes so your user interface can release the right mix of needs.

19. Implications for Design Designers can have a tool to experiment with associated parts of the users’ needs and problems—therefore, you can get insights into less-obvious areas of the users’ world (e.g., you notice them using it for additional purposes or spot unforeseen  accessibility  issues such as challenges to mobile use). Prototyping improves time-to-market by minimizing the number of errors to correct before user interface product releases of products.

20. GESTALT THEORY German term translated roughly as whole or form . These are concepts that make unity and variety possible in design. They are concerned with the relationship between the parts of a composition and the whole. “This theory assert, in belief that no figure is ever perceived except in relation to a background” Kurt Koffka The theory attempts to describe how people tend to organize visual elements into groups or unified wholes when certain principles are applied.

21. GESTALT PRINCIPLES Proximity Similarity Continuity Closure Symmetry Figure/Ground Common Fate

22. Proximity The relative distance between objects in a display affects our perception of whether or not are organized into subgroups. Close arrangement of elements causes group association: Close Proximity = Unity Shapes don’t have to be regular or have the same size (Flame Logo)

23. Similarity Objects that look similar appear grouped When similarity occurs, an object can be emphasized if it is dissimilar to others <Anomaly>. There can be similarity of shape, color, alignment, size, value, tone or combinations of other possibilities. Breaking the pattern of similarity creates focal points The more commonality amongst elements the more the coherence (Beatles Album Cover A hard Days Night)

24. Continuity Occurs when the eyes are compelled to move through one object and continue to other objects preferring to see a single continuous figure. Users resolve ambiguity by adding in missing data in such a way that they perceive whole objects. Perception of simplest paths (continuous forms) rather than complex paths (disconnected pieces). IBM Logo

25. Closure Technique uses human eyes’ tendency to see closed shapes. Users automatically try and close open figures so that they are seen as whole objects rather than bits of line. When a viewer’s perception completes a shape, closure occurs.

26. Symmetry Viewers tend to parse complex images in a way that reduces complexity. Even when there are multiple interpretations, our brains pick the simplest one. Asymmetry forces us to focus on what is different Pepsi Logo

27. Figure/Ground Our brains try and separate images into foreground and a background. Uses the idea of light and shade Could be used to introduce deliberate ambiguity as a visual trick.

28. Common Fate Similar to proximity and similarity but concerning moving objects since things that move with similar patterns are seen as grouped. Isomorphic Correspondence: Makes us think of something while looking at something else. When we encounter vague, ambiguous and difficult design messages, the Gestalt principles can help us define the problem and identify the solution.

29. Conclusions Recent advances in user interface design now consider the entire user experience as part of the design activity. It is not enough to simply consider the user interface, but the entire user experience is the important design issue. The discussion on user interface design must include the entire user experience. The user experience is a broad concept that applies to all aspects of a person’s interaction with the system. The user interface, which is the set of inputs and outputs that the user sees and interacts with, must fit within this larger concept of the user experience. User interface design must consider all aspects of the user characteristics as well as the myriad devices that the user will interact with.

30. Useful Resources Human reactions to information processing according to the Model Human Processor Card, Morgan and Newell on Design Tools for Effective User Interfaces George A Miller Theory on Types of Memory Cognition in Functional Systems and the Model Human Processor Jakob’s Law of Internet User Experiences Course Material Review : Jenny Preece Human Computer Interaction