les 9 - informatie visualisatie

Informatie visualisatie: Les 9

Joris Klerkx - Erik Duval http://hci.cs.kuleuven.be joris.klerkx@cs.kuleuven.be

Human-Computer InteractionDept. ComputerwetenschappenKU Leuven

1

Sessies - praktisch • Week 16 - maandag 18 april 2016 - 16u-19u

• Week 17 - maandag 25 april 2016 - 16u-19u

• Week 18 • maandag 02 mei 2016 - 16u-19u • Woensdag 04 mei 2016 - 10:30 - 12:30 in 200C-01.09 (01J)

• Sessie samen met studenten data visualisatie - Dig. Humanities - prof. Verbert & prof. Vande Moere - topic: Data-driven storytelling

• Week 19 • Maandag 09 mei 2016 - 16u-19u - Finale demo (met jury)

STAAT NIET IN HET UURROOSTER!

Tegen deze les • Individueel: - Spreadsheet

• Team:

• Vervolg implementatie

• Draft Paper!

• Blog post

• Vooruitgang - wat geleerd vandaag

• Wat vond je van feedback sessie?

• Show-and-Tell - design critique (eventueel weerleggen wat je gehoord hebt vandaag)

3

Vandaag• Evaluatie

• Meer info over paper

• Meer info over finale demo

• Show-and-Tell (jullie)

• 5 mins + 5 mins ‘design-critique’

• Quick feedback per groep

4

Evaluatie

State-of-the-art

6

• controlled experiment comparing design elements • widgets, mapping to graphic

• usability evaluation • controlled experiments comparing several tools • case studies • least common • natural environment • real tasks • time consuming • difficult to replicate and generalize

• also: re-design C. Plaisant. The challenge of information visualization evaluation. In Proceedings of AVI04: working conference on Advanced visual interfaces, pages 109–116. ACM, 2004.

Comparing visualisations

7

https://infovislvm.wordpress.com

https://visualeyesgroup.wordpress.com

Case Study

8

T. Nagel, M. Maitan, E. Duval, A. Vande Moere, J. Klerkx, K. Kloeckl, and C. Ratti. Touching transport - a case study on visualizing metropolitan public transit on interactive tabletops. In AVI2014: 12th ACM International Working Conference on Advanced Visual Interfaces, pages 281–288, 2014.

slide 27…

http://www.slideshare.net/tillnagel/touching-transport-a-case-study-on-visualizing-metropolitan-public-transit-on-interactive-tabletops

http

s://m

ediu

m.c

om/@

hint

_fm

/des

ign-

and-

rede

sign

-4ab

7720

6cf9

Redesign as evaluation

Beware: perfect hindsight!

http

s://m

ediu

m.c

om/@

hint

_fm

/des

ign-

and-

rede

sign

-4ab

7720

6cf9

Redesign as evaluation

Re-design as evaluation

12

http://en.wikipedia.org/wiki/File:2004_US_elections_map_electoral_votes.png

Re-design as evaluation

13

https://medium.com/@hint_fm/design-and-redesign-4ab77206cf9

Re-design as evaluation

14

https://medium.com/@hint_fm/design-and-redesign-4ab77206cf9

• F.ViégasandM.Wa/enberg,DesignandRedesigninDataVisualiza0on,h/ps://medium.com/@hint_fm/design-and-redesign-4ab77206cf9

• C.Plaisant.Thechallengeofinforma0onvisualiza0onevalua0on.InProceedingsofAVI04:workingconferenceonAdvancedvisualinterfaces,pages109–116.ACM,2004.

• T.Nagel,M.Maitan,E.Duval,A.VandeMoere,J.Klerkx,K.Kloeckl,andC.RaY.Touchingtransport-acasestudyonvisualizingmetropolitanpublictransitoninterac0vetabletops.InAVI2014:12thACMInternaZonalWorkingConferenceonAdvancedVisualInterfaces,pages281–288,2014.

15

?16

Paper

• aim + target audience

• related work

• data set: origin, characteristics

• visualisatie & interaction + rationale

• technology & code reuse

• lessons learned & conclusion

Structuur

Beschrijf niet enkel de visualisatie, maar leg vooral uit waarom je die visualisatie zo gemaakt hebt:

• welke alternatieven heb je overwogen?

• waarom heb je die eventueel niet weerhouden?

• Hoe is het ontwerp geëvolueerd? Waarom?

• Enz.

dataset- origin - distribution of values - missing or erroneous values - size - API - …

code you’ve re-used:

mention in acknowledgements

or explain in technology section

Technology section

- data collection

- data processing

- d3 experiences

- code from elsewhere

Related work

- not just same data

- not just web pages

- scientific papers do exist!

- how is your work similar and different? why?

- Max 1 page (screenshots included) !

Suggested Exercise-per-team;

Scholar session: find 5-15 relevant papers…

- what did you search on?

- what did you find?

- why or how is this relevant?

See what you can find in 15 to 30 minutes ;)

Ook nog…

• geen chronologisch verhaal!

• als je problemen hebt opgelost, geef dan concrete voorbeelden!

• niet: ‘to prevent giving a false impression to the user’

• […]: kan je niet zo maar beweren

• page limit: 8 pages, including everything!

• Onderbouw nodig!

• “However while most people know the two World Wars that happened, they don’t know a lot about conflicts that happened later or those that were shorter in time”

is dat wel zo…

• Geen vage statements

• “The data speaks for itself and redundant non-data-ink was removed to keep the visualization clean and simple”

https://gameofsimplicity.wordpress.com

https://gameofsimplicity.wordpress.com/2016/04/17/data-ink-design-principles/

• Deadline: Zondag 5 juni 0u00! (insturen via email naar joris.klerkx@cs.kuleuven.be)

• Misschien later indienen bij workshop of conferentie…

• Afsluitend gesprek nodig tijdens examenperiode?

Finale demo

9 mei stipt om 16u

- 10+7 min/group

- tonen ipv vertellen

- rationale! (alternatieven…)

- demo

- lessons learned

Show & tell sessie

Positief?

https://visualeyesgroup.wordpress.com/2016/04/17/show-and-tell-feedback/

https://thetuftersblog.wordpress.com/2016/04/13/sessie-8-show-and-tell-en-design-critique/

https://infofishblog.wordpress.com/2016/04/16/show-tell-week-7/

https://exmachina2016.wordpress.com/2016/04/15/feedback-week-8/

https://theinfomob.wordpress.com/2016/04/14/fourth-presentation-progress-update/

https://gameofsimplicity.wordpress.com/2016/04/17/sessie-8-showtell/

Show & tell sessie

Negatief?

https://visualeyesgroup.wordpress.com/2016/04/17/show-and-tell-feedback/

https://thetuftersblog.wordpress.com/2016/04/13/sessie-8-show-and-tell-en-design-critique/

https://infofishblog.wordpress.com/2016/04/16/show-tell-week-7/

https://exmachina2016.wordpress.com/2016/04/15/feedback-week-8/

https://theinfomob.wordpress.com/2016/04/14/fourth-presentation-progress-update/

https://gameofsimplicity.wordpress.com/2016/04/17/sessie-8-showtell/

Show & tell sessieOpnieuw op deze manier?

Finale demo

9 mei stipt om 16u

- 10+7 min/group

- tonen ipv vertellen

- rationale! (alternatieven…)

- demo

- lessons learned:

- inzichten tonen in dataset

- doel bereikt?

Hulp!

Evaluatie - cursus

51

positivewhole

could be better

Definitely change

Tegen volgende les • Individueel: - Spreadsheet

• Team:

• Vervolg implementatie

• !! Draft Paper !!

• Blog post

• Vooruitgang - wat geleerd vandaag

• Show-and-Tell - design critique (eventueel weerleggen wat je gehoord hebt vandaag)

52