Transcript
Page 1: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Nur der Nutzer weiß, was der Nutzer noch nicht weiß

Jang F.M. Graat

KT1

!1

Page 2: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Wer Spricht ?• Jang F.M. Graat

• Technische Redaktion

• FM, RH, MadCap

• DITA, XSLT, JS, CSS

• Minimalist

• Psychologe, Philosoph

• Weltbürger in Amsterdam

!2

Page 3: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

MinimalismusHauptprinzipien

!3

Page 4: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Lesen ist nie das Ziel

!4

Page 5: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Aktionsorientiert

!5

Page 6: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Biete dem Nutzer nur die Infos an,

die er/sie braucht

!6

Page 7: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Das Problem

!7

Was weiß der Nutzer schon?

Page 8: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Unterschiedliche Nutzer

!8

Page 9: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Welche Personas ?

!9

Page 10: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Ausbildung, Erfahrung...

!10

Page 11: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Nur der Nutzer weiß, was der Nutzer noch nicht weiß

!11

Page 12: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Die LösungÜberlassen Sie dem Nutzer die Kontrolle

!12

Page 13: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Fragen um Erläuterung

!13

Page 14: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Interaktive Medien

!14

Page 15: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Nachteil: Kontextänderung

!15

Page 16: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Wo bin ich gelandet ?

!16

Page 17: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Besser: Verborgene Infos

!17

Page 18: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Schrittweise Enthüllung

!18

Page 19: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Progressive DisclosureWie machen Sie es ?

!19

Page 20: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!20

Minimale Information wird immer angezeigt

Page 21: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!21

RoboHelp ermöglicht Drop-down Texte

Page 22: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!22

Verborgene Information wird so eingefügt/editiert

Page 23: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!23

Text wird als Hotspot markiert

Page 24: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!24

Der Prozeß kann in eine Drop-down Text

wiederholt werden.

Page 25: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!25

Drop-down Text kann auch Bilder usw. enthalten

Page 26: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!26

So sieht das Ergebnis aus: nur die minimale Infos sichtbar

Page 27: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!27

Der Nutzer klickt einen Hotspot an, um verborgene Infos zu zeigen

Page 28: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!28

Schrittweise Enthüllung

Page 29: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!29

Nachteil: Arbeitsintensiv

Page 30: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Progressive DisclosureAber bitte mit Sahne !

!30

Page 31: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Struktur + XSLT = Magie

!31

Page 32: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

XPath : Semantisch suchen

!32

Page 33: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

XSLT : Xtreme Makeover

!33

Page 34: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!34

task

title

shortdesc

prolog

taskbody

context

steps

step

cmd

info

substeps

stepresult

step

cmd

substeps

step

cmd

info

substeps

Eine DITA Task Rot: erforderlich

Grün: optional

Page 35: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!35

DITA Task im Editor

Page 36: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!36

Standard Ausgabe

Page 37: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!37

XSL erlaubt automatische

Transformation

Page 38: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!38

<shortdesc> wird in einem Tooltip

umgewandelt

Page 39: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!39

CSS sorgt für die Unsichtbarkeit der verborgene Informationen

Page 40: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!40

JavaScript verbindet einen Trigger mit dem Target, was angezeigt oder verborgen wird

Page 41: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!41

Resultat der XSLT

Page 42: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!42

So sieht das Ergebnis aus

Page 43: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!43

Anklicken eines + Symbols öffnet die <substeps>

Page 44: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!44

Andere Symbole öffnen <info> und <result>

Page 45: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!45

Maus über Titel bewegen macht <shortdesc> sichtbar

Page 46: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

!46

Plus Symbol rechts oben öffnet <context> Inhalte

Page 47: Nur der Nutzer weiss, was der Nutzer noch nicht weiss - Progressive Disclosure

Fragen ?www.jang.nl

[email protected]

4everJang

blogs.jang.nl

!47


Top Related