$30 off During Our Annual Pro Sale. View Details »

Mapping Modernism: The tangible museum

Mapping Modernism: The tangible museum

This presents the interactive tangible interface device we built for the Helsinki Museum of Design. It would be better in video, as it was heavily animated.
You can see some footage of the device at http://vimeo.com/11616697

Matti Schneider

April 27, 2010
Tweet

More Decks by Matti Schneider

Other Decks in Technology

Transcript

  1. Mapping Modernism
    Information visualization and presentation tool

    View Slide

  2. Mapping Modernism

    View Slide

  3. Mapping Modernism
    I. Concept

    View Slide

  4. Mapping Modernism
    I. Concept
    II. Implementation

    View Slide

  5. Mapping Modernism
    I. Concept
    II. Implementation
    III. Future

    View Slide

  6. I - Concept

    View Slide

  7. Modernism

    View Slide

  8. Who?
    Modernism

    View Slide

  9. Starting point: picture
    copyright Bauhaus-Archiv Berlin/ Musée National d'Art Moderne/Centre Pompidou

    View Slide

  10. Starting point: picture
    copyright Bauhaus-Archiv Berlin/ Musée National d'Art Moderne/Centre Pompidou

    View Slide

  11. View Slide

  12. Lázslò Moholy-Nagy
    Master 1923
    United States
    England
    World War 1
    De Stijl
    Dada
    Constructivism
    CIAM
    Typography
    photography
    Hungarian
    Walter Gropious
    Alvar Aalto Marianne Brandt
    Theo Van Doesburg
    Soldier
    wounded
    Weimar
    Dessau
    1923
    1928
    1937
    1946
    Jewish
    Chicago
    Director
    London
    Isokon Project

    View Slide

  13. De Stijl
    Dada
    Constructivism
    Alvar Aalto
    Marianne Brandt
    Theo Van Doesburg
    Weimar
    Dessau 1923
    1928
    1937
    Chicago
    Director London
    Isokon Project
    Avant-Garde
    Art Movements
    Emigration
    The Bauhaus School
    Walter
    Gropious
    New Bauhaus
    Lázslò Moholy-Nagy

    View Slide

  14. Avant-Garde Art Movements
    Metal Workshop at the Bauhaus
    The Bauhaus School
    Emigration
    World War I
    Innovation in Furniture Design
    Initiatives in Architecture
    Seven categories

    View Slide

  15. Avant-Garde Art Movements
    Metal Workshop at the Bauhaus
    The Bauhaus School
    Emigration
    World War I
    Innovation in Furniture Design
    Initiatives in Architecture
    • determined by finding most common
    types of information
    Seven categories

    View Slide

  16. Avant-Garde Art Movements
    Metal Workshop at the Bauhaus
    The Bauhaus School
    Emigration
    World War I
    Innovation in Furniture Design
    Initiatives in Architecture
    • determined by finding most common
    types of information
    • used to discriminate pieces of
    information
    Seven categories

    View Slide

  17. Avant-Garde Art Movements
    Metal Workshop at the Bauhaus
    The Bauhaus School
    Emigration
    World War I
    Innovation in Furniture Design
    Initiatives in Architecture
    • determined by finding most common
    types of information
    • used to discriminate pieces of
    information
    • groups data
    Seven categories

    View Slide

  18. Avant-Garde Art Movements
    Metal Workshop at the Bauhaus
    The Bauhaus School
    Emigration
    World War I
    Innovation in Furniture Design
    Initiatives in Architecture
    • determined by finding most common
    types of information
    • used to discriminate pieces of
    information
    • groups data
    • connects artists
    Seven categories

    View Slide

  19. Starting point: picture
    copyright Bauhaus-Archiv Berlin/ Musée National d'Art Moderne/Centre Pompidou

    View Slide

  20. Starting point: picture
    copyright Bauhaus-Archiv Berlin/ Musée National d'Art Moderne/Centre Pompidou

    View Slide

  21. View Slide

  22. Lázslò Moholy-Nagy Gunta Stölzl
    The Bauhaus School
    László Moholy-Nagy was appointed a master of
    the metal workshop at the Bauhaus by its first
    director Walter Gropius, who shared with
    Moholy-Nagy an enthusiasm for experimental
    designs aimed for industry.
    The Bauhaus School
    Gunta Stölzl joined the Bauhaus as early as 1919
    and was studying in the weaving workshop. After
    she graduated, Stölzl was responsible for the
    technical direction of the workshop and then
    became its master. She was a very original
    weaver, but at the same time she was actively
    working on the development of industrial
    fabrics.

    View Slide

  23. Lázslò Moholy-Nagy Gunta Stölzl
    The Bauhaus School
    The Bauhaus School

    View Slide

  24. Goals

    View Slide

  25. Goals
    • use artists as starting points

    View Slide

  26. Goals
    • use artists as starting points
    • show complex data in a simple, visual way

    View Slide

  27. Goals
    • use artists as starting points
    • show complex data in a simple, visual way
    • still give access to more complete data on demand

    View Slide

  28. Three questions
    Who were the
    artists?
    How were they
    related?
    What were their
    experiences?
    The Bauhaus School
    László Moholy-Nagy was appointed a master of
    the metal workshop at the Bauhaus by its first
    director Walter Gropius, who shared with
    Moholy-Nagy an enthusiasm for experimental
    designs aimed for industry.
    The Bauhaus School

    View Slide

  29. II - Implementation

    View Slide

  30. Three physical elements
    Markers Table Screen

    View Slide

  31. Three key actions
    Accessing Exploring Deepening

    View Slide

  32. Markers

    View Slide

  33. • represent artists
    Markers

    View Slide

  34. • represent artists
    • user’s entry points to the information
    Markers

    View Slide

  35. • represent artists
    • user’s entry points to the information
    • allow for an always-custom experience
    Markers

    View Slide

  36. • represent artists
    • user’s entry points to the information
    • allow for an always-custom experience
    Markers

    View Slide

  37. Table

    View Slide

  38. Table

    View Slide

  39. • presents the legend
    Table

    View Slide

  40. • presents the legend
    Table

    View Slide

  41. • presents the legend
    Table

    View Slide

  42. • presents the legend
    • interactive element
    Table

    View Slide

  43. • presents the legend
    • interactive element
    • portal between the physical and the virtual
    Table

    View Slide

  44. • presents the legend
    • interactive element
    • portal between the physical and the virtual
    Table

    View Slide

  45. • presents the legend
    • interactive element
    • portal between the physical and the virtual
    Table

    View Slide

  46. • presents the legend
    • interactive element
    • portal between the physical and the virtual
    • shows connections between artists
    Table

    View Slide

  47. • presents the legend
    • interactive element
    • portal between the physical and the virtual
    • shows connections between artists
    Table

    View Slide

  48. • presents the legend
    • interactive element
    • portal between the physical and the virtual
    • shows connections between artists
    Table

    View Slide

  49. • presents the legend
    • interactive element
    • portal between the physical and the virtual
    • shows connections between artists
    • allows for custom visualizations
    Table

    View Slide

  50. Screen

    View Slide

  51. Screen

    View Slide

  52. • presents expanded data
    Screen

    View Slide

  53. • presents expanded data
    • reacts to input on the table
    Screen

    View Slide

  54. • presents expanded data
    • reacts to input on the table
    Screen

    View Slide

  55. • presents expanded data
    • reacts to input on the table
    Screen

    View Slide

  56. • presents expanded data
    • reacts to input on the table
    Screen

    View Slide

  57. • presents expanded data
    • reacts to input on the table
    Screen

    View Slide

  58. • presents expanded data
    • reacts to input on the table
    • textual information
    Screen

    View Slide

  59. • presents expanded data
    • reacts to input on the table
    • textual information
    • presentation of the category
    Screen

    View Slide

  60. • presents expanded data
    • reacts to input on the table
    • textual information
    • presentation of the category
    • relation from the artist to the category
    Screen

    View Slide

  61. • presents expanded data
    • reacts to input on the table
    • textual information
    • presentation of the category
    • relation from the artist to the category
    • illustration by an artifact
    Screen

    View Slide

  62. Three main elements
    Markers Table Screen

    View Slide

  63. Three concepts
    Information Visualization Presentation

    View Slide

  64. III - Future

    View Slide

  65. Mapping Modernism
    • offers a new information representation
    system
    • easily adaptable to different
    • content
    • environment
    • audience

    View Slide

  66. Mapping Modernism
    Akira Sano
    Agnieszka Paszkowska
    Matti Schneider-Ghibaudo
    Laura Sebastián Magaña
    Reha Discioglu
    Sampo Jalasto
    Lily Dìaz

    View Slide

  67. Technologies diagram
    Data:
    XML (+ images)
    Business:
    JavaScript
    Presentation:
    Quartz Composer
    Optical recognition:
    reacTIVision
    Reads Updates
    (TUIO)
    Embeds Updates
    Open-Source
    Base of most MT
    technologies
    “Super-standard”
    Doctyped
    Freeware
    By Apple
    Specific code
    Fully tested (UFP)

    View Slide

  68. Functional diagram

    View Slide