“I try to look at design from a more conceptual standpoint.” — Cynthia Rowley
Apple iOS
(and iOS 8, iOS 9, iOS 10, iOS 11, iOS 12 and yes iOS 13)
A mental model is the mental representation of how a system (object) operates
A mental model is also sometimes called the user’s conceptual model
We form mental models to help us understand
Novice users of an object often have quite different (e.g. incorrect or incomplete) mental models than more experienced users (e.g. more accurate and complete).
An example of a real-world conceptual model for a fridge freezer (Norman, 1988)
The design model (sometimes referred to as the conceptual model) provides an overall framework of how users interact with a product
The system image is the physical appearance of a system, and its operation, responses to user’s commands, and related documentation.
PROJECT GROUP
Review your chosen open source/SFU community project, and consider if the user mental model is likely to match the design model, given the system image provided.
Design principles that effectively communicate the conceptual model, as originally identified by Donald Norman:
Elements of the interface, representing the various functions of a device, should be visible
Examples of poor visibility can be found in many office phone systems and digital wrist watches
Making everything visible at once is not really feasible, as the issue of relative visibility also needs to be considered
Progressive disclosure is a technique where the complexities of the interface are “revealed” as related functionality is required
For today’s multi-touch devices, the issue of discoverability is a related key factor to also consider
Affordances are the actual and perceived properties of an object that provide cues about how that object can be used and the results produced by that object
For graphical user interfaces, perceived affordances come into play – a combination of what you see and what you know (conventions)
Mapping concerns itself with the relationship between controls and the objects that they affect
Ideally, one control affects one object
“On our 900’s the replay function jumped back just enough to compensate for our reaction time when the commercial is over and we want to go back to watching the recording. It worked great! Now, on the Smart Control those functions are on dual function keys. When holding the rewind button long enough to trigger the replay function the fast forward keeps going, effectively increasing the effective reaction time so that I need at least 3 replays to get back to the portion of the program I missed. This design ‘feature’ was a really dumb idea for keys that depend on reaction time. A remote big enough for the extra 2 keys would have been much better.”
– Logitech Harmony Smart Control Reviewer
Natural Mapping is the spatial relationship between controls and the objects that they affect
This may involve both control layout and movement
Information reported to the user indicating that an action has been performed and what its result has been
Common techniques with regard to software interfaces include cursor changes, progress meters, message boxes, and previews
Constraints limit the number of ways that something can be used
PROJECT GROUP
Review your chosen open source/SFU community project, and consider the following aspects of the design:
Is a good conceptual model provided?
Are things visible? Is relative visibility considered?
Are (perceived) affordances utilized?
Are the mappings right?
Is interaction through feedback supported?
Are the power of constraints utilized?
(1): As defined by Trevor van Gorp and Edie Adams
PROJECT GROUP
Review your chosen open source/SFU community project, and consider the aspects of emotional design:
Accessibility is the practice of removing barriers that prevent interaction or access to websites by people with disabilities
Content and functionality should be available to everyone!
https://www.w3.org/WAI/intro/wcag
Information and user interface components must be presentable to users in ways they can perceive
User interface components and navigation must be operable
Information and the operation of user interface must be understandable
Content must be robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies
The design of products and services that consider the full range of peoples ability, age, culture and language
(1): Source: https://www.microsoft.com/design/inclusive/
PROJECT GROUP
Perform an accessibility audit on your chosen open source/SFU community project, considering the aspects of accessibility highlighted in today’s handout.
http://brightenstudios.com/blog/2013/4/9/hicks-law-applied-to-application-design
http://architectingusability.com/2012/06/11/how-users-skills-and-competence-improve-with-practice/
The Design of Everyday Things by Donald Norman
Amazon Design Team
http://www.joelonsoftware.com/uibook/chapters/fog0000000060.html
https://uxplanet.org/pull-to-refresh-ui-pattern-42a85f671cdf
http://www.lukew.com/ff/entry.asp?1071
https://www.interaction-design.org/literature/article/the-reflective-level-of-emotional-design
https://www.sarasoueidan.com/blog/lessons-from-seductive-interaction-design-book/
https://interestingengineering.com/20-struggles-only-left-handed-people-will-understand
https://www.themanual.com/living/us-six-flags-parks-ranked/
https://psychreviews.org/flow-in-7-steps-mihaly-csikszentmihalyi/
https://medium.muz.li/the-art-of-emotion-normans-3-levels-of-emotional-design-88a1fb495b1d
http://www.inclusivedesigntoolkit.com/whatis/whatis.html#nogo
https://twitter.com/msftenable/status/755502303952580610
https://designhammer.com/blog/difference-between-web-accessibility-usability
https://pixabay.com/en/mobile-iphone-apple-5s-girl-hand-666896/
http://www.inclusivedesigntoolkit.com/whatis/whatis.html#nogo