Human-Computer Interaction

Download Chapter 2 of the workbook attached.

This mini introductory lecture tells us that cognitive science is the study of human input/output so that we can map their 'mental model' onto our system. We supplement this understanding by studying our user in depth and create summaries of what we have learnt with user personas, stories, journeys and flows.

In this lecture, we look at what the study of cognitive science actually is and why it is useful when we consider humans as one of the main factors of our design.

Humans have limited attention and so in this lecture we explore why and way in which to focus their attention.

In this lecture we look at perception and how our brains and eyes construct meaning and the many theories which cognitive psychologists have constructed. We look at Gestalt theory, cues, constancies, context and illusion.

In this lecture we look at short and long term memory and the types of memories we have. How we encode to remember and how we interfere to forget memories.

Managing expectations is the key to success in most areas of life, not just design and so in this lecture, we look at ways to manage user expectations by using appropriate models, cues, and tradeoffs. 

In this lecture we look at language in terms of linguistics, structure, semantics and semiotics, in order to see how we construct meaning from the ambiguities of natural language so that we can build better interfaces.

Emotions are not innately programmed into our brains, but they are cognitive states from the gathering of information and as such have a huge influence on our cognitive processes and impact on our perception, attention, learning, reasoning, problems solving, and our memory. In this lecture, we look at Ekman and Plutchik's classifications of emotions and how they impact all human interactions.

As humans, we are embodied cognition and we are situated, which means that we understand and process knowledge in terms of how and where we are in social, cultural and physical contexts. In this lecture we explore exactly what this means and how it impacts how we design.

In this lecture we learn all the different ways to research and get to know users, and the students learn how to design a cultural probe in order to gather all the information they need to design an app.

In this lecture students learn to create a user persona using all of the data they have collected so far. Creating a persona enables empathy and ultimately a better design.

Using the user personas, students learn how to create user stories which will help them when designing their app.

This lecture demonstrates to students how to take the user stories and make them into journeys either as a storyboard or as text boxes. This technique facilitates clear thinking about app design.

Taking a user journey, we translate it into a user flow diagram, students learn what each symbol means and how to consider the user from a 'system' point of view.

The moment we hid the code so that all users could interact with their computers, we then had to find new ways of making it obvious what buttons a user was supposed to press in order to get the computer to do what they wanted it to do. We had to decide on how best to design human and computer interaction.

Students learn here why data seems like such a big deal and how it is another key in our app design.

After this lecture, students will understand big, dark, and dirty data, psychological responsibility, data ethics and how data was collected before we had the online tools we have now.

In this lecture we explore automatic identification data capture from barcodes and QR codes to biometrics, wearables and implants.

In this lecture we learn what task analysis is, when to use it and how to construct a hierarchical task analysis diagram. https://www.nngroup.com/articles/task-analysis/

After this lecture, students will understand the limitations of artificial intelligence especially when dealing with big data and why robots will not be taking over the world anytime soon.

Other modelling approaches include:  cognitive, conceptual and formal.

Links to cognitive architecture: https://web.archive.org/web/20011116153233/http://ai.eecs.umich.edu/cogarch0/common/theory.html

Students will understand that storytelling underlies all communication and that we can tell a story very briefly, for example, our user stories, and that the way we present our results is key to making users trust and want to use the systems we design.

Using the NatWest bank as an example, in this lecture, we look at how unnecessary data re-entry of information should be avoided because it introduces errors. And, how we can design for accuracy by ii) employing the automatic population of data fields, ii) putting constraints on data entry and, iii) using confirmation and feedback to make sure that the data the user has entered is accurate.

In this lecture we look at the Futon company website and how their responsive javascript generated an inaccurate delivery option which left me without a delivery. We analyse what went wrong and design a new solution which makes all the options available without needing conditional/responsive code which in this case went very, very wrong.

This 3-minute lecture defines what a prototype is and how historically prototyping began. Then it looks at the first computing prototype and the different styles of prototyping software engineers use.

There are many reasons why we should prototype. In this lecture, we take a look at the advantages of prototyping in order to create a better design.

There are three levels of prototyping: low, medium and high fidelity. We look at each level and consider the pros and cons of which one to use when we create a prototype so that we can have something to facilitate conversations with  our users and stakeholders.

It is never too early to think about which platform we wish to design because whether we are designing a mobile app, or software for a desktop, the platform we choose will affect the design process in many ways.

In its day the 'Desktop Metaphor' completely changed the way we worked and led to the field of HCI as it expanded to include graphic designers, psychologists and so on. In this lecture we look at how it was a paradigm shift along with: 'WIMP',  'Direct Manipulation', 'Recognition over recall' and Don Norman's 'Discoverability' which were the basis of the first graphical user interfaces.

By having a classification of interaction types, Preece et al says that it helps designers to be more systematic when thinking about the usability of their systems in a given environment as well as help designers formulate a conceptual model before committing to a particular interface.

We cannot design a user experience we can only design for a user experience as our users bring as much of themselves to the design as the designers do.

How many Laws of UX are there? Where do they come from? In this lecture we consider these questions as we study the lawsofux.com website which uses an archetype to infuse its brand with authority. We end the lecture with a call to action to compile a list of UX laws that we have learnt in the course so far.

Not a law or a tool but a micro lecture on the Dan Saffer's Microinteractions, those tiny interaction moments - audible and tangible - which give us satisfaction and heighten our user experience.

In this lecture we understand why information architecture is so important as we apply Dan Brown's eight principles to the BBC website and many apps.

One excellent UX technique is to design around core content, regardless of the stakeholders involved. If you design around content rather than business goals, you immediately get to the functionality of your site or app, and in this way produce better designs.

The card sort is a useful UX technique which helps designers in collaboration with users and/or stakeholders to organise and structure the content of the website to provide good information architecture whilst also providing an insight into users' mental models and expectations of how the site should work.

Search engine optimisation traditionally went hand-in-hand with UX techniques such as information architecture, good navigation using breadcrumbs and web usability and accessibility using web standards, though it was focused on being found by future users. We look at the changing trends in SEO.

After this lecture, students will have their paper prototype at the ready so that they can design their app using what Ruth calls the five effs! Each eff has a lecture and a handout.

Students learn different techniques pulled from design theory, ux, and cognitive science to encourage their users to 'focus' on what the app does such as focusing on core content, responsive design, mental models, and gestalt theory - alignment proximity and highlighting.

Students learn that humans are cognitive misers and resist learning new things so make our apps 'familiar' by using transference, mimicry, mapping and how we don't need to reinvent the wheel.

Students learn good 'feedback' techniques: the status bar, error control with consistency, constraints, and confirmation.

Students learn different ways to make their app feel 'forgiving' with progressive disclosure and depth of processing, hick's law, wayfinding, again error prevention and constraints. We want our users empowered.

Inspired by Apple, we consider the golden ratio, rule of 3rds and look at all the ways attractive things work better. Yes, us humans are biased so why not design for that with art infusion? But there is always a trade-off.

Ruth introduces the three ways to evaluate your design.

When designing for user experience, designers often aim to design for experiences such as 'emotionally fulfilling' or 'rewarding' so we briefly consider how we would go about using these terms to create our UX goals and UX strategy so that we use not only aim for them, but also employ them as a benchmark during the evaluation of our design.

Students learn expert reviews, heuristics and cognitive walkthroughs.

Students learn about the advantages of user testing and how go about doing just that.

Students learn different ways of collecting empirical data from questionnaires, webstats, and so on, so that they can produce statistically significant results should they need them.

Aesthetics are important in design, in this lecture, we look at archetypes, the art infusion effect, and how we are naturally biased towards artefacts which are designed to be very attractive, for they light up the reward centre in our brains.

Students will learn about the two ways users user social media for business (productive) and for fun (experiential), the following lectures look at these two ways as well as social anxiety on social media.

After this lecture, students will understand that the types of information we share online fit into our basic needs as defined by Maslow's hierarchy of needs.

We are all social animals on social media and after this lecture, students will see that technology is as an extension of us as we have taken all of our prejudices and aggression online.

Picking the right platform is key to not feeling social anxiety on social media.

Social media can be looked at through the lens of game theory. After this lecture, students will understand game theory and how it applies to social media.

After this lecture, students will understand the connection economy.

Designing dialogue: Plans and situated actions through scripts

What does the future hold? No one knows, but after this lecture, students will understand how design often  uses fiction (the imagination) and serendipity. Ruth also considers the future with respect to the Internet of Things and Artificial Intelligence.

A farewell and thanks from Ruth.

A behind the scenes peek at the help Ruth got when creating this course.

Ruth's journey in computing, gacha style.

NEW: Watch a potted guide to the history of computing taking us from Antiquity, Ada Lovelace who inspired Alan Turing and in turn, Von Neumann architecture, to Grace Hopper and COBOL.

This lecture originated from a question a student asked in the Q&A of the communication section.

Can we invent tasks?  And I refer you to the discussion there.

Here, we consider novel tasks and how, though seemingly new, especially in the so-called 'disruptive technologies',  they are still the progression of work already undertaken. We consider Raymond Loewy's MAYA approach - novel but familiar - so that are users are happy to discover new features in the ways they currently work and we also consider two academic approaches to new tasks: technology probes and serendipitous design which uses the no function in structure principle.

Margaret Hamilton invented the term software engineering during her time at NASA and using  a simulated model of the flight cockpit, Hamilton and her team were able to save the astronauts on several occasions by having pre-empted users errors and ensured that the software could recover from them.

The very first computers used punch card technology and QWERTY keyboards. In this lecture we take a trip into the distant past and discover the world of punched paper in looms, adding machines and self-playing pianos. Then we look at the telegraphs, teletypes, and DVORAK keyboards to understand how we got to the input and output we use today.

In this lecture we  look at Sketchpad, the first graphical user interface, and the invention of the TV typewriter and how this made a huge difference to the way users interacted with their computers.

We look at the history of voice and speech recognition from the Audrey which recognised only digits to Google, Siri and Alexa who do individualised speech recognition with varying degrees of success.

We look at the first touchscreen and capacitive sensor technology and how Apple's iphone made Bill Buxton's multi-touch technology popular, then we explore how the parallax effect is created.

Jakob's Law states that people spend most of their time using digital products other than yours. Make sure you manage your users' expectations by making sure that your product is similar to everyone else's so that it keeps your users happy.  https://www.nngroup.com/videos/jakobs-law-internet-ux/

Hick's Law states that the time it takes to make a decision increases with respect to the number of options with which a user is presented. In this lecture we explore the maths and when and where to use Hick's Law.

Moore's Law is the observation made by Gordon Moore in 1965 that the amount of transistors which could be placed into a silicon circuit doubles roughly every two years. In this lecture we explore exactly what this means and the impact it has had on the computing industry.

Fitts' Law describes how pointing at a given target becomes less speedy and less accurate the smaller and further away it is. In this lecture we explore the maths and what Fitts' Law means in practical terms.

Miller's magic number seven plus or minus two is the optimum number of items a human can hold in short-term memory without overload, in this lecture we explore this number and Miller's Law.

When you take the form (or structure) outside of its natural context or situation, so that there are few clues as to what an artefact was originally designed for, users may find completely new functions for it. This is known as the no function in structure principle.

This lecture describes the design theory of function, behaviour, and structure when designing an artefact, asking three questions: What is its purpose? 1. (Function) What will it do? 2. (Behaviour) 3. What will it look like? (Structure).

One of the first papers on function, behaviour, structure, published in the field of AI in Design, by John Gero, called 'Design Prototypes: A Knowledge Representation Schema for Design' and appeared in AI Magazine, 1990, is added below.

English professor, Marshall McLuhan coined the phrase the medium is the message to describe how television and the telephone alter society, in this lecture, we take a look at what this actually means and how it applies today.

This overview defines Design Theory, Design Science and Design Research , Design Thinking and by looking at a socio-technological system in a hospital we look at the statements made by UX Psychologist Don Norman who has said that we are all designers and compare it to Architect Paul Grillo who says that we all experience design.

In this lecture we consider the three different types: The archetype, the stereotype and, the prototype, and how they come to be designed: Invention, innovation and development (or routine), and how this impacts what and how artefacts come into being.

When we are designing we need style and standards so that we can not only improve the world but also communicate that improvement clearly so in this lecture we look at how companies, brands and movements alike use styles and standards for innovation, productivity and for inspiring confidence with familiarity and memorability.

This lecture covers colour theory. We look at the symbolism and use of colour throughout history, Lemieux' practical guide to colour mixing and colour combinations in painting and Newton's colour wheel, along with the use of colour in branding and marketing.

Using a space of solutions is one way to come up with new designs. We manage it by using constraints, boundaries, design fixation, transformation, combination and exploration, and if all else fails, we remove the walls of the solution space and think outside the box.

A theory, which has been heavily debated in modern architecture and industrial design, is that form follows function, a concept attributed to an 18th century monk Carlo Lodoli, whose theories on architecture have influenced many designers.

Form follows function states that the purer the functionality of an artefact, the more beautiful it is. Or simply put: less is more.

UX designer Don Norman's very popular book 'The Design of Everyday Things' illustrates cognitive science principles such as:  affordances, consistency, confirmation, transference, and metaphors for remembering really well using everyday things with which we come into contact.

Don Norman summarised user-centred design in seven principles.

Ben Shneiderman first suggested his eight golden rules in 1986 as a guide to designing graphical user interfaces and dialog(ue) design, not long after the invention of the personal computer. Shneiderman has revised them over the years. Here they are in all their golden glory.

Dix et als three principles for usability : 1) Learnability - the ease with which new users can begin effective interaction and achieve maximal performance;  2) Flexibility - the multiplicity of ways the user and system exchange information and;  3) Robustness - the level of support provided the user in determining successful achievement and assessment of goal-directed behaviour.

Jakob Nielsen's 10 general usability heuristics for user interface design are broad rules of thumb and can be used as a guide for designing interaction as well as for evaluating whether we have achieved our design objectives.

Brenda Laurel builds on Aristotle's six structural elements of drama, to illustrate that these principles can help us understand what people experience when interfacing with computers. As technology advances, it becomes easier and easier to look at the computer as a character in a drama.

Saul Greenberg's nine principles of UCD and slides, from way back when, but they are still as relevant, today as they were back then. Including online help, though of course we have YouTube nowadays too.

Preece et al, describes design principles as triggers to creating good design whilst not adhering to them too strictly otherwise they can create more problems than they solve. They list: visibility, feedback, consistency, constraints, affordances and trade-offs.

Design patterns were invented by architect Christopher Alexander and adapted by urban architect Bill Hillier to model patterns in space for better urban development. Design patterns were adopted first in software engineering by Erich Gamma, and then to HCI by Jennifer Tidwell.

In this lecture we look at Jesse James Garrett's elements of UX and consider its usefulness in organising the UX laws and tools and HCI guides and rules, we've learnt so far in the course. At the end of the lecture, there's an invitation to design our own guide.

In this exercise, we take all of the guides and rules from above and create our own version.