painting objects with mondrian
DESCRIPTION
Painting objects with Mondrian. Michael Meyer and Tudor Gîrba. ESUG 2006, PragueTRANSCRIPT
![Page 1: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/1.jpg)
Painting objects with Mondrian
Michael Meyer and Tudor Gîrba
Software Composition GroupUniversity of BerneSwitzerland
September 6, 2006
![Page 2: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/2.jpg)
Mondrian is about visualization
![Page 3: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/3.jpg)
Mondrian is also about interaction
![Page 4: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/4.jpg)
please ask questions
![Page 5: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/5.jpg)
Why visualization?
![Page 6: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/6.jpg)
“One picture is worth a thousand words”
![Page 7: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/7.jpg)
![Page 8: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/8.jpg)
some took it literally :)
![Page 9: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/9.jpg)
70% of our sensors are dedicated to vision
Do you see?
Picture it!
Let’s see
I see
![Page 10: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/10.jpg)
How many groups do you see?
![Page 11: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/11.jpg)
How many groups do you see?
![Page 12: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/12.jpg)
How many groups do you see?
![Page 13: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/13.jpg)
How many groups do you see?
![Page 14: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/14.jpg)
70% of our sensors are dedicated to vision
Do you see?
Picture it!
Let’s see
I see
![Page 15: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/15.jpg)
“One picture is worth a thousand words”
![Page 16: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/16.jpg)
Example: What is ?
![Page 17: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/17.jpg)
![Page 18: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/18.jpg)
![Page 19: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/19.jpg)
![Page 20: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/20.jpg)
![Page 21: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/21.jpg)
![Page 22: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/22.jpg)
What we have: Graphviz is a visualization engine
digraph classGraph {A [ shape=polygon, width = 6 ... ]B [ shape=polygon, width = 5 ... ]...A -> BC -> D...
}
![Page 23: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/23.jpg)
What we would like
Scripting
Instance based
Any data model
Close to data
Interaction
![Page 24: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/24.jpg)
What we would like
Scripting
Instance based
Any data model
Close to data
Interaction
![Page 25: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/25.jpg)
Mondrian
![Page 26: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/26.jpg)
Mondrian metaphor: painting a view
![Page 27: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/27.jpg)
Mondrian metaphor: painting a view
![Page 28: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/28.jpg)
Mondrian metaphor: painting a view
Composition with Red, Yellow and Blue Piet Mondrian (1921)
![Page 29: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/29.jpg)
The simplest Mondrian script is an empty view
view := ViewRenderer new.view open.
![Page 30: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/30.jpg)
The view consists of nodes and edges arranged according to a layout
view := ViewRenderer new.view nodes: classes.view edges: classes from: [:each | each superclass] to: [:each | each].view treeLayout.view open.
![Page 31: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/31.jpg)
Visual representation is given by the shape
view := ViewRenderer new.view borderedRectangleShape height: [:each | each numberOfMethods].view nodes: classes.view edges: classes from: [:each | each superclass] to: [:each | each].view treeLayout.view open.
![Page 32: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/32.jpg)
Blocks can be replaced by symbols
view := ViewRenderer new.view borderedRectangleShape height: #numberOfMethods.view nodes: classes.view edgesFrom: #superclass.view treeLayout.view open.
![Page 33: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/33.jpg)
Nesting is done through blocks
view := ViewRenderer new.view borderedRectangleShape.view nodes: classes forEach: [:each |
view nodes: each methods.view gridLayout].
view edgesFrom: #superclass.view treeLayout.view open.
![Page 34: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/34.jpg)
What about interaction?
![Page 35: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/35.jpg)
Interaction is scriptable, too
view := ViewRenderer new.view2 := ViewRenderer new.
view interaction onSelect: [:each | each viewOn: view2].view interaction popupView: [:each :aView | each viewOn: aView].
view nodes: ......
view open.view2 open.
![Page 36: Painting objects with Mondrian](https://reader035.vdocuments.mx/reader035/viewer/2022081401/55655c56d8b42a9a3a8b4da2/html5/thumbnails/36.jpg)
Mondrian
Close to data
Any data model
Scripting
Interaction
Least object creation
Instance based
Soon in the Cincom Store ...
September 6, 2006