esono.com | boris müller: Life Blog Projects Teaching & Research

On the visual weariness of the web

17. September 2018
Calligraphy by Stefanie Weigele
Calligraphy by Stefanie Weigele

The visual blandness of the world wide web is disheartening. Everything looks the same. Generic fonts, no layout to speak of, interchangeable pages, no expressive visual language, even micro-typography is a mess. The current design of “cyberspace” is drab and dreary.

Right now, the design of web pages seems to be driven by technical and ideological constraints – and not by creativity and ideas. Every page consists of containers in containers in containers. Sometimes containers contain text — sometimes containers contain images. Nothing is truly designed — only assumed and pretended.

Ironically, current web technologies have enormous capabilities. On a visual level, almost every idea and every layout can be implemented. State of the art web design could be radical, surprising and evocative. It is possible to combine experimental typography with generative images and interactive experiences.

And yet – even design web sites are based on containers in containers in containers. The most popular portals for creatives on the web — dribbble and behance — are so fundamentally boring that they are basically interchangeable. Just look at this. Can you tell which one is which?

dribbble vs. behance - spot the difference
dribbble vs. behance – spot the difference. Thanks to David Rehman for pointing this out to me.

How did this happen? I believe there are several reasons. Technological frameworks like Content Management Systems (CMS) and blogging platforms like WordPress are based on the idea of templates. Pages from these frameworks are not individually crafted and designed but are generated on the fly by sticking together different media types like images, headlines, body text or videos. Templates are not designs but rules for combining related data types. Beyond the template structure there is usually no way to influence the visual appearance of the page. What you see is what you poured into the template. Templates are content agnostic. And that is a problem.

One of the fundamental principles of design is to establish a deep and meaningful relationship between form and content. This connection works in both ways. The form both reflects and shapes the content. Separating them breaks this principle and creates generic content containers. In a design-sense, templates are meaningless. The form adds nothing to the content.

There are plenty of other reasons for the lack of creativity – most of them economic and pragmatic. It is obviously time consuming to design individual pages. Considering the speed of online news and the frequency of new articles, large web sites simply do not have the resources to truly design a page. Furthermore, web design is still a matter of technical expertise. HTML, JavaScript and CSS remain a challenging tool for designers. There is still no web design equivalent to the powerful desktop publishing tools.

But I suspect there is also a creative and intellectual laziness when it comes to web design. In the age of mobile-first, generic framework-driven-development, nobody seems to bother with the visual and contextual integrity of a web page.

So how can we tackle this challenge? How can expressive and avant-garde web sites look like today? In order to answer this question, I suggest to look back. Sometimes, if you want to design the future, you have to rediscover the past.

Future-Retro-Webdesign

I did my first web site about 23 years ago — at the research and development group coinn at the University of the Arts in Bremen. Obviously, creating web pages was a really hot thing at that time. The web was very young and it sparked our imagination.

In the mid-nineties, we were struggling with the constraints of HTML. We could only use “web save fonts” like Arial, Times or Verdana. We had to use table layouts, monospaced fonts or GIFs in order to do exciting stuff. As HTML initially was purely content-driven, we had to work against the technology in order to do design a page.

While we tinkered with the early web, the graphic design world exploded. Experimental typography happened throughout the 20th century. From Tschichold’s Neue Typografie in the 20s to the computer driven layouts by April Greiman in the 80s, designers challenged the status quo and tried to find a visual language that represented the ideas and revolutions of their time. But in the nineties, an unusual combination of technological advancements and zeitgeist allowed for a very radical breed of graphic design. Irma Boom, David Carson, Paula Scheer, Neville Brody and many others literally turned the old graphic design world on its head.

Cover design for Ray Gun by David Carson
Cover design for Ray Gun by David Carson

Compared to the visual explosion of the graphic design world in the nineties, the early web pages were fairly lame. The Web Design Museum documents this very well. However, we desperately tried to translate the new visual style to the web. We did not get very far — but at least we were trying to push the technology to its limits in order to create expressive visual ideas.

In his book Towards a Philosophy of Photography, Vilém Flusser points out that “Freedom is playing against the camera”. This statement is clearly transferable to all forms of technical image production. And in the sense of this quote, we had a lot of freedom.

We wanted to do graphic design in the browser. Nobody knew how it was done or what mistakes you could make. There were no expectations on how a web page should look like. There were no standards, no CMS, (almost) no CSS, no JS, no video, no animation. You get the idea.

Fast forward to the year 2018. We can do everything in the browser. From massive-scale layouts to micro-typography plus animation and video. And what do we do with these incredible possibilities? Containers in containers in containers. Gigabytes of visually bland mobile-first pages that are contaminated with JavaScript. Generic templates that all follow the same visual rules. If my younger self in the year 1994 would have seen the state of web design 24 years later, he would have been very disappointed.

Today, the problem of web design is not the limits of the technology but the limits of our imagination and our obedience to visual conformity, economic viability and assumed expectations.

But every crisis creates an opportunity. Now is a good time to challenge the visual conformity of the web. Alas, I am too old and too bourgeois to come up with a radical, experimental and state-of-the-art approach to web design.

But I can ask my students to do it.

Future-Retro-Webdesign Class

In 2017, I did a web design class at the Interface Design programme in Potsdam. Every team was asked to come up with a redesign for an existing web site. The assignment was very clear: treat the browser window as a blank canvas and create expressive and imaginative visual experiences. Use the technological potential of current web technologies as a channel for your creativity. Do not be constrained by questions of usability, legibility and flexibility. Have an attitude. Disregard Erwartungskonformität.

I am very happy with the outcome of the class. You can find the results on this overview page. However, I would like to present four projects in more detail. Not because they are necessarily the best projects but because they represent different approaches to the challenge.

ZKM redesign

Frederic Haase and Jonas Köpfer

Frederic and Jonas picked the web site of the Zentrum für Kunst und Medien (ZKM) as a starting point for their experiments and explorations. A very fitting choice as the ZKM is one of the most prominent exhibition spaces for media art in Germany. The web site of the ZKM is fairly conventional. It works – but it lacks the avant-garde assertion that is conveyed by the art work in the exhibitions.

The aim of Frederic an Jonas was to design a concept, a visual language and a technical setup for the ZKM site that represents the progressive approach of the museum. At the core of their concept is a generative layout engine. Every time a page loads, a new visual appearance is created. Thus, a re-load is also a re-design.

View the redesign of the ZKM

Streem redesign

Daria Thies, Bela Kurek and Lucas Vogel

Streem is an art and street magazine. It is both a stage for upcoming artists and and a platform for social issues. Streem includes work from illustration, painting, photography, design, writing or journalism. It is very open and diverse.

Daria, Bela and Lucas have combined these different influences and based their designs on a conceptual city structure. For their prototype, they have created four different “neighbourhoods” that each represent a section of the original magazine. Their approach was to combine strong illustrative styles with spatial typography in order to create a legible city.

View the redesign of Streem

Medium redesign

Amelie Kirchmeyer and Fabian Schultz

Amelie and Fabian took a very structural approach. Instead of finding an adequate form for a specific content, their aim was to dissolve a web page and break it down to semantic, syntactical and statistical properties. Their idea was to demonstrate the fluidity and inherent malleability of HTML. They deconstructed Medium postings and created an environment that allows the readers to break down long texts into an experimental typographic space.

View the redesign of the Medium

Hacker News redesign

Fabian Dinklage and Florian Zia

Fabian and Florian turned Hacker News into an interactive visualisation. The social media site is a news aggregator focusing on computer science and information technology. Its design is bare-bones, but it has a complex system for voting and discussions. Fabian and Florian have taken this structure and turned it into a typographic space of timelines and networks. The visual presentation of the individual sections is based on the sequence and connections of news and comments. They connected their design to the api of Hacker News, so you can actually use their design to read the current news.

View the redesign of Hacker News

Final thoughts

David Carson once said: “don’t confuse communication with legibility”. This quote can be applied to the current state of web design. Legibility, usability, responsiveness and especially accessibility are essential qualities of the modern web. But they should not define and limit the visual repertoire of web design. If you equate stereotypes with usability you have understood neither visual design nor human centred design.

I for one would like to see more radical, generative, evocative, thoughtful, adequate, content-specific and intelligent web design. I would like to rediscover the web as a space for design experiments. I would like to be surprised more often.

I don’t know how the web will look like in 24 years. But I certainly hope it doesn’t look like the web today.

Type Casting; or, The Comic Sans of Errors

10. September 2018

Typefaces resemble actors. So which typeface is which performer? And who is Comic Sans? Read on to find out!

Calligraphy by Stefanie Weigele

A very common question in my first-year seminars is also a popular question in the design community: “why is Comic Sans considered to be such a bad typeface?”

Discussing typefaces with people who have just started to learn and practice design is tricky. There are good and bad typefaces. But there are also personal preferences and aversions. For a teacher — and a professional designer — it is important to differentiate the two different perspectives correctly.

There are obviously criteria for good typefaces — consistency, efficiency, elegance, versatility, robustness, etc. It is important to learn about the functional and aesthetic qualities of letters as well as the production quality of a typeface. Students and professional designers should be able to judge typefaces based on these criteria.

But choosing a typeface is not just pragmatic. As with so many other things, there are also personal favourites and dislikes. To be clear: bad type does not suddenly become great just because you think it is “cool”. But in order to choose between all those quality typefaces out there, you need more than technical specifications. You need taste and a sense for style.

Taste is personal. You might like a typeface that other people think is a bit bland. And you might hate a typeface that everyone else reveres. Sometimes the devil is in the details. Helvetica is not bad — sometimes it is even quite pretty. But I deeply and passionately hate the capital R in Helvetica. I consider it one of the ugliest letters out there.

Choosing a typeface is about appropriateness. There are always functional criteria — but they are usually not so clearly defined that they reduce the options to just one possibility. Typefaces have to feel right for the occasion. They have to convey a certain manner.

I like to compare typefaces with actors and actresses — they have obvious similarities. Actors do not simply speak the words of the play or the script. They turn an abstract role into a true and believable individual.

So type and actors have a lot in common. They give written language an identity and they give a face to an idea. Just like actors, typefaces do not only convey a subject matter. Their personality strongly shapes the way content is perceived. One typeface / actor can be a bit neutral, flexible and versatile while another is more personal, specific and meaningful.

The comparison between type and actors has a number of interesting consequences which lead to compelling thought experiments. You could cast Arnold Schwarzenegger for the role of Hamlet. But it would be very different from casting Benedict Cumberbatch. You could typeset Hamlet in Eurostile Extended — but it would be quite different from being set in Walbaum.

Helvetica is a bit like Tom Hanks. Mr. Everyman, no extremes, could work for the government or in a big company — but would still be a good neighbour with nice kids.


Meta is a bit like Emily Blunt. Quirky, edgy and authentic but also pretty and cool.

Walbaum is Benedict Cumberbatch.

Akzidenz Grotesk is Charlize Theron.

Copperplate is Samuel L. Jackson.

Galliard Italic is Lauren Bacall.

Univers is Kevin Spacey.

DIN is Michael Fassbender

Eurostile Extended is Arnold Schwarzenegger.

Bodoni is Tilda Swinton.

Rotis is Klaus Kinski.

I could go on for a while…

(It is actually quite fun to compare typefaces with actors and actresses! Maybe something for your next designer meet-up?)

So, big question — who is Comic Sans? I have to admit that I am struggling to find the proper actor that represents Comic Sans. On the one hand side, every red-blooded typographer considers Comic Sans to be silly, awkward and embarrassing. So Jim Carrey or Benny Hill come to mind. But then again that’s not quite fair.

The surprising thing about Comic Sans is that while it is strongly disapproved by designers and typographers, it is quite popular with school teachers, particle physicists, family and non-designer friends. Why is that?

In order to stay in my analogy, I suggest that the actor that can be compared with Comic Sans is “Uncle Bob”. This is not a specific person but a type of person we all know. He is an amateur actor, a really nice guy and lives down the road. On weekends, he and his troupe perform stage adaptations of Agatha Christie crime novels. Nobody would compare him to Marlon Brando. But it’s fun — though a bit embarrassing — to watch him act. And he is a nice bloke and approachable and after the show you can go to the pub with him and have a bit of a laugh.

I would like to defend the people out there who use Comic Sans. They do it because it feels right to them to use a well-known, approachable, uncomplicated typeface. Also — they lack alternatives. They are kind of stuck with uncle Bob.

In any case, I think comparing typefaces with actors and actresses is a delightful way to talk about typography. Not only within the design community but also with the wider public. Everyone knows actors — but only few people know and understand typefaces.

So — who is Futura? And who is Bembo? Gill must be a British actor / actress. But who exactly? Who is bland enough to be Arial or cosmopolitan enough to be Thesis? And — of course — which typeface has the coolness of Uma Thurman?

I welcome your comments and suggestions.


This essay was reviewed by Mr. Interface Typographer Frank Rausch. Frank is the designer and developer of V for Wikipedia and knows everything about screen typography. Many thanks for the feedback! We had good fun finding the right pair of typefaces and actors. Meta was really tricky…

This essay was originally published on Medium in 2017.

Strategies for Design-Science Collaborations

27. May 2018

Bringing Design to Science — Part 2: the how

Calligraphy by Stefanie Weigele
Calligraphy by Stefanie Weigele

My last essay “Bringing Design to Science” was an attempt to describe the relationship of design and science. I would like to build on the essay and explore this relationship further.

Throughout the twentieth century, science has informed and inspired design. With the proliferation of digital technology, this relationship has changed. In many ways, design can now inform science. This fundamentally redefines the interconnection of design and science and it changes the role and responsibilities of both domains.

At the end of my last essay, I presented three projects from the interface programme and the Urban Complexity Lab at the University of Applied Sciences Potsdam. The projects demonstrate successful design-science collaborations — and I believe that many insights for these collaborations can be created from the projects.

However, I did not explicitly present strategies for initiating and conducting design-science collaborations. I explained the why — but not the how.

This essay is about the how.

Strategies for Design-Science Collaborations

In my experience, designers and scientists do not really like each other. There are plenty of clichés and preconceptions on both sides. Scientists view designers as frivolous nitwits who are only interested in superficial aesthetics and lifestyle products. Designers, on the other hand, believe that scientists have no taste, are incapable of explaining their ideas and are not interested in communicating their work. These clichés are neither true nor productive.

So while a closer collaboration between design and science seems like an obvious and desirable idea, there are obstacles for initiating projects that involve both sides.

I am clearly coming from the design side of this problem. So I cannot suggest how the scientific community could open up to the design world. But I can make suggestions for strategies that would enable the design community to initiate a closer collaboration with the scientific world. All strategies are somewhat obvious — but I believe it is useful to describe them at least briefly and present concrete ideas of how designers can initiate design-science collaborations.

Before we jump right into the strategies, one quick remark: when I speak about science, I explicitly include the humanities! This is probably because of my German background. In Germany, the distinction between the natural sciences and the humanities is less strong than in Anglo-Saxon countries. The terms “Naturwissenschaft” (science of nature) and “Geisteswissenschaft” (science of the mind) have the same root. They are both “Wissenschaften”.

But now — on to the strategies: engage, embed, co-create, collaborate, and agenda setting.

Engage

This is very obvious — but also very important. Especially if you are already in academia. Go out and meet colleagues from other disciplines, departments and universities.

However, this engagement should not be limited to personal contacts and research projects. Engaging other disciplines can and should also happen on the teaching level. Bringing colleagues from other disciplines to your classes and projects is sometimes a great challenge for the students — but it is also very productive. Asking students to address scientific problems and creating designs for them is an extremely valuable experience!

To push the engagement even further, contribute to a scientific community. Publishing a scientifically sound paper in an adjoining discipline is quite a challenge — but it is also a fantastic opportunity to engage with a wider audience. And it is a statement that design has indeed a relevance for science. In the Urban Complexity Lab, we are regularly publishing papers in computer science, visualisation, and digital humanities conferences and journals.

This strategy can already be useful for students. In our Lab, we usually have one or two student teams who get the opportunity to develop their own projects into fully fledged research endeavours. A good example for this is the project Shifted Maps by Heike Otten and Lennart Hildebrandt.

In this project, the two students have assumed the role of researchers who engaged with the academic field of visualisation — but the aesthetic, interactive and communicative quality of the implementation is an indication of their design skills.

Shifted Maps visualizes personal movement data as a network of map extracts showing visited places.
Shifted Maps visualizes personal movement data as a network of map extracts showing visited places.

So engaging with the scientific community is not only valuable for teachers and professors — but also for students. If the collaboration between science and design intensifies, I believe this will actually be a requirement for a successful design education.

Embed

Embedding designers in scientific teams is probably the most promising, the most exciting and the most challenging strategy. Scientific teams are already often interdisciplinary. Not out of idealism but out of necessity.

One reason for this is the computer. Today, computer systems are involved in most scientific research. Dealing with large amounts of data requires someone who understands algorithms and databases. This not only requires a computer scientist. When you work with data, images and interfaces — and if you intend to publish your work beyond the close academic circle — you need designers. And you don’t only need them as an external partner — you need them on your team.

Right now, it is fairly unusual to have designers on scientific teams. In my last essay, I have shortly presented the project “The Organ Generator”. It is a great example for the impact that an embedded designer can have in a scientific team. The specifics obviously depend on the research topic — data visualisation, interface design, dissemination strategies are areas where design is very important. These contributions are not only aimed at the communication and publication of findings. Data visualisation is highly relevant for the analysis and interpretation of data that is collected during the project. I know from experience that creating bespoke visualisations for scientific projects create new perspectives on data and support the scientists in finding methodological problems and opportunities.

“Bloodline Alpha 1” - the design of the software was part of the Organ Generator project.
“Bloodline Alpha 1” – the design of the software was part of the Organ Generator project.

I sincerely hope that embedding designers in scientific teams will be standard procedure in a few years. There are great opportunities for both design and science. But both disciplines need to adapt. Scientists and funding agencies need to understand the importance of this approach in order to enable it. And designers need to be able to address the complexity of scientific research. And — most importantly — as design teachers, we need to prepare our students for this kind of work.

Co-Create

Co-creation techniques are well established and are very well documented. However, there is one aspect of co-creation that is slightly overlooked. Co-creation not only means that one partner supports the other in expressing ideas about formations, visualisations and interfaces. It also means that both partners have to collaborate in order to enhance understanding and to have a debate as equals. Co-creation in an academic context is a knowledge transfer into two directions. Ideally, the result of a co-creation process are questions, observations, hypotheses, experiments and findings that are shared by all partners.

In this context, I cannot stress enough how important it is for designers to understand the science part of the project. It is not enough to treat data as numbers, visualisations as pictures or interfaces as templates. All design done in a scientific context needs to take into account the models, methods and insights of the project. In a scientific project, you need to understand the science. This sounds intimidating — but it is possible. And in all likelihood, you will have access to a really strong scientific team.

Designers in a research project are usually involved in the communication and dissemination activities. So they need to explain and interpret the questions, findings and methodologies of the project. They act as translators between the scientists and a wider audience. And explaining something is the best way to learn.

Collaborate

The best strategy for a successful design-science collaboration is to make valuable contributions to the overall project. This statement is a bit trite — but true nonetheless.

In order to do so, designers have to identify points in the scientific method where they have the greatest impact. I believe these points are currently found at the very end of the scientific process. The diagram below is a simplification — but it shows possible opportunities for design work.

A simple model of the the scientific method with possible applications for design.
A simple model of the the scientific method with possible applications for design.

The last point in this process — “engage with public” — is not strictly part of the scientific method (if “public” is understood as an audience beyond the academic peers). But I believe it is becoming more important and it will be a greater requirement for scientific projects in the future. As noted above, design plays a very important at this stage and it is at this point where most design-science collaborations will start.

I suggest to work our way backwards. Once the value of design has become clear at the dissemination stage, the benefits for involving designers at several stages of the scientific process become more convincing.

With the right setup, design and science can collaborate as equal partners in a research project. However, there are a number of challenges associated with this strategy. Some of them are quite difficult as they are political.

The biggest problem here is that design is not yet fully recognised as an academic discipline by funding agencies. Most research programmes still focus on the established domains and do not recognise design as a research area. This is obviously problematic for the academic design community. For a design team, the only way to get a grant from a research funding agency is to associate itself with a larger scientific consortium.

This is not necessarily bad. Being part of a consortium creates lots of opportunities for engagement, co-creation and collaboration. And I appreciate that funding initiatives increasingly require research projects to address communication and dissemination activities as these are problems that call for an involvement of designers.

However, in this setup, designers will always be in a supporting role. And I believe that designers should also create their own research agenda. Which brings me to my last point…

Agenda Setting

Last but not least: if science and design are going to collaborate as equals, design needs to establish its own domain-specific research agenda. This is as important as it is difficult.

The main challenge is that the term design is not properly defined. It is highly context dependent and ranges from the styling of furniture to software development. It would be very difficult to define a general research agenda that represents all approaches, schools, sub-disciplines and manifestos of the design world.

However, within this diversity, it is possible to carve out a framework for design research questions that address specific fields of study and practice. For example, I have no problem to identify and to describe research questions in the area of data visualisation and interface design. It would go beyond the scope of this essay to describe these questions in detail — my point is simply that research activities are linked to specific well-defined questions — and not general problems.

So the question is: what is our intrinsic motivation as design researchers? What do we want to find out? What are the questions that are relevant for our discipline? What are our domain-specific strategies and methodologies for answering these questions?

While I believe that it is important to collaborate with scientists and to support other scientific research, designers should also pursue their own agenda. The role of design in a research project goes beyond providing services for other academic disciplines. And this is not a contradiction. Large, interdisciplinary research projects can provide a great framework for pursuing intrinsic design research questions.

Conclusion

I have said it before and I am saying it again: design should not be more scientific! Designers can claim a disciplinary autonomy and can refer to unique ways of knowledge production and research. The notion that a design-science collaboration would require design to be more objective and more methodological is misleading. This approach has failed in the past and would ultimately sabotage the very qualities that make design relevant for the scientific community.

It is actually the other way round. What makes design attractive for science are the specific approaches of professional design – the “designerly ways of knowing” as the design theorist Nigel Cross puts it.

As noted above, the relationship between design and science is not very well established and it is not trivial to implement the above strategies. But design and science can inform each other. New forms of collaboration can create new areas of expertise, new insights and new theories. There is much to be gained — and nothing to be lost.


This essay was also reviewed by my colleague Marian Dörk. Still going strong as a design-science collaboration!

Bringing Design to Science

11. November 2017

Science can benefit more from design than design from science.

Calligraphy by Stefanie Weigele

Design and science have an uneasy relationship. Or, to be more more precise, design has an uneasy relationship with science. Science on the other hand has almost no relationship with design and tends to happily ignore the excitements and commotions of the design world.

Historically, design has been fairly unscientific. As the name suggests, the Arts and Crafts movement, which is one of the foundations of modern design, was closer to fine art than to science. Designers and artists are often taught in the same department at university and share a similar mindset. Throughout the 20th century, art has inspired design — and sometimes vice versa. For many, design was primarily a strive for elegant and expressive aesthetics for the products and objects that surround us in our everyday life.

So historically, design is much closer to fine art than to science.

But things are not that simple. While aesthetics were, and are, the focal point of design — science and engineering always played an important role in the history of design. Scientific discoveries led to new technologies, new materials and new social spaces. But it was engineering and design that made these technical innovations accessible and affordable to a wider public. So one could argue that design makes scientific progress visible and usable.

This process was not limited to the natural sciences. In 1925, Otto Neurath created the »Vienna Method of Pictorial Statistics« which in 1934 became ISOTYPE — the International System of Typographic Picture Education.Together with the designers Marie Reidemeister and Gerd Arntz, Neurath wanted to create a new visual language that sought to explain the complexity of the world in pictorial form. Their aim was to communicate social and scientific data in a form that was understandable by a wider public.

A typical example of an ISOTYPE information graphic. Note the conveyor belt on the left!

Otto Neurath was an ardent logical positivist. He believed in empirical observation and in creating rational foundations for philosophical discourse. He was famous for interrupting philosophical debates by shouting “metaphysical!” if an argument was not rooted in empirical observation. So he was certainly not someone who was interested in expressive aesthetics and an artistic interpretation of design. And yet, ISOTYPE is a very important milestone in the history of graphic design.

The great achievement of ISOTYPE was to communicate complex statistical data through a formalised visual design language that enabled the viewers to quickly understand the relationship of symbols and data. In his seminal book International Picture Language, Neurath states that visual languages cannot replace verbal languages — but he also demonstrates the power of signs and pictures when it comes to explaining a complex process or conveying statistical data. So ISOTYPE is one of the earliest attempts to use design in order to communicate scientific data — in this case mainly from the social sciences and from history.

This “rationalistic” approach to design was later also pursued by the HfG Ulm (Hochschule für Gestaltung Ulm / Ulm School of Design). In 1953, the HfG Ulm accepted the first students. Right from the beginning it was clear that it would not just deal with superficial aesthetics. Design had a social and political responsibility. And the only way to address this responsibility was by becoming more objective — and more scientific.

Foundation course exercise at the HfG Ulm. Student: John Lottes; Instructor: Anthony Froshaug; 1958–59; Courtesy HfG-Archiv/Ulmer Museum

An essential part of the design education in Ulm was the to create a theoretical foundation and a rational reason for design decisions. Furthermore, not only the approach to design problems was methodical but also the aims and objectives of the design process. According to the ideas and ideals of the HfG, design should participate in the social and intellectual progress. It is the object of academic debate whether the design approach at the HfG Ulm was “scientific” — but it is safe to say that it introduced a form of intellectual questioning into the design process that is still valid today.

The scientific community was never particularly interested in the design world. But in the second half of the 20th century, it was recognised that science had a communication problem. In 1985, the Royal Society published a highly influential report with the title The Public Understanding of Science. The report recognises the importance of communicating the results of scientific research to a wider public. While mentioning the term “design” just occasionally, the report has strong implications for the relationship between design and science.

The responsibilities for design are fairly obvious. Communicating the history, the process and the results of science to a wider public is an immense design challenge. In this context, design offers great powers and possibilities. Be it the creation of a museum exhibit, the design of an information graphic or the interactive simulation of an experiment, design can convey scientific insights in an intelligent, informative and delightful way. In order to achieve this, the designer has to work closely with scientists and communicators and convey the right message and the right amount of complexity.

In this sense, design interprets science and transforms the interpretation into a concrete artefact. This interpretation is very much about finding an appropriate textual, visual and interactive form for a scientific statement.

However, it is important to note that this process cannot be a one-way-road. There are also responsibilities of science in this process. While the report The Public Understanding of Science states that “it is clearly a part of each scientist’s professional responsibility to promote the public understanding of science” it also recognises that “within the scientific community there is still often a stigma associated with being involved in the media”. Thirty years later this is still true. Every designer who has ever worked with scientist knows that creating science communication is indeed a tricky business.

We have to recognise that the scientific progress has reached a level of depth and complexity that it is hard to explain and to communicate every aspect.String theory is simply not trivial. Climate research deals with lots of uncertainties. Furthermore, science is highly specialised. There are a multitude of scientific disciplines and sub-disciplines. And even neighbouring disciplines sometimes do not understand each other. But we also have to recognise that in order to achieve a better public understanding of science, the scientific community needs to engage more with writers and designers.

If science wants to play a more active role in public debates, popular culture and universal education, it needs to adapt and gain a greater awareness of design strategies. Public understanding of science is a collaborative effort. And in this effort, design plays an important role.

So in the past, the relationship between science and design was dominated by attempts to make design more scientific and to employ design to make science more understandable.

This is all good and well. But I think design can do more. I believe design can make contributions to the scientific progress itself. Design can and should be part of science. Instead of bringing science to design, I would suggest to bring design to science.

Design — and especially interaction design — has many qualities, strategies and methodologies that can make substantial contributions to the scientific progress. This statement is probably surprising — if not irritating — to many people as “design” is still associated with things like marketing, advertising, superficial aesthetics, luxury and commercialism. While this association is not entirely wrong, it completely ignores the aspects of design that are extremely valuable for science: innovation, user-centredness, deep aesthetics, problem solving, contextual awareness. And as I have pointed out before, even the intuitive aspects of the design process are not irrational.

Instead of explaining these aspects in all detail, it is probably better to demonstrate the power and possibilities of design in the scientific context by illustrating this statement with concrete examples. At the Interface Design programme in Potsdam, we have been collaborating with scientists for many years. With our designs, we contributed to scientific projects and created new qualities in the scientific work.

The following design projects address and demonstrate the power and possibilities of design in science.

Design in the natural sciences

The Organ Generator — Computer Aided Biology Design

By Roman Grasy

In his MA thesis, Roman Grasy collaborated with a team of researchers that are exploring the possibilities of 3D bio-printing. He identified a number of research questions and problems that could be solved by design. As he was fully integrated into the team, he worked very closely with the researchers and created a number of relevant contributions for the project.

Bio-printing is a fairly new technology. It allows for the additive manufacturing of living tissue and is currently used to create individually designed mini-organs. Further developments of this technology aim at printing fully functional organs for medical transplantations. The printer used in this project was the Cellbricks Cellmaker, which uses stereolithography and specific bio-inks to print complex mini-organs. It has a resolution of up to 10μm.

Software prototype of “Bloodline Alpha 1” beneath the Cellbricks 3D bioprinting machine.

The starting point for the thesis was the design of a modelling software interface for the 3D bio-printer. While this was already a challenging topic and advanced into the application prototype “Bloodline Alpha 1”, the thesis quickly developed into a more complex investigation. Roman addressed many questions relating to the shape of the organoid data bodies. He applied generative design principles to the vascular aspects of the organoid bodies and created a parametric system that enabled him and the research team to create a large number of different models that are all based on the same generative principles. This setup formed a flexible but controlled environment for further experiments.

Impressions of generative designed vessel systems.

The setup was reflected in the interface and interaction design of the main software application for the modelling of the organoid data bodies — or “organ bricks”.

Based on the insights generated in the development of the system and the software interface, Roman was able to take the design questions a step further. He addressed the speculative question of how printed organs could possibly look and work like if they exist outside the human body.

Our organs are a repetition of patterns on complex organic surfaces within three dimensions. These patterns are based on the arrangement of functional units within the dense space structures of the human body.

The “Organ Generator” demonstrates the relevance of including designers in a scientific research team. The scope of the project and the quality of the results are strongly influenced by the design contributions. In this project, design is not just about reflecting scientific insights and optimising a software interface. Design explores the inherent questions and possibilities of the project. This way, design influences science — and vice versa.

Design in the humanities

VIKUS Viewer

By Katrin Glinka, Christopher Pietsch and Prof. Dr. Marian Dörk

In the last few years, a number of cultural institutions have digitised their collections. In many cases the media databases, in which the collections are stored, contain detailed and highly refined content. But the databases often lack adequate interfaces for working with the digitised material. There are not enough tools for exploring, visualising, organising and understanding cultural collections that support academics in their work.

The aim of the research project VIKUS is to investigate the role of data visualisation and graphical user interfaces in the exploration and examination of digitised cultural collections. Our team of researchers design, develop and evaluate interactive systems that support scientists and academics who work with cultural collections.

One of the outcomes of the VIKUS project is the interactive visualisation VIKUS Viewer in the implementation of »Past Visions«.

{Visualisation of historical drawings by Frederick William IV}

The visualisation is based on a digital collection of drawings by Frederick William IV of Prussia (1795–1861). The drawings reflect his personal ideas on art and architecture as well as literary influences or contemporary events like wars and revolutions. The database contains 1492 high-resolution images of the drawings and sketches and corresponding metadata.

The interactive visualisation provides the users with a number of ways to organise, explore and contextualise the images. It is realised as a dynamic canvas on which the drawings are arranged by year or similarity. Tools for interactive filtering and for zooming make the visualisation highly flexible and very powerful as the users can seamlessly move from high-level overviews to clusters and close-ups.

This setup allows the cultural scientists to see and explore the collection along temporal and thematic aspects while not abstracting the individual drawings into aggregated shapes. The interactive visualisation reveals both temporal and topical structures in the collection and provides a way to examine the high-resolution scans of the individual drawings.

The VIKUS Viewer provides cultural scientists with an innovative, valuable and efficient way to work with digital cultural collections. It is a well-designed tool for scientific research and generates new insights that would otherwise be lost or invisible.

Just as engineering provides scientists with new technological tools for measurement, recording and analysis, design provides science with new conceptual tools for the exploration and evaluation of data.

Design in Climate Impact Research

A Brief History of CO2 Emissions

By Julian Braun, Dr. Elmar Kriegler, Prof. Boris Müller et al.

Climate change is one of the most dramatic challenges of the 21st century. It is particularly insidious as it is a gradual process that takes place over many years. Climate change is only widely discussed when catastrophes like hurricanes or massive floodings occur. But it is a serious threat to global stability and it needs to be understood and acted upon.

As my colleague Elmar Kriegler from the Potsdam Institute for Climate Impact Research (PIK) explains: “Climate change is already occurring today (with around 1 degree warming since pre-industrial times) and even under the scenario of a successful implementation of the Paris Agreement will continue until mid-century (adding an extra half a degree of warming or a bit more until 2050). So some damages are here to stay, e.g. intensifying storms, heat waves and droughts, increasing sea levels, bleaching coral reefs, but the goal is to avoid the worst.”

Greenhouse gas emissions are one of the driving forces behind climate change. Together with the PIK, the Urban Complexity Lab of the University of Applied Sciences Potsdam designed and developed a short movie on CO2 emissions and on global warming. In our film “A Brief History of CO2 Emissions”, we visualize the geographic distribution and the historic dimension of carbon dioxide emissions.

We literally wanted to show where and when CO2 was emitted in the last 250 years — and might be emitted in the coming 80 years if no climate action is taken. By visualizing the global distribution and the local amount of cumulated CO2, we were able to create a strong image that demonstrates very clearly the dominant CO2 emitting regions and time spans. The format of a short film gave us also the opportunity to provide context and tell a story. So the data is not only visualized but also part of a narration. We believe that this combination of facts and storytelling is a great format for informing a wide audience about the causes and effects of climate change.

Our aim was not only to raise awareness for climate change but to relate factsand data. This was only possible by collaborating with climate scientists. The team from PIK choose the most recent and authoritative data sources on the topic. One important source was data from the Carbon Dioxide Information Analysis Center. It provides the longest time series of gridded (i.e. spatially distributed) CO2 emissions from fossil fuel combustion and cement manufacturing.

While our short film is essentially science communication and a good example for “the public understanding of science”, the collaboration with the researchers from the Potsdam Institute for Climate Impact research proved to be insightful and inspiring for both sides. It triggered the SENSES project that will address issues of visualising global climate change scenarios on a larger scale.

Conclusion

Science is one of the most important foundations of our modern world. This is not only true for the natural sciences but also for the humanities. Originally, design stood between the arts and engineering. But with the rise of digital technology, it has become more relevant for a wider range of topics and issues. We have reached a point where design — as a discipline — can contribute to the scientific progress and has indeed become part of science.

One of the most important contributions is certainly visualisation in its broadest sense. Designers are image-makers. And today, images play a very powerful role in science communication and in scientific work itself. If your scientific work involves images of any kind, you are dealing with design questions. Treating these questions with scientific integrity requires designers.

But beyond image-making, design can also play an important role in scientific work. Designers are trained as problem solvers and (co-)creators. As the project “The Organ Generator” has shown, designers can generate valuable contributions within a research project.

So science should engage with design — and vice versa. In order to make this happen, both communities need to open up more and engage each other. The scientific community should understand “design” not only as an aide in the sense of “public understanding of sciences” but also as a contributor to the scientific work itself. But the same is also true for design. If design is going to take on a greater responsibility in the world, it needs to engage more with scientific disciplines and bring the qualities that are inherent in design to the sciences.

This will leave design not unchanged. It will challenge the way we teach and practice design today. We will need new spaces where design and science can meet on equal terms. We will need new forms of research funding that requires the inclusion of the designers. We need an awareness for the potential of excellence in the science-design collaboration.

I strongly believe that designers as communicators, problem-solvers, image-makers, creators and co-creators can make relevant and valuable contributions to the scientific progress.


This essay was reviewed by my colleague Marian Dörk. He is a trained computer scientist – and I am a trained interaction designer. By jointly running the Urban Complexity Lab, we are a living example of a successful science–design collaboration!

“Bringing Design to Science” was originally published on Medium on 22 October 2017.

Picture, Depiction and Deception – Why Data Visualisations are Cultural Images

17. August 2017

Data visualisations are usually created by computers – but they are not technical images. Every visualisations is an interpretation of data and as such a cultural image.

Calligraphy by Stefanie Weigele

This essay is the sequel to a blog posting that I wrote more than two years ago. The subject is still relevant so it makes sense to re-visit the text and elaborate on the issue. My central point is that a lot of the current debate on data visualisation is not differentiated enough and is based on an antiquated idea of an “image”. So let’s start at the same point as last time:

In the excellent book Design for Information by Isabel Meirelles, I came across a quote from Ben Shneiderman:

“Like Galileo’s telescope (1564–1642), Hooke’s microscope (1635–1703), or Roentgen’s x-rays (1845–1923), new information analysis tools are creating visualizations of never before seen structures. Jupiter’s moon, plant cells, and skeletons of living creatures were all revealed by previous technologies. Today, new network science concepts and analysis tools are making isolated groups, influential participants, and community structures visible in ways never before possible.”

This is a great quote and I very much like the vision behind it. It is obvious that data visualisation is an essential strategy to deal with large sets of data. Turning abstract data into a concrete images transforms data into something we can perceive and relate to. Data visualisation translates the unimaginable into a tangible and sometimes interactive image. So the power of visualisation is something I strongly believe in and I totally agree with.

However, I think Ben Shneiderman – and many others in the datavis community – misses an essential point about visualisations. He draws analogies with technical devices. The comparison with telescopes, x-ray and microscopes implies that data visualisation is mainly a technical problem – a problem of magnification and resolution. Optical devices magnify small or distant objects. Lenses and mirrors direct and focus light waves and are thus revealing existing physical structures like plant cells or galaxies. The assumption is that these devices generate technical images that are objective and show aspects of reality.

So the quote by Ben Shneiderman suggests that data visualisations are technical images. It suggests that the visual representation of complex data structures can be directly derived from the data itself. It suggests that by using visual encodings as data-lenses, you can create an objective image of the data.

I believe that these assumptions are questionable and misleading.

There is a strong argument in media theory for treating all images as symbolic. This includes technical images that were generated by a device. They are also a representation of an entity and need to be decoded and interpreted. So even technical images are not a copy of reality.

Which brings me to my main argument. I believe that that data visualisations are not technical but cultural images. As we will see, this distinction is a gradual one – but it is important to note that data visualisations simply cannot be understood as an objective excerpt of reality.

For the further discussion, I would like to refer to Vilém Flusser. He was a highly influential media theorist and philosopher and he dedicated a lot of his publications to the role and significance of photography. In his book “Towards a Philosophy of Photography”, he develops a theoretical framework for understanding the relationship between the photographic image, the apparatus and the photographer. In particular, he questions the objectivity of the photographic image and the apparent control of the photographer in regard to the image-making. But his writings are not limited to photography – he explicitly refers to “technical images” that also include computer-generated visuals.

I believe Flusser’s book holds a number of relevant lessons for the debate on data visualisation that is happening right now. In this context, the parallels between the photographic image and data visualisations are intriguing. Many of the theories, concepts and ideas that Flusser developed for technical images can be applied directly to data visualisation. The following quotes are all taken from his book “Towards a Philosophy of Photography”.

From Technical Images to Cultural Images

Flusser’s definition of the technical image is pretty straightforward: “the technical image is an image produced by apparatuses”. But he directly points to one of the most relevant and culturally important aspects of technical images – the fact that they are often mistaken for the reality they depict. “They [technical images] appear to be on the same level of reality as their significance”. This is a fundamental insight that not only relates to artistic, professional or hobbyist photography, but also to scientific images. Images are always symbolic. Or – as Flusser puts it: “This lack of criticism of technical images is potentially dangerous at a time when technical images are in the process of displacing texts – dangerous for the reason that the ‘objectivity’ of technical images is an illusion. For they are – like all images – not only symbolic but represent even more abstract complexes of symbols than traditional images.”

Important for our debate is also Flusser’s distinction between technical images and traditional images: “With traditional images, by contrast, the symbolic character is clearly evident because, in their case, human beings (for example, painters) place themselves between the images and their significance. Painters work out the symbols of the image ‘in their heads’ so as to transfer them by means of the paintbrush to the surface.”

This distinction is important insofar as it introduces two kinds of image-making. The technical image is produced by an apparatus, the traditional image is crafted by a person. This distinction has nothing to do with qualities. This is not about whether a traditional image is better than a technical image. But the distinction has a lot to do with the way these two different kind of images are perceived. A traditional image is perceived as real in itself – a technical image is perceived as a window on reality. But obviously the technical image is also (and primarily) real in itself.

It is clear that the traditional image is a cultural image. But following the above line of thought, it becomes apparent that technical images are also cultural images. The technical conditions of a optical apparatus do not make an image objective. The use of technology for image generation does not remove the layers of meaning and significance of the image itself. An image is an image. Even if it is produced by a machine.

I think at this point it becomes quite clear where I am heading. Data visualisations and photography share a number of similar attributes. They are both technical images that seem to be an objective representation of reality. But on closer examination it becomes clear that both are essentially cultural images. And they should be treated, interpreted and decoded as such.

The statement that data visualisation creates cultural images is important in two different ways.

First, it is important for the interpretation of data visualisations. As we have seen, they are more than a technical representation of data and facts. Data visualisations are cultural artefacts and need to be interpreted accordingly. And as all other cultural images, there are different ways to read and interpret them. So instead of simply talking about “insights” I would argue for a hermeneutical approach when dealing with visualisations. Visualisations should not only be interpreted on the grounds of their technicality but also in terms of their culturality.

Second, it is important for the creation of visualisations. I am very much aware of a certain suspicion regarding well-designed visualisations. I often encounter the prejudice that aesthetics is just getting in the way of proper data representation and that design just obfuscates objectivity. I strongly believe that this is not true – simply because the objectivity of an image is an illusion. So instead of negating the role of design in the creation of data visualisations, we should embrace and improve it.

I know that many colleagues in our community are uncomfortable with the notion of human interference with data visualisation. If designers “place themselves between the images and their significance” as Flusser puts it, the colleagues fear that the objectivity gets lost. But it is important to point out there was no objectivity in the first place. Actually, the lack of objectivity goes even deeper. As Johanna Drucker has pointed out in her book Graphesis: “Data are capta, taken not given, constructed as an interpretation of the phenomenal world, not inherent in it”. So the collection and generation of data is already culturally biased. And if we stay in the analogy between photography and data visualisation, one could point out the data visualisers do not only use an apparatus – they actively create new ones.

All this does not mean that data visualisation is random, artistic and meaningless. Quite the opposite. Just as photography, visualisations can make strong statements about reality. However, we need to be aware of the fact that both the data and the visualisation are constructions. A visualisation is an artefact in itself and not just a neutral conduit for data. It helps us to relate to the data – but it obviously shapes the way we perceive it. Just like with a photo, we should not only recognise what is depicted – we need to recognize the picture itself.

Photography and data visualisations can explain, enlighten and entertain. Both represent facts, stories and events. As such, both are meaningful and useful. And both photos and data visualisations are essentially cultural images.


This essay was reviewed by Moritz Stefaner. Being a “Truth and Beauty Operator”, he had to a lot to say about the topic. Special thanks for asking “what do you mean with ‘technical image’?”. It was originally published on Medium on 30. March 2017 under the original title: “Picture, Depiction and Deception”.

« Older postings |






RSS Feed | Twitter @borism | Impressum und Datenschutz