I’m reading “Display and Interface Design: Subtle Science, Exact Art”

Jurijs Kovzels
8 min readJun 1, 2021

And I will write about it here. Is reading in public a thing?

1/

“This book is about display and interface design.” says the very first sentence of the Preface. The book also promises “to be decidedly different from most books on the topic. This is not a ‘how to’ book. It will be very demanding and challenging book.

Ok, let see!

2/ But first — some housekeeping!

I will number tweets and paragraphs in the accompanying blog post with:

“x/ | y” e.g. “23/ | 45” — 23rd tweet, page 45.

The book is 463 pages long plus a preface.

🤔Snarky comments will follow after thinking face.

💭My loosely related thoughts indicated by though balloon.

3/

Book authors, Kevin B. Bennett and John M. Flach are professor of psychology at Wright State University, cognitive scientists and cognitive system engineers.

4/ | xix

[..] interface as a tool that will help an individual accomplish [..] work efficiently and pleasurably; it is a form of decision-making and problem-solving support.

I like this framing, UI should not always be about making people click CTA in the correct order without thinking. UI can extend your cognition. As pen and paper does. We use such tools along with the brain to become a better thinkers.

5/ | xix

A recurring question concerns the relation between the structure of problem representations and the quality of performance. A change in how a problem is represented can have a marked effect on the quality of performance.

I’m not sure I know what it means, and not sure why it isn’t just ‘relation between representation and performance’.

6/ | xix

There is an intimate, circular coupling between perception–action and between situation–awareness that contrasts with conventional approaches to cognition, where performance is viewed as a series of effectively independent stages of general, context-independent information processes.

I do not understand this. Something about those perception ideas by James J. Gibson but I don’t know enough about it to say for sure.

7/ | xix

Perception-action is the ability to “see” the world in relation to constraints on action. Situation-awareness — the ability to make sense of complex situations. Those two are closely related and affected by representation (or structure of).

8/ | xix

The design challenge is to enhance perspicuity and awareness so that action and situation constraints are well-specified relative to the demands of a work ecology. The approach is to design representations so that there is an explicit mapping between the patterns in the representation and the action and situation constraints.

UI should represent current situation and provide actions (affordances?) relevant to the situation. Ecology here means the actual (as opposed to lab’s) environment or situation, the human in it, and the information accessible to the human.

9/ 🤔 snarky sidenote alert:

Perspicuity. ⚡Perspicuity⚡, Carl! This is what I’m talking about, academics just can not use the words other mortals use, they need to dig out late 15th century word for transparent and use it instead. Especially fitting and ironic in the context of the quote.

10/ xx

We believe that the quality of representing the work domain constraints will ultimately determine effectivity and efficiency; that is, it will determine the quality of performance and the level of effort required.

I share the believe. Good UI makes good performance and required less effort from the user.

11/ | #1. Introduction to Subtle Science, Exact Art

Why another book on interface design/HCI?

Authors could not find a book that would do what authors need it to do.

🤔Mind that book is from 2011.

There are 2 kinds of books on UX: user-driven design, and technology-driven.

12 / | 2

#1 about capacities and limitations of people and designing of and around them. Think User-Centered Design books.

#2 about buttons, menus, error messages, and typography — interaction design. Think nngroup.com & About Faces by Alan Cooper.

13/ | 3

Combined, they form Human-Computer Interaction discipline or HCI. Traditional “dyadic” approach — human + interface. This isn’t good enough — the ecology is missing.

🤔I need to better word for “dyadic” — 2-side approach?

Our approach is a problem-driven approach to the design and evaluation of interfaces. By this we mean that the primary purpose of an interface is to
provide decision-making and problem-solving support for a user who is completing work in a domain.

14/ | 4

Cue problem-driven design:

1. tailor UI to specific work demands
2. leverage the powerful perception-action skills of the human
3. use powerful interface technologies wisely

🤔 I assumed that this is how you do design nowadays, but ok.

15/ | 4

This is a “triadic” approach.

2/3 — human/awareness and interface/representation of HCI, plus ecology/domain.

A.k.a Cognitive Systems Engineering or CSE.

16/ | p.4

Problem-driven interface design or CSE give tools:

1.to analyze the work domain (object)
2. find actions are effective to control the domain (actions/function)
3. uncover the information is needed for decisions (parameters)

It would be just fantastic if there were an algorithm for display and interface design; we could plug the variables in and produce the most efficient result every time. Unfortunately, to say that there is an algorithm of interface design is a gross exaggeration. [..] At best what we have are theories of cognitive systems and principles of design [..] however, they always need to be modified and adapted to the specific circumstances associated with the work at hand — hence the term “subtle science.”

17/ | p.12

Designers can not, and should not google or stackoverflow their way out of design problems.

The difference between art in general and art as it manifests itself in display and interface design is that in the latter we are required to convey very specific messages.

18/ | p.12

💭Long ago I was interested in ads business for exactly the same reason.

19/ | 12

[Authors] ultimate goal is to connect the science of cognition with the art of interface design so that the science is applied more subtly and the art is created more exactly.

And that’s it with the introduction. Up next: Chapter 2: “A Meaning Processing Approach”

2. A Meaning Processing Approach

20/ |16

Purpose of the Chapter 2 is to give an overview of 2 approaches to the process of interface design. Each associated with different approach to cognition:

* classical, 2-part — information processing
* ecological,3-part — meaning processing, the one we are all here for.

21/ |17

Both take roots in _semiotics_, which came from medicine — given the symptoms, and other available information, what is the diagnosis, and what are the appropriate actions. UI designers no something similar in a sense.

In the conventional approaches, cognition is almost completely divorced from situations; the only connection is the “scraps of data” at the sensory surfaces […] cognition is disembodied.

22/ | 17

2-part, information processing approach to UI design, framed by Ferdinand Saussure, is concerned about mapping or linking signals, data from outside, to internal mental concepts.

The background, context, actors, and environment are missing form the picture.

23/ | 17

Ecological approach, an alternative model, framed by Charles Peirce, embedded classical approach, but also includes actor and environment, and focuses on the links the parts.

24/ | 17

Going back to medical example, besides symptoms (data), and diagnosis (actions to be taken) there are is also patient’s medical history, current state, and doctor’s knowledge and experience (meaning of data).

25/ | 18

From Ecological UI Design point of view, the role of UI designer is to build representation of data to that user’s interpretation matched with not only with data but with meaning of the data in reality.

26/ | 18

It’s not the UI what should conform to mental model of users. It’s UI should shape user’s mental models to match the reality, or at least be the best possible models of the reality.

[insert the model illustration here]

27/ | 18

Authors use the work ‘meaning’ to refer to relationship between the ecology and representation. Meaning is the best of possible interpretations.

28/ | 18

In medical setting, it would be the meaning of symptoms taking into account patient’s health and medical history.

On nuclear plant the core temperature and pressure in the context of core chemistry, stage of the cycle and past few days of operation.

29/ 18

2.3.3 Information versus Meaning

Meaning processing approach to design is in line with the spirit Shanon’s of information theory.

Information theory says “that an event must be understood relative to a space of possibilities”.

[..] it is impossible to specify the amount of information communicated by an event without some knowledge about the possibilities [..].

Space is possibilities is the measure of information in the system or the complexity of the system. If you draw a ball with a number from a bit when all number are identical — no information is received/transmitted.

Space is possibilities ≈ work domain ≈ ecology ≈ situation ≈? number of states of the system.

💭 It is like a modal popup with just one button to close it. You get no information from the user, as opposed if there here yes/no or accept/decline buttons. You could use non-modal notification as effectively. And you do not get reassurance that user actually read the message either.

But the number of system states and probability of each state isn’t enough to design the UI. It isn’t the best, nor complete way to characterize the system and design UI.

This is especially true for systems governed by physical laws e.g. airplanes and nuclear reactors.

Missing part — constraints and boundaries of the space of possibilities.

Complexity of system vs Complexity of the representation

For a representation to be a good communication channel, it must be as complex as the thing being represented.

With an asterisk, representation — the UI — should be as complex, or variable, as system it represents and controls. Less complex UI means that information is lost. More complex UI means that additional information is added which does not represent the system, this information is noise.

When designer makes the UI less complex to meet user’s information processing limits, they should consider consequences of missing information. Design can end up oversimplified and lead to inadequate representation and control of the system.

💭 There is a difference simple UI and complex but clear UI.

Fortunately, as early researchers such as Miller (1956) realized, the complexity in terms of information does not place a hard constraint on human processing capacity […] due to people’s capacity to “chunk” or to recode the information [..] difficulty is not necessarily proportional to complexity.

Designers can use chunking and recoding capacity of user to the UI appear less complex and represent meaningful properties of system without oversimplification.

💭 Think Sparkline chart instead on raw readings, moving average vs trendline vs line chart.

Stuff I need to understand

  • structure of problem representations
  • quality of performance
  • perception–action (or perception and action): the ability to “see” the world in relation to constraints on action.
  • situation–awareness (or situation and awareness : the ability to make sense of complex situations)
  • meaning — what is that? UI is meaningful when it is useful guide for action.

Synonyms or closely related concepts

The book draws from multiple research, books and theories and sometimes uses a bunch of names for similar concepts. Therefore this section is useful to keep track of things and map one on another.

  • work domain ≈ ecology ≈ situation ≈ space is possibilities (in information theory)
  • perception and action ≈observation and control
  • currency ≈ units

Definitions/Glossary

Meaning is a property of situations associated with the possibilities and the consequences of action.

quality of performance — no definition, used 4 times. There is apparently relationship between quality of performance and structure of representations. See performance.

structure of [problem] representation — no definition, used 2 times. How is it different from just representation is unclear.

[human] performance — tbd

perception-action — the ability to “see” the world in relation to constraints on action. ‘Part of’ human cognition apparatus.

situation-awareness — the ability to make sense of complex situations. ‘Part of’ human cognition apparatus.

semiotics — the science of signs or signifying.

--

--

Jurijs Kovzels

Software Engineer, Product designer and manager. I help others create digital services and businesses. Now in Berlin.