Inclusion through User Experience

How many words do you understand right away? Words matter. Wording and terminology make a difference in usability and user experience. If you struggle with words then you’ll also perceive a poor usability of a product or service. Jargon includes or excludes people from certain groups. Hence, as a designer please pay attention to the terminology in your product.

Happy Chinese class in Hamburg

A class of Chinese students has fun with recursive displays.

When I teach in front of Chinese students at the Brand Academy in Hamburg – although their German is much better than my Chinese – I am always aware of the issue that some thoughts might get lost or might change their intended meaning on the way from me to them. I mean, this can always be the case and it is astounding that communication works at all. But in this setting it is pretty clear that we have in addition to all language issues also a cultural gap that runs right through the middle of the class room. We have a different background just for instance because of the different TV shows we watched while growing up. The next generation might even ask, „what is TV?“

User Experience is what happens inside the user of a system or service before, during and after she uses the product or service. If you take teaching as a service then you can apply UX design principles also to the situation in the class room. In this setting inclusion means that the lecturer’s aim is to reach each and every student regardless of any circumstances like language, gender, age, prior education, home sickness or world championships in any kind of weird sports. I see inclusion as a humanistic attitude to respect and love your audience.

Well-designed user experiences allow for the uniqueness of people’s different strengths and believe to co-exist in a place of similarity and common ground.  Tools and technologies that embrace similarities to tap into the potential of all people creates conditions that promote people to be their best selves, to cultivate and nurture people will produce better outcomes in all we do.  – worldusabilityday.org 29-Oct-2017

What? “user experiences…believe…” what? This is taken from this year’s home page of the world usability day. After pointing out my problem the authors confessed that they do not understand either. Here is my proposed update:

Well-designed systems and services offer great user experiences for all kind of people regardless of their background, their education, or their current situation. Each one has different strengths and weaknesses that should not exclude him or her from participating in professional or social life via communication technology. Tools and technologies that embrace similarities to tap into the potential of all people create conditions that promote people to be their best selves; designing usable tools to support people will produce better outcomes in all we do.

I hope this is an improvement. I hope this paragraph can be understood and you agree to the intended meaning.

Have you already scheduled your World Usability Day? We can even meet at our panel on Innovation though Inclusion. How many words do you…?

A spiffy computer mouse

A spiffy computer mouse. Sometime it can be quite hard to empathize with the user.

Altonas Stadtgeschichte 1780

Beschreibung der Stadt Altona 1780

Altona, diese ansehnliche Stadt, deren bergichte Lage an der Schifreichen Elbe den reitzendsten Anblick verursacht, entstand vor ohngefehr drittehalbhundert Jahren aus einigen Fischerhütten, welche zu einem Dorf anwuchsen, das zwar 1547 abbrante, aber in einem Jahre vergrössert wieder hergestellt, und 1548 in die Kirche zu Ottensen eingepfarrt wurde. So sehr die Grafen von Schaumburg Altona zu vergrössern suchten, indem Graf Ernst es 1604 zu einem Flecken machte, so blieb es doch sehr mittelmässig. Nur unter seinen Königen konnte es zu derjenigen Grösse gelangen, worin wir es jetzt erblicken. 1640 war dieser glückliche Zeitpunkt, so traurig er damals scheinen mochte, da Altona, mit Absterben des lezten Grafen Otto von Schaumburg seine königllichen Beschützer erhielt, und unter König Christian den IIIten schon ansehnlich zunahm. Friedrich der IIIte gab Altona 1649 eine Kirche [Lutherische Kirche], 1664 das Stadtrecht und 1669 ein Rathaus. Christian d. Vte befestigte das gute Vernehmen zwischen Hamburg und Altona durch den Copenhagenschen Vergleich von 1692. Diesem Eifer folgte Friedrich der IIIte welcher die Kirchen, Justiz und Policey Sachen verbesserte. Nun aber entstand der traurige Zeitpunkt, wo Pest, Krieg und Brand den Untergang dieser aufblühenden Stadt drohten. Denn 1711 brannten über 200 Häuser ab, die lange u. breite Strasse nebst der Juden Synagoge u. Raum war dieser Schade ersezt, als 1713 die unerbitterlichen Schweden die ganze Stadt in die Asche legten. Doch Friedrich half ihr aus dem Steinhaufen desto schöner wieder empor, u. die Stadt wuchs desto schneller, um ihren vorigen Flor zu übertreffen. Christian d. VI te stiftete 1738 das Academische Gymnasium, lies eine neue Kirche, das Zucht und Werckhaus u. das Waisenhaus errichten. Noch empfindet jeder Bürger das Glück, welches es dem verewigten Friedrich dem Vten zu dancken hat, da schon unsere nächsten Nachbarn unter der Last des Krieges seufzten. Wer befördere die Aufnahme der Stadt mehr als Friedrich, dessen Fußstapfen unser theuerster Christian mit Landesväterlichem Eifer folgt?
Die weisesten Verordnungen für das Wohl dieser Stadt, u. das hieselbst errichtete Münzwesenzeigen, wie sehr dieser huldreiche Monarch seine grossen Vorfahren übertreffen werde.      So ist Altona nach vielen Ungewittern so angewachsen, daß man jetzt auf 4000 Feuerstellen u. 17000 Einwohner rechnet, u. da es anfänglich unter Ottensen stand, so steht dies jetzt seit 1714 unter der Gerichtsbarkeit der Stadt. Handlung, Manufacturen, Fabricken, Religions Freiheit, haben Altona groß u. volkreich gemacht. Ein unschäzbares Glück für Altona ist noch dies, daß es jederzeit die ruhmwürdigsten Männer, u. viele rechtschafne Bürger u. Patrioten gehabt hat, woran es jetzt vorzüglich reich ist.     Die Vorsicht erhalte uns Christiane und Friedriche, so wird Altona sich eines dauerhaften Flors u. Wachsthums freuen können.

Man sehe die Beschreibung der Stadt Altona von dem Hrn. Sachwalter Schmidt daselbst.

// Transcript des Textes der Karte Grund-Riss der Stadt Altona PPN609101145 von 1780
// Scan der Karte cc-by Staatsbibliothek Hamburg; Info via CDVNord – Historische Karten der Stabi Hamburg

Zwei Beamer Usability @mprove

Es war ein Experiment einmal mit zwei Projektoren zu arbeiten.
Es hat funktioniert! 🙂


Dewey, Huey und Louie an der Decke

Da kein Präsentations-Tool zwei Beamer gleichzeitig ansprechen kann, galt es zunächst eine Konfiguration zu finden, die sowohl bei der Ausarbeitung des Vortrags, als auch in der Live-Präsentation eine gute und robuste und vertrauensvolle Umgebung bietet.

Technisch war es in der Vorbereitung ein Keynote-Dokument, das für zwei Screens konzipiert wurde: ungerade Folie links – gerade Foliennummern für den rechten Beamer.
Dann wurde die Keynote-Präsentation auf zwei MacBooks verteilt und lokal jeweils die anderen Folien verborgen. Letzteres ging ganz gut in der Thumbnail-Ansicht mit gerader Anzahl an Folien pro Zeile. Dann ist es ein Multiselect über die Spalten, die man dann per Kontextmenü verbergen kann. Strike!

Die üblichen Klicker sind mit so einem Setting auch unbenutzbar und ganz nutzlos. Wie soll es gehen? Ein Klicker für zwei Computer? Zwei Klicker mit dem sicheren Usability-Flaw sie unter Lampenfieber zu verwechseln? Das Problem ließ sich durch zwei Mäuse auf dem Rednerpult lösen, die deutlich nebeneinander lagen und per Click die Slides weiter schalteten.

Man könnte vermuten, dass mehr Projektionsfläche zu noch mehr Reizüberflutung beim Publikum führt. It depends. Wenn man die Slides sinnvoll aufeinander bezieht, dann kann es in meinen Augen auch deutlich klarer werden. Ein Folienwechsel in halber Frequenz entlastet zudem das Kurzzeitgedächtnis, indem bei progressiven Diagrammen beide Phasen nebeneinander gezeigt werden können. Sliding-Slide-Transitions unterstützen die Illusion, dass Inhalte von einem Beamer auf den anderen verschoben werden.  Zusammengenommen sind das viele Vorteile, die den komplexeren Aufbau gerechtfertigt haben.


Ceci n’est pas une présentation

AlgoRhythm is it! Reflexionen in einer programmierten Welt

à propos

Was ist die Aufgabe des Künstlers?

Da kommt Ionesco herein: „Alles ist sagbar in Worten. Nur nicht die lebende Wahrheit.“ […]

Was ist die Aufgabe des Künstlers? Es gibt Sachen…, es gibt viel Sachen, vielleicht sind es die wichtigsten Sachen, die wir wissen, wir alle hier, die wir nicht sagen können. Die Sprache reicht nicht aus. Und die Aufgabe des Künstlers ist die Grenzen der Sprache ja zu, zu zersprengen, wenn möglich; aber es ist nicht möglich.
Besonders der Dichter ist gefährdet. Dichter ermorden sich selbst – aus Frustration sozusagen. Aber die Aufgabe des Künstlers ist irgend einen Weg zu finden, die Aussagekraft des Menschen zu vergrößern. Dieser Weg kann Malerei sein, es kann Gedicht sein. Es kann Musik sein. Es kann der Roman sein usw. Ich denke hier an Ulysses, zum Beispiel der Roman. Ein Tag(!) in einem Leben. Das ist so’n dickes Buch.

Sie spüren eine Hand auf ihrer Schulter. Was passiert. Und jetzt versuchen Sie es aufuschreiben. Sie kommen nach Hause und hatten eine Erfahrung: die Hand auf der Schulter. Was auch immer der Kontext war.… Es könnte… Also ich sag nichts weiter darüber. Aber es stellt sich aus, wenn sie es völlig beschreiben wollten, dann würde es den Rest ihres Lebens dauern. Sie können es nicht. Sie wissen, aber sie können es nicht sagen.

Da ist die Geschichte von Picasso. Da steht ein Mann im Museum. Es sieht sich an Guernica. Picasso läuft vorbei. Der Mann, „ach, Meister, wie ich das Bildnis liebe!“ Und schwärmt und schwärmt. Und sagt, „aber sagen sie mir, was bedeutet es?“ Und Picasso antwortet, „wenn ich ihnen das sagen könne, würde ich ein Schriftsteller sein. Aber ich bin ein Maler.

Joseph Weizenbaum, Klangenfurt 2007

WYSIWYG 1970

WYSIWYG stands for What-You-See-Is-What-You-Get. It is a concept developed at Xerox PARC; it means that the display on screen corresponds to the printed sheet of paper – a quite radical idea in the early days of desktop computing.  According to Wikipedia the expression was “coined by John Seybold and popularized at Xerox PARC during the late 1970s.”

Therefore it is quite stunning to hear the words in a totally different context. Tim Rice used the very same words for a chorus in Jesus Christ Superstar (music Andrew Lloyd Webber, 1970) in the piece The Temple.

what you see is what you get

Score of Jesus Christ Superstar, The Temple

Quite possible that John Seybold knew the song.

[Update 26-Apr-2017] I do not what to push this over the edge, but the following lines are kind of intriguing as well if you switch the context back to computing:

No-one’s been disappointed yet – success rate, ease of use
Don’t be scared give me a try –  familiarity, robustness, undo, user experience
There is no-thing you can’t buy – Business goals; revenue comes from happy customers

Richtplatz auf dem Grasbrook 1590

Das Chronoscope ist eine Zeitmaschine für Hamburg, die im Rahmen des Kultur-Hackathon Coding Da Vinci Nord entstanden ist. Justiert man die Coordinaten auf den Grasbrook um 1590, so findet man die Richtstätte, auf der bis 1624 über 400 Seeräuber enthauptet wurden. [cf. Wikipedia].

Der Ort würde heute in etwa zwischen der Elbphilharmonie und dem City-Sportboothafen vor dem Sandtorhöft liegen.

Übrigens suche ich nach Bugs. Hakt es irgendwo bei den Zeitreisen? Irgendein Browser oder Device bei dem etwas falsch dargestellt wird? Oder gibt es eine Coordinate, bei der die Karte besser ausgerichtet werden sollte? Dann könnt Ihr das gerne hier oder in farcebook mit Screenshot oder Chrono-Link berichten.

protonet design hacks

If your only tool is a CSS hammer, the entire world wide web looks like a nail.

This time I’ve implemented a couple of CSS design improvements for protonet’s user interface. The average user experience of the sample user group went up from sort-of-ok to relieved and delighted.

The motivation of all the changes is pure usability design: better layout, contrast, color scheme, legibility, control element recognition, focus on notifications, less noise, less scrolling, semantic colours for the calendar, and much more. The page protonet design hacks summarises and explains the changes. I’ve also played a bit with JuxtaposeJS to provide before&after comparison.

before and after comparison at protonet design hacks

There is more in the pipeline regarding protonet – other enhancements of my design lab apply to the twitter stream and google’s search experience. Let me know if you are interested in the comments below.