Design Designen – Digital Craft

1,562 views

Published on

The love of making things need not be confined to the physical world - electronic form giving is an equal hands-on experience. My talk is investigation of the possibility of craft in the digital realm. There is a growing correspondence between digital work and traditional craft. Anyone who gives form with software, whether in web design, architecture, motion graphics or modeling, is practicing personal knowledge and producing visual artifacts that, although not material, are nevertheless products of the hands, eyes and mind.

The talk stars with an introduction to my current role at The Group, thoughts on the Bauhaus movement (and their understanding of craft & technology) and concludes with interviews by various digital crafts people.

Design Designen was created for the 6. Typotage in Munich which took place on 21. July 2009.

Note that the talk contains slides in German and English.

Published in: Design, Business
0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,562
On SlideShare
0
From Embeds
0
Number of Embeds
13
Actions
Shares
0
Downloads
0
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005 1989-91 Ludwig Max Uni M 殤 c hen Humanistics, Theologie1997 HDK Bremen, Grafik Design (Eckhard Jung, Peter Rea)1996 Ravensbourne College of Design, Interaction Design (Rodney Edwards)1998 Artificial Environments2004 The Group, Design Director2009 MCs Informatics (City University London)?
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005 Small number of big brands – in a deep and wide way – long term relationships 1994 = 1st site for KGF Average length of relationship = 7 years
  • © The Group 2005 © The Group 2005
  • © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005
  • © The Group 2005 © The Group 2005 We have grown and evolved as the internet has grown and as companies have developed ideas and answers bout how to use the internet. IR – CSR – Careers - Commercial
  • © The Group 2005 © The Group 2005 Thuis slide cn go We have grown and evolved as the internet has grown and as companies have developed ideas and answers bout how to use the internet. IR – CSR – Careers - Commercial
  • © The Group 2005 © The Group 2005 We have grown and evolved as the internet has grown and as companies have developed ideas and answers bout how to use the internet. IR – CSR – Careers - Commercial
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005 © The Group 2005 Massen Konsum – mass use and constant evolution; users reproducing and reconfiguring;
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005 © The Group 2005 Massen Konsum – mass use and constant evolution; users reproducing and reconfiguring;
  • © The Group 2005 © The Group 2005 Massen Konsum – mass use and constant evolution; users reproducing and reconfiguring;
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005 Nach 10 Jahren visuellen Design Studie um merh über die Benutzer meiner Arbeit zu verstehen. Back to College.
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005 © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • © The Group 2005
  • Design Designen – Digital Craft

    1. 1. <ul><li>Design designen </li></ul>
    2. 2. <ul><li>About me </li></ul>
    3. 3. 1997 HFK Bremen, Grafik Design 1996 Ravensbourne College of Design, UK Interaction Design 1998 Artificial Environments 2004 The Group, Design Director 2009 MSc Human Centred Systems
    4. 4. <ul><li>The Group </li></ul>
    5. 5. The Group is an interactive communication agency We design, build, host and manage corporate and marketing web sites, extranets and online reports, and advise on all aspects of online communication
    6. 6. By creating authentic, compelling and useful brand experiences online – we connect organisations with people who matter to them Everyone from investors and journalists to employees, job-seekers, customers and local communities
    7. 7. Clients Beratung Full service – Design, Entwicklung, Hosting und Datenpflege Corporate Webseite | Geschäftsberichte | Web analyse & Beratung
    8. 8. Our services Day-to-day client contact, manages annual strategic programme Site concepts, design & identity, content and strategy Measurement, review and ongoing development Hosting, programming & technical services
    9. 9. Us
    10. 10. The Group Organisches Wachstum Keine Agentur nach Bauplan Jobs und Rollen sind veränderbar und flexibel
    11. 11. Growing – % change
    12. 12. Interdisziplin ‘ The school will gradually turn into a workshop’ Walter Gropius
    13. 13. The building of the future (Gropius) Combine all the arts in ideal unity + Strategy + Information Architecture + Visual Design + Development + Web metrics + Online Consulting
    14. 14. Creativity is just connecting things When you ask a creative person how they did something, they may feel a little guilty because they didn’t really do it, they just saw something.” Steve Jobs
    15. 15. Cross-functional teams Strategy + animation + databases + copy + architecture + video + colours + coding Cross-functional teams where experience and inquisitiveness and trust lead to new connections
    16. 16. By our hands we live The Group, East End, London
    17. 17. Walter Gropius – The base for any art is found in handcraft ‘the school will gradually turn into a workshop’ Artists and craftsmen directed classes and production together at the Bauhaus in Weimar Remove any distinction between fine arts and applied arts
    18. 18. <ul><li>Digital craft </li></ul>
    19. 19. <ul><li>Digitales Handwerk </li></ul><ul><li>Was ist das? </li></ul><ul><li>Wie ensteht Qualität? </li></ul>
    20. 20. Digital craft Damals: Prototyp – Massenproduktion Heute: Prototyp – Massenproduktion Prototyp ist nicht mehr absolut, sondern ver änderbar Benutzer reproduzieren und rekonfigurieren unsere Arbeit
    21. 21. SABMiller.com – Your page
    22. 22. SABMiller.com – Your page
    23. 23. SABMiller.com – Your page
    24. 24. Provident Financial – Financial table
    25. 25. Provident Financial – Financial table
    26. 26. Provident Financial – Financial table
    27. 27. Digital craft Veränderbarkeit muss miteingebunden sein in unser Design Designer gestalten einen Prozess, das Design des Designens Wir designen Design!
    28. 28. Digital craft Interviews, Testing und Web metrics geben Aufschluss über Benutzer Wir designen Systeme, die robust und erweiterbar sein m üssen Ständige Evolution von Design Designprozess ist iterativ
    29. 29. Digital craft Wir liefern Daten. Die Produktion, das ‘Material’, werden nach wie vor delegiert Technologie ist ein Designmaterial
    30. 30. Digital craft Technologie ist zug änglicher, leichter lernbar und verwendbar geworden Seagram Building, Ludwig Mies van der Rohe , 1954-58
    31. 31. <ul><li>The medium is the message </li></ul><ul><li>Marshall Mcluhan </li></ul>
    32. 32. Die Kenntnis der Zeit, ihrer Aufgaben und Mittel, sind notwendige Vorraussetzungen bauk ün s tlerischen Schaffens. Mies van der Rohe Die Kenntnis von Umwelt, Benutzern und Technologien , sind notwendige Vorraussetzungen guten Designs.
    33. 33. Centrica Gesch äftsbericht 08 – PDF
    34. 34. Centrica Gesch äftsbericht 08 – web
    35. 35. Centrica Gesch äftsbericht 08 – web
    36. 36. Centrica Gesch äftsbericht 08 – web
    37. 37. Centrica Gesch äftsbericht 08 – web
    38. 38. Centrica Gesch äftsbericht 08 – PDF
    39. 39. Centrica Geschäftsbericht 2008 – PDF
    40. 40. Centrica Geschäftsbericht – online
    41. 41. Centrica Geschäftsbericht – online
    42. 42. Digital craft Qualität • objektiv / strukturell • visuell • technisch • emotional • Benutzbarkeit ‘quality-in-use’ My job
    43. 43. Digital craft Schlecht: unbenutzbar, unverständlich Gut: schnell lernbar, aesthetisch, flow, standards
    44. 44. Quality-in-use Verständnis und Benutzbarkeit Studie: An investigation of viewing patterns on the web Sehmuster im Internet
    45. 45. Quality-in-use – Nielsen / F-Muster (2006) Drei ‘heatmaps’ aus Nielsens Studie (2006): (1) ‘About us’ seite, (2) Produktseite (e-commerce site), und (3) Liste von Sucherergebissen (Google) ‘ Users read web pages in an F-shape pattern ’ Nielsen, 2006
    46. 46. Quality-in-use – Sehmuster: Verständnis
    47. 47. Quality-in-use – Sehmuster: Suche
    48. 48. Quality-in-use – Kollektive Suchpfade
    49. 49. Conclusions 1 Viewing behaviour is affected by: - the visual layout of a site (Layout) - a user ’s task (Aufgabe) Common viewing patterns on the web are rather unlikely
    50. 50. Conclusions 2 Sensemaking clue: body of text Seen early: menu, the description and the page title (both layouts) Sensemaking is a relatively individual activity, exploratory in nature and easily affected by a disorganised layout
    51. 51. Conclusions 3 Page fold is no longer an obstacle in viewing a website if users are looking for useful clues Sensemaking behaviour does not result in an F-shape viewing pattern, but is influenced by the structure of the visual layout
    52. 52. Die Kenntnis der Zeit, ihrer Aufgaben und Mittel, sind notwendige Vorraussetzungen bauk ün s tlerischen Schaffens. Mies van der Rohe Die Kenntnis von Umwelt, Benutzern und Technologien, sind notwendige Vorraussetzungen guten Designs.
    53. 53. <ul><li>CATS </li></ul><ul><li>C hildrens’ A cute T ransport S ervice </li></ul><ul><li>Feldstudie für Great Ormond </li></ul><ul><li>Street Krankenhaus (2 Jahre) </li></ul>
    54. 54. Touch screen Aktuelle Krankentransporte Patienteninformation Daten übertragung in Echtzeit CATS
    55. 55. CATS
    56. 56. CATS
    57. 57. CATS
    58. 58. CATS
    59. 59. CATS
    60. 60. CATS
    61. 61. CATS
    62. 62. CATS
    63. 63. Gestaltet die Form aus dem Wesen der Aufgabe mit den Mitteln unserer Zeit. Das ist unsere Arbeit. Mies van der Rohe, Manifesto
    64. 64. <ul><li>Digitales Handwerk </li></ul>Interviews
    65. 65. I consider myself a technician, not a writer Using different techniques online and offline I solve problems Rules – there are rules you need to follow Your copy needs to be understood quickly and effectively Frank, Content Strategist
    66. 66. Martina, Senior Content Strategist It’s got something to do with e mpathy a nd collaboration. It ’s not about the writer, it ’s about what works for the site and the people who use it. You have to be transparent. Y ou're looking to craft something that both communicates effectively in itself and that integrates seamlessly with design and IA to create a satisfying user experience.
    67. 67. Six Steps – Finanzplanung für alle
    68. 68. Six Steps – Schreibstil Richtlinien für Schreibstil: • direkt • informativ, informell • glaubwürdig • auf Augenhöhe • ohne Bevormundung
    69. 69. Trevor, Senior Information Architect Craft = Hidden Timing = Craft On the surface there is no craft. We’re looking for an easy solution on the outside even if the thought process is complex. Everything has to happen quickly and simply for a user. Users need to go the simplest way to get a task done.
    70. 70. Jenelle, Information Architect Craft = Elegance Big picture + Detail Working within constraints of existing technologies, time and budget The ultimate goal is to unite the visual and the functional – they have to gel. Then you arrive at an elegant solution. Good craft is about completeness, the bigger picture view and the level of detail.
    71. 71. J Sainsbury CR Report 09
    72. 72. <ul><li>Design is like a good host looking after </li></ul><ul><li>the needs of a guest </li></ul><ul><li>Charles Eames </li></ul>
    73. 73. Design needs to work subconsciously, almost invisibly. You don't want users to think about it too much, but let them experience the brand. Good craft is a well structured and easy to use visual design. Ewa, Interaction Designer It's like the Theatre, you don't notice the stuff that goes on behind the scenes.
    74. 74. Provident Financial
    75. 75. Provident Financial
    76. 76. Provident Financial
    77. 77. Provident Financial
    78. 78. Provident Financial
    79. 79. Provident Financial
    80. 80. Good craft takes time. We don’t have time. An early prototype often needs refining over and over again. It's very tedious. In print you can tinker more. Good craft can get lost in the process – budgets are tight and we have to work faster than ever. John, Art Director
    81. 81. Also there are limitations in our craft – available fonts for example, or accurate character spacing in CSS John, Art Director
    82. 82. John, Art Director
    83. 83. John, Art Director
    84. 84. SABMiller.com – Studien/Illustration
    85. 85. SABMiller.com – Animation
    86. 86. SABMiller.com – Farben
    87. 87. SABMiller.com – Farben
    88. 88. Farina, Design Production Manager Good craft: fitting lots of text into a small space Fiddling around with kerning, leading, widows and orphans Its about the finishing touches
    89. 89. Accuracy, accuracy, accuracy
    90. 90. J Sainsbury – Responsibility report 09
    91. 91. Craft = finding trends in the data, communicating that to a client clearly Making effective suggestions of what should be changed on their site Bad craft = inaccuracy, or lack of clarity and also taking data at face value, not digging deeper into data Stephen, Sarah Web Analysts
    92. 92. Our work is very complex – different specialism are needed, multiple crafts. Also people have different talents Programming craft is very specific: translating a 2D design into written language (code) which then translates into a dynamic and time-based interactive work on the web The tools of our craft are very different from the final outcome, unlike with traditional painting Tamas, Technical Director
    93. 93. Text editing in HTML feels craft like, rather than using a WYSYWG editor. I guess there are layers of craft. Phil, Developer, friend
    94. 94. The difference between making a chair and the front end of a web site – the chair lets you see the welding, on the web site you have to look at the source code to see if it was done nicely. Some code can be ropey, even though the site looks lovely. Phil, Developer, friend Quality code has a robustness to it.
    95. 95. Cathal Smyth Strategy Director Craft = searching for the truth of a brand We never find it but we get closer each time We then try to create an interactive experience that authentically conveys the nature of the brand through the connected layers of content, technology and design
    96. 96. <ul><li>Digital craft </li></ul>In short… Ganz normal Kopf, Hand und Herz Material + Technologie Qualität Prozess Teil vom Ganzen Leidenschaft Stolz
    97. 97. <ul><li>SABMiller </li></ul><ul><li>Lebt seine Werte </li></ul><ul><li>Gute Voraussetzungen f ür unsere Arbeit </li></ul><ul><li>Alle Geschäftsbereiche engagiert </li></ul>
    98. 98. SABMiller – Marken Statement
    99. 99. SABMiller.com – Berichte
    100. 100. SABMiller.com – Raster
    101. 101. SABMiller.com – Designelemente
    102. 102. SABMiller.com
    103. 103. SABMiller.com – Your page
    104. 104. SABMiller.com / Über Uns
    105. 105. SABMiller.com – Geschichten
    106. 106. SABMiller.com – Weltweit
    107. 107. SABMiller.com – Markenprofil
    108. 108. SABMiller.com – Markenprofil
    109. 109. SABMiller.com – Länderprofil
    110. 110. Gestaltet die Form aus dem Wesen der Aufgabe mit den Mitteln unserer Zeit. Das ist unsere Arbeit. Mies van der Rohe, Manifesto
    111. 111. <ul><li>Thank you </li></ul><ul><li>www.hilla.com </li></ul><ul><li>[email_address] </li></ul><ul><li>twitter: hillla </li></ul>

    ×