Material of Interfaces

Exploring the strangest canvas

Table of Contents

Complexity
How interface design became so hard.
 

The Rabbit-hole
The upside-down logic of digital product design.
 

Ways of Seeing
Why do we need to go into all this?
 

Problem of the Page
Why interface design is not graphic design.

🤯
🐇
👓
📄

🤯 Complexity

How interface design became so hard

Interface Design
 

Y U so hard?

Emergent Growth

"An emergent behavior or emergent property can appear when a number of simple entities (agents) operate in an environment, forming more complex behaviors as a collective. If emergence happens over disparate size scales, then the reason is usually a causal relation across different scales. In other words, there is often a form of top-down feedback in systems with emergent properties. The processes causing emergent properties may occur in either the observed or observing system, and are commonly identifiable by their patterns of accumulating change, generally called 'growth'."

 

Wikipedia: Emergence

Emergent Growth

"An emergent behavior or emergent property can appear when a number of simple entities (agents) operate in an environment, forming more complex behaviors as a collective. If emergence happens over disparate size scales, then the reason is usually a causal relation across different scales. In other words, there is often a form of top-down feedback in systems with emergent properties. The processes causing emergent properties may occur in either the observed or observing system, and are commonly identifiable by their patterns of accumulating change, generally called 'growth'."

 

Wikipedia: Emergence

Emergent Growth

"An emergent behavior or emergent property can appear when a number of simple entities (agents) operate in an environment, forming more complex behaviors as a collective. If emergence happens over disparate size scales, then the reason is usually a causal relation across different scales. In other words, there is often a form of top-down feedback in systems with emergent properties. The processes causing emergent properties may occur in either the observed or observing system, and are commonly identifiable by their patterns of accumulating change, generally called 'growth'."

 

Wikipedia: Emergence

Emergent Growth

"An emergent behavior or emergent property can appear when a number of simple entities (agents) operate in an environment, forming more complex behaviors as a collective. If emergence happens over disparate size scales, then the reason is usually a causal relation across different scales. In other words, there is often a form of top-down feedback in systems with emergent properties. The processes causing emergent properties may occur in either the observed or observing system, and are commonly identifiable by their patterns of accumulating change, generally called 'growth'."

 

Wikipedia: Emergence

Emergent Growth

"An emergent behavior or emergent property can appear when a number of simple entities (agents) operate in an environment, forming more complex behaviors as a collective. If emergence happens over disparate size scales, then the reason is usually a causal relation across different scales. In other words, there is often a form of top-down feedback in systems with emergent properties. The processes causing emergent properties may occur in either the observed or observing system, and are commonly identifiable by their patterns of accumulating change, generally called 'growth'."

 

Wikipedia: Emergence

A

C

B

A

C

B

D

D

Roundhay Garden Scene (1888)

Credited Crew: 7

Marvel Avengers: Endgame (2019)

Credited Crew: 497

Interfaces

Is This Design Hell?

"Initially, developers and designers tried to navigate this new reality by creating new rules. But the problem was that the goalposts kept moving. [...] Today’s Web is a wild place. The Web has never been a static platform, no matter how much people might wish it were so. [...] That statement will only grow more true with every passing day. Standards are changing on, in some cases, a daily or weekly basis, new devices are coming online at a furious pace, and browser vendors are going at it tooth and nail to innovate their way to the top of the league tables."

Rob Larsen
The Uncertain Web (2014)

Is This Design Hell?

"Initially, developers and designers tried to navigate this new reality by creating new rules. But the problem was that the goalposts kept moving. [...] Today’s Web is a wild place. The Web has never been a static platform, no matter how much people might wish it were so. [...] That statement will only grow more true with every passing day. Standards are changing on, in some cases, a daily or weekly basis, new devices are coming online at a furious pace, and browser vendors are going at it tooth and nail to innovate their way to the top of the league tables."

Rob Larsen
The Uncertain Web (2014)

Is This Design Hell?

"Initially, developers and designers tried to navigate this new reality by creating new rules. But the problem was that the goalposts kept moving. [...] Today’s Web is a wild place. The Web has never been a static platform, no matter how much people might wish it were so. [...] That statement will only grow more true with every passing day. Standards are changing on, in some cases, a daily or weekly basis, new devices are coming online at a furious pace, and browser vendors are going at it tooth and nail to innovate their way to the top of the league tables."

Rob Larsen
The Uncertain Web (2014)

Is This Design Hell?

"Initially, developers and designers tried to navigate this new reality by creating new rules. But the problem was that the goalposts kept moving. [...] Today’s Web is a wild place. The Web has never been a static platform, no matter how much people might wish it were so. [...] That statement will only grow more true with every passing day. Standards are changing on, in some cases, a daily or weekly basis, new devices are coming online at a furious pace, and browser vendors are going at it tooth and nail to innovate their way to the top of the league tables."

Rob Larsen
The Uncertain Web (2014)

Is This Design Hell?

"Initially, developers and designers tried to navigate this new reality by creating new rules. But the problem was that the goalposts kept moving. [...] Today’s Web is a wild place. The Web has never been a static platform, no matter how much people might wish it were so. [...] That statement will only grow more true with every passing day. Standards are changing on, in some cases, a daily or weekly basis, new devices are coming online at a furious pace, and browser vendors are going at it tooth and nail to innovate their way to the top of the league tables."

Rob Larsen
The Uncertain Web (2014)

Is This Design Hell?

"Initially, developers and designers tried to navigate this new reality by creating new rules. But the problem was that the goalposts kept moving. [...] Today’s Web is a wild place. The Web has never been a static platform, no matter how much people might wish it were so. [...] That statement will only grow more true with every passing day. Standards are changing on, in some cases, a daily or weekly basis, new devices are coming online at a furious pace, and browser vendors are going at it tooth and nail to innovate their way to the top of the league tables."

Rob Larsen
The Uncertain Web (2014)

Is This Design Hell?

"Initially, developers and designers tried to navigate this new reality by creating new rules. But the problem was that the goalposts kept moving. [...] Today’s Web is a wild place. The Web has never been a static platform, no matter how much people might wish it were so. [...] That statement will only grow more true with every passing day. Standards are changing on, in some cases, a daily or weekly basis, new devices are coming online at a furious pace, and browser vendors are going at it tooth and nail to innovate their way to the top of the league tables."

Rob Larsen
The Uncertain Web (2014)

Is This Design Hell?

"Initially, developers and designers tried to navigate this new reality by creating new rules. But the problem was that the goalposts kept moving. [...] Today’s Web is a wild place. The Web has never been a static platform, no matter how much people might wish it were so. [...] That statement will only grow more true with every passing day. Standards are changing on, in some cases, a daily or weekly basis, new devices are coming online at a furious pace, and browser vendors are going at it tooth and nail to innovate their way to the top of the league tables."

Rob Larsen
The Uncertain Web (2014)

Save Yourself

"The web platform is Write Once,
Cry Everywhere."

Yehuda Katz
W3C and TC-39 Commitee Member

Or Design Heaven?

"Instead of worrying about the fracture in the Web and wishing that it was something else, accept the Web for the blessing that it is. And it is a blessing. Because the core technology can run, unaltered, on billions of devices in the hands of billions of people, you have immediate access to all of those billions of people and all of those billions of devices. How great is that?"

Rob Larsen
The Uncertain Web (2014)

Or Design Heaven?

"Instead of worrying about the fracture in the Web and wishing that it was something else, accept the Web for the blessing that it is. And it is a blessing. Because the core technology can run, unaltered, on billions of devices in the hands of billions of people, you have immediate access to all of those billions of people and all of those billions of devices. How great is that?"

Rob Larsen
The Uncertain Web (2014)

Or Design Heaven?

"Instead of worrying about the fracture in the Web and wishing that it was something else, accept the Web for the blessing that it is. And it is a blessing. Because the core technology can run, unaltered, on billions of devices in the hands of billions of people, you have immediate access to all of those billions of people and all of those billions of devices. How great is that?"

Rob Larsen
The Uncertain Web (2014)

Or Design Heaven?

"Instead of worrying about the fracture in the Web and wishing that it was something else, accept the Web for the blessing that it is. And it is a blessing. Because the core technology can run, unaltered, on billions of devices in the hands of billions of people, you have immediate access to all of those billions of people and all of those billions of devices. How great is that?"

Rob Larsen
The Uncertain Web (2014)

Or Design Heaven?

"Instead of worrying about the fracture in the Web and wishing that it was something else, accept the Web for the blessing that it is. And it is a blessing. Because the core technology can run, unaltered, on billions of devices in the hands of billions of people, you have immediate access to all of those billions of people and all of those billions of devices. How great is that?"

Rob Larsen
The Uncertain Web (2014)

Or Design Heaven?

"Instead of worrying about the fracture in the Web and wishing that it was something else, accept the Web for the blessing that it is. And it is a blessing. Because the core technology can run, unaltered, on billions of devices in the hands of billions of people, you have immediate access to all of those billions of people and all of those billions of devices. How great is that?"

Rob Larsen
The Uncertain Web (2014)

Or Design Heaven?

"Instead of worrying about the fracture in the Web and wishing that it was something else, accept the Web for the blessing that it is. And it is a blessing. Because the core technology can run, unaltered, on billions of devices in the hands of billions of people, you have immediate access to all of those billions of people and all of those billions of devices. How great is that?"

Rob Larsen
The Uncertain Web (2014)

Or Design Heaven?

"Instead of worrying about the fracture in the Web and wishing that it was something else, accept the Web for the blessing that it is. And it is a blessing. Because the core technology can run, unaltered, on billions of devices in the hands of billions of people, you have immediate access to all of those billions of people and all of those billions of devices. How great is that?"

Rob Larsen
The Uncertain Web (2014)

Content

Writing

Style

Writing   Graphic Design

Fidelity

Writing   Graphic Design   Broadcasting

Reactivity

Writing   Graphic Design   Broadcasting   ?

Asynchrony

Writing   Graphic Design   Broadcasting   ?   ?

Immersion

Writing   Graphic Design   Broadcasting   ?   ?   

🐇 The Rabbit-hole

The upside-down logic of digital product design

"Do not try and bend the spoon. That's impossible. Instead, only try to realise the truth. There is no spoon. Then you'll see that it is not the spoon that bends, it is only yourself"


The Matrix (1999)

1984

1999

Interface as Hallucination?

"Cyberspace. A consensual hallucination experienced daily by billions of legitimate operators, in every nation, by children being taught mathematical concepts... A graphic representation of data abstracted from banks of every computer in the human system. Unthinkable complexity."

William Gibson
Neuromancer (1984)

Interface as Hallucination?

"Cyberspace. A consensual hallucination experienced daily by billions of legitimate operators, in every nation, by children being taught mathematical concepts... A graphic representation of data abstracted from banks of every computer in the human system. Unthinkable complexity."

William Gibson
Neuromancer (1984)

Interface as Hallucination?

"Cyberspace. A consensual hallucination experienced daily by billions of legitimate operators, in every nation, by children being taught mathematical concepts... A graphic representation of data abstracted from banks of every computer in the human system. Unthinkable complexity."

William Gibson
Neuromancer (1984)

Interface as Hallucination?

"Cyberspace. A consensual hallucination experienced daily by billions of legitimate operators, in every nation, by children being taught mathematical concepts... A graphic representation of data abstracted from banks of every computer in the human system. Unthinkable complexity."

William Gibson
Neuromancer (1984)

Interface as Hallucination?

"Cyberspace. A consensual hallucination experienced daily by billions of legitimate operators, in every nation, by children being taught mathematical concepts... A graphic representation of data abstracted from banks of every computer in the human system. Unthinkable complexity."

William Gibson
Neuromancer (1984)

A Poem

"And if our weakness has been to confuse
the bright and bloody colors of our calendars
with the true weather of days,
and the parchment’s territory of our maps
with the land spread out before us, never mind.

We have always been on our way to this new place,
that is no place really, but it is real."

William Gibson
Memory Palace (1991)

A Poem

"And if our weakness has been to confuse
the bright and bloody colors of our calendars
with the true weather of days
,
and the parchment’s territory of our maps
with the land spread out before us, never mind.

We have always been on our way to this new place,
that is no place really, but it is real."

William Gibson
Memory Palace (1991)

A Poem

William Gibson
Memory Palace (1991)

"And if our weakness has been to confuse
the bright and bloody colors of our calendars
with the true weather of days,
and the
parchment’s territory of our maps
with the land spread out before us
, never mind.

We have always been on our way to this new place,
that is no place really, but it is real."

A Poem

William Gibson
Memory Palace (1991)

"And if our weakness has been to confuse
the bright and bloody colors of our calendars
with the true weather of days,
and the parchment’s territory of our maps
with the land spread out before us, never mind.


We have always been on our way to this new place,
that is no place really, but it is real."

A Poem

William Gibson
Memory Palace (1991)

"And if our weakness has been to confuse
the bright and bloody colors of our calendars
with the true weather of days,
and the parchment’s territory of our maps
with the land spread out before us, never mind.

We have always been on our way to this new place,

that is no place really, but it is real."

What is it Made Of?

Hyperobjects

"I do not access hyperobjects across a distance, through some transparent medium. Hyperobjects are here, right here in my social and experiential space. [...] They are indeed more than a little demonic, in the sense that they appear to straddle worlds and times, like fiber optic cables or electromagnetic fields."


                     

Timothy Morton
Hyperobjects (2013)

Hyperobjects

"I do not access hyperobjects across a distance, through some transparent medium. Hyperobjects are here, right here in my social and experiential space. [...] They are indeed more than a little demonic, in the sense that they appear to straddle worlds and times, like fiber optic cables or electromagnetic fields."


                     

Timothy Morton
Hyperobjects (2013)

Hyperobjects

"I do not access hyperobjects across a distance, through some transparent medium. Hyperobjects are here, right here in my social and experiential space. [...] They are indeed more than a little demonic, in the sense that they appear to straddle worlds and times, like fiber optic cables or electromagnetic fields."


                     

Timothy Morton
Hyperobjects (2013)

Hyperobjects

"I do not access hyperobjects across a distance, through some transparent medium. Hyperobjects are here, right here in my social and experiential space. [...] They are indeed more than a little demonic, in the sense that they appear to straddle worlds and times, like fiber optic cables or electromagnetic fields."


                     

Timothy Morton
Hyperobjects (2013)

Hyperobjects

"I do not access hyperobjects across a distance, through some transparent medium. Hyperobjects are here, right here in my social and experiential space. [...] They are indeed more than a little demonic, in the sense that they appear to straddle worlds and times, like fiber optic cables or electromagnetic fields."


                     

Timothy Morton
Hyperobjects (2013)

Can You See The World?

“We are all burnt by ultraviolet rays. We all contain water in about the same ratio as Earth does, and salt water in the same ratio that the oceans do. We are poems about the hyperobject Earth.”


                     

Timothy Morton
Hyperobjects (2013)

Can You See The World?

We are all burnt by ultraviolet rays. We all contain water in about the same ratio as Earth does, and salt water in the same ratio that the oceans do. We are poems about the hyperobject Earth.”


                     

Timothy Morton
Hyperobjects (2013)

Can You See The World?

“We are all burnt by ultraviolet rays. We all contain water in about the same ratio as Earth does, and salt water in the same ratio that the oceans do. We are poems about the hyperobject Earth.


                     

Timothy Morton
Hyperobjects (2013)

"Seeing" Climate Change

Localized Representations

Quantum Physics

"And since quantum physics allows for multiple possibilities simultaneously, these possibilities should then keep existing, even after a measurement is made. But they don't. Every possibility but one vanishes. We do not see any of the others around us. We live in a classical world, where everything is based on quantum laws but nothing resembles the quantum world."

Christophe Galfard
The Universe in Your Hand (2016)

Quantum Physics

"And since quantum physics allows for multiple possibilities simultaneously, these possibilities should then keep existing, even after a measurement is made. But they don't. Every possibility but one vanishes. We do not see any of the others around us. We live in a classical world, where everything is based on quantum laws but nothing resembles the quantum world."


                     

Christophe Galfard
The Universe in Your Hand (2016)

Quantum Physics

"And since quantum physics allows for multiple possibilities simultaneously, these possibilities should then keep existing, even after a measurement is made. But they don't. Every possibility but one vanishes. We do not see any of the others around us. We live in a classical world, where everything is based on quantum laws but nothing resembles the quantum world."


                     

Christophe Galfard
The Universe in Your Hand (2016)

Quantum Physics

"And since quantum physics allows for multiple possibilities simultaneously, these possibilities should then keep existing, even after a measurement is made. But they don't. Every possibility but one vanishes. We do not see any of the others around us. We live in a classical world, where everything is based on quantum laws but nothing resembles the quantum world."


                     

Christophe Galfard
The Universe in Your Hand (2016)

Quantum Physics

"And since quantum physics allows for multiple possibilities simultaneously, these possibilities should then keep existing, even after a measurement is made. But they don't. Every possibility but one vanishes. We do not see any of the others around us. We live in a classical world, where everything is based on quantum laws but nothing resembles the quantum world."


                     

Christophe Galfard
The Universe in Your Hand (2016)

University Cape Town

Limits of Human Senses

Christophe Galfard
The Universe in Your Hand (2016)

"When left alone, quantum particles behave as multiple images of themselves (as waves, really), simultaneously moving through all possible paths in space and time. Now, again, why do we not experience this multitude around ourselves? Is it because we are probing things around us all the time? Why do all experiments that involve, say, the position of a particle make the particle suddenly be somewhere rather than everywhere? No one knows."


                     

Limits of Human Senses

Christophe Galfard
The Universe in Your Hand (2016)

"When left alone, quantum particles behave as multiple images of themselves (as waves, really), simultaneously moving through all possible paths in space and time. Now, again, why do we not experience this multitude around ourselves? Is it because we are probing things around us all the time? Why do all experiments that involve, say, the position of a particle make the particle suddenly be somewhere rather than everywhere? No one knows."


                     

Limits of Human Senses

"When left alone, quantum particles behave as multiple images of themselves (as waves, really), simultaneously moving through all possible paths in space and time. Now, again, why do we not experience this multitude around ourselves? Is it because we are probing things around us all the time? Why do all experiments that involve, say, the position of a particle make the particle suddenly be somewhere rather than everywhere? No one knows."


                     

Christophe Galfard
The Universe in Your Hand (2016)

Limits of Human Senses

Christophe Galfard
The Universe in Your Hand (2016)

"When left alone, quantum particles behave as multiple images of themselves (as waves, really), simultaneously moving through all possible paths in space and time. Now, again, why do we not experience this multitude around ourselves? Is it because we are probing things around us all the time? Why do all experiments that involve, say, the position of a particle make the particle suddenly be somewhere rather than everywhere? No one knows."


                     

Limits of Human Senses

Christophe Galfard
The Universe in Your Hand (2016)

"When left alone, quantum particles behave as multiple images of themselves (as waves, really), simultaneously moving through all possible paths in space and time. Now, again, why do we not experience this multitude around ourselves? Is it because we are probing things around us all the time? Why do all experiments that involve, say, the position of a particle make the particle suddenly be somewhere rather than everywhere? No one knows."


                     

Schrodinger's Cat (1935)

👓 Ways of Seeing

What are the implications of how we think about interfaces?

The Treachery of Images

"The relation between what we see
and what we know is never settled.
Each evening we see the sun set.
We know that the earth is turning away from it.
Yet the knowledge, the explanation,
never quite fits the sight
"


                      John Berger
                      Ways of Seeing (1972)

The Treachery of Images

"The relation between what we see
and what we know is never settled
.
Each evening we see the sun set.
We know that the earth is turning away from it.
Yet the knowledge, the explanation,
never quite fits the sight
"


                      John Berger
                      Ways of Seeing (1972)

The Treachery of Images

"The relation between what we see
and what we know is never settled.

Each evening we see the sun set.
We know that the earth is turning away from it.
Yet the knowledge, the explanation,
never quite fits the sight
"


                      John Berger
                      Ways of Seeing (1972)

The Treachery of Images

"The relation between what we see
and what we know is never settled.
Each evening we see the sun set.
We know that the earth is turning away from it.
Yet the knowledge, the explanation,
never quite fits the sight
"


                      John Berger
                      Ways of Seeing (1972)

The Treachery of Images

"The relation between what we see
and what we know is never settled.
Each evening we see the sun set.
We know that the earth is turning away from it.
Yet the knowledge, the explanation,
never quite fits the sight
"


                      John Berger
                      Ways of Seeing (1972)

The Treachery of Images

"The relation between what we see
and what we know is never settled.
Each evening we see the sun set.
We know that the earth is turning away from it.
Yet the knowledge, the explanation,
never quite fits the sight
"


                      John Berger
                      Ways of Seeing (1972)

The Treachery of Images

"The relation between what we see
and what we know is never settled.
Each evening we see the sun set.
We know that the earth is turning away from it.
Yet the knowledge, the explanation,
never quite fits the sight
"


                      John Berger
                      Ways of Seeing (1972)

This is not a Pipe

This is not a Webpage

It is a slide in a presentation of a screenshot of specific state of web page displaying specific user data at a specific point in time to the user himself by means of a desktop computer.

It is a slide in a presentation of a screenshot of specific state of web page displaying specific user data at a specific point in time to the user himself by means of a desktop computer.

It is a slide in a presentation of a screenshot of specific state of web page displaying specific user data at a specific point in time to the user himself by means of a desktop computer.

It is a slide in a presentation of a screenshot of specific state of web page displaying specific user data at a specific point in time to the user himself by means of a desktop computer.

It is a slide in a presentation of a screenshot of specific state of web page displaying specific user data at a specific point in time to the user himself by means of a desktop computer.

Interface Design as a Job

"The old PSD-to-HTML workflow served us well for many years, but isn’t able to stand in the face of all the complexity that responsive web design and the multi-device web have introduced. Internal processes have already begun to change. Likewise, how we craft webpages and what we deliver to our clients must mature."

Dave Rupert
Responsive Deliverables (2013)

Interface Design as a Job

"The old PSD-to-HTML workflow served us well for many years, but isn’t able to stand in the face of all the complexity that responsive web design and the multi-device web have introduced. Internal processes have already begun to change. Likewise, how we craft webpages and what we deliver to our clients must mature."

Dave Rupert
Responsive Deliverables (2013)

Interface Design as a Job

"The old PSD-to-HTML workflow served us well for many years, but isn’t able to stand in the face of all the complexity that responsive web design and the multi-device web have introduced. Internal processes have already begun to change. Likewise, how we craft webpages and what we deliver to our clients must mature."

Dave Rupert
Responsive Deliverables (2013)

Interface Design as a Job

"The old PSD-to-HTML workflow served us well for many years, but isn’t able to stand in the face of all the complexity that responsive web design and the multi-device web have introduced. Internal processes have already begun to change. Likewise, how we craft webpages and what we deliver to our clients must mature."

Dave Rupert
Responsive Deliverables (2013)

Interface Design as a Job

"The old PSD-to-HTML workflow served us well for many years, but isn’t able to stand in the face of all the complexity that responsive web design and the multi-device web have introduced. Internal processes have already begun to change. Likewise, how we craft webpages and what we deliver to our clients must mature."

Dave Rupert
Responsive Deliverables (2013)

 📄 Problem of the Page

Why interface design is not graphic design

The Workspace

"In every other creative medium, the artist begins her work by selecting a canvas. A painter chooses a sheet of paper or fabric to work on; a sculptor might select a block of stone from a quarry. Regardless of the medium, choosing a canvas is a powerful, creative act: before the first brush stroke, before striking the chisel, the canvas gives the art a dimension and shape, a width and a height, establishing a boundary for the work yet to come."

Ethan Marcotte
Responsive Web Design (2011)

Importance of the Canvas

"In every other creative medium, the artist begins her work by selecting a canvas. A painter chooses a sheet of paper or fabric to work on; a sculptor might select a block of stone from a quarry. Regardless of the medium, choosing a canvas is a powerful, creative act: before the first brush stroke, before striking the chisel, the canvas gives the art a dimension and shape, a width and a height, establishing a boundary for the work yet to come."

Ethan Marcotte
Responsive Web Design (2011)

The Workspace

"In every other creative medium, the artist begins her work by selecting a canvas. A painter chooses a sheet of paper or fabric to work on; a sculptor might select a block of stone from a quarry. Regardless of the medium, choosing a canvas is a powerful, creative act: before the first brush stroke, before striking the chisel, the canvas gives the art a dimension and shape, a width and a height, establishing a boundary for the work yet to come."

Ethan Marcotte
Responsive Web Design (2011)

The Workspace

"In every other creative medium, the artist begins her work by selecting a canvas. A painter chooses a sheet of paper or fabric to work on; a sculptor might select a block of stone from a quarry. Regardless of the medium, choosing a canvas is a powerful, creative act: before the first brush stroke, before striking the chisel, the canvas gives the art a dimension and shape, a width and a height, establishing a boundary for the work yet to come."

Ethan Marcotte
Responsive Web Design (2011)

The Workspace

"In every other creative medium, the artist begins her work by selecting a canvas. A painter chooses a sheet of paper or fabric to work on; a sculptor might select a block of stone from a quarry. Regardless of the medium, choosing a canvas is a powerful, creative act: before the first brush stroke, before striking the chisel, the canvas gives the art a dimension and shape, a width and a height, establishing a boundary for the work yet to come."

Ethan Marcotte
Responsive Web Design (2011)

The Workspace

"In every other creative medium, the artist begins her work by selecting a canvas. A painter chooses a sheet of paper or fabric to work on; a sculptor might select a block of stone from a quarry. Regardless of the medium, choosing a canvas is a powerful, creative act: before the first brush stroke, before striking the chisel, the canvas gives the art a dimension and shape, a width and a height, establishing a boundary for the work yet to come."

Ethan Marcotte
Responsive Web Design (2011)

Liminal Spaces

"What I sense is a real tension between the web as we know it, and the web as it would be. It’s the tension between an existing medium, the printed page, and its child, the web. [...] If you ever get the chance to watch early television drama you’ll find a strong example of this. Because radio required a voice-over to describe what listeners couldn’t see, early television drama often featured a voice over, describing what viewers could.


                      John Allsop
                      A Dao of Web Design (2000)

Liminal Spaces

"What I sense is a real tension between the web as we know it, and the web as it would be. It’s the tension between an existing medium, the printed page, and its child, the web. [...] If you ever get the chance to watch early television drama you’ll find a strong example of this. Because radio required a voice-over to describe what listeners couldn’t see, early television drama often featured a voice over, describing what viewers could.


                      John Allsop
                      A Dao of Web Design (2000)

Liminal Spaces

"What I sense is a real tension between the web as we know it, and the web as it would be. It’s the tension between an existing medium, the printed page, and its child, the web. [...] If you ever get the chance to watch early television drama you’ll find a strong example of this. Because radio required a voice-over to describe what listeners couldn’t see, early television drama often featured a voice over, describing what viewers could.


                      John Allsop
                      A Dao of Web Design (2000)

Liminal Spaces

"What I sense is a real tension between the web as we know it, and the web as it would be. It’s the tension between an existing medium, the printed page, and its child, the web. [...] If you ever get the chance to watch early television drama you’ll find a strong example of this. Because radio required a voice-over to describe what listeners couldn’t see, early television drama often featured a voice over, describing what viewers could.


                      John Allsop
                      A Dao of Web Design (2000)

Liminal Spaces

"What I sense is a real tension between the web as we know it, and the web as it would be. It’s the tension between an existing medium, the printed page, and its child, the web. [...] If you ever get the chance to watch early television drama you’ll find a strong example of this. Because radio required a voice-over to describe what listeners couldn’t see, early television drama often featured a voice over, describing what viewers could.


                      John Allsop
                      A Dao of Web Design (2000)

Teenagers as Liminal

"Well, design is a messed up premise because it was made when there was only wood, metal, glass, and our hands. Whereas the computational world is using alien materials, and in a world of alien materials, the nature of products and design should change. [...] I believe that the old kind of design’s value is not increasing any more—it’s decreasing, because the computational materials are so different than materials of the past. [...] Design is now maturing — expect some awkwardness"

 

John Maeda

How to Speak Machine (2019)

Teenagers as Liminal

"Well, design is a messed up premise because it was made when there was only wood, metal, glass, and our hands. Whereas the computational world is using alien materials, and in a world of alien materials, the nature of products and design should change. [...] I believe that the old kind of design’s value is not increasing any more—it’s decreasing, because the computational materials are so different than materials of the past. [...] Design is now maturing — expect some awkwardness"

 

John Maeda

How to Speak Machine (2019)

Teenagers as Liminal

"Well, design is a messed up premise because it was made when there was only wood, metal, glass, and our hands. Whereas the computational world is using alien materials, and in a world of alien materials, the nature of products and design should change. [...] I believe that the old kind of design’s value is not increasing any more—it’s decreasing, because the computational materials are so different than materials of the past. [...] Design is now maturing — expect some awkwardness"

 

John Maeda

How to Speak Machine (2019)

Teenagers as Liminal

"Well, design is a messed up premise because it was made when there was only wood, metal, glass, and our hands. Whereas the computational world is using alien materials, and in a world of alien materials, the nature of products and design should change. [...] I believe that the old kind of design’s value is not increasing any more—it’s decreasing, because the computational materials are so different than materials of the past. [...] Design is now maturing — expect some awkwardness"

 

John Maeda

How to Speak Machine (2019)

Teenagers as Liminal

"Well, design is a messed up premise because it was made when there was only wood, metal, glass, and our hands. Whereas the computational world is using alien materials, and in a world of alien materials, the nature of products and design should change. [...] I believe that the old kind of design’s value is not increasing any more—it’s decreasing, because the computational materials are so different than materials of the past. [...] Design is now maturing — expect some awkwardness"

 

John Maeda

How to Speak Machine (2019)

Teenagers as Liminal

"Well, design is a messed up premise because it was made when there was only wood, metal, glass, and our hands. Whereas the computational world is using alien materials, and in a world of alien materials, the nature of products and design should change. [...] I believe that the old kind of design’s value is not increasing any more—it’s decreasing, because the computational materials are so different than materials of the past. [...] Design is now maturing — expect some awkwardness"

 

John Maeda

How to Speak Machine (2019)

Teenagers as Liminal

"Well, design is a messed up premise because it was made when there was only wood, metal, glass, and our hands. Whereas the computational world is using alien materials, and in a world of alien materials, the nature of products and design should change. [...] I believe that the old kind of design’s value is not increasing any more—it’s decreasing, because the computational materials are so different than materials of the past. [...] Design is now maturing — expect some awkwardness"

 

John Maeda

How to Speak Machine (2019)

Teenagers as Liminal

"Well, design is a messed up premise because it was made when there was only wood, metal, glass, and our hands. Whereas the computational world is using alien materials, and in a world of alien materials, the nature of products and design should change. [...] I believe that the old kind of design’s value is not increasing any more—it’s decreasing, because the computational materials are so different than materials of the past. [...] Design is now maturing — expect some awkwardness"

 

John Maeda

How to Speak Machine (2019)

We are Here

"The page metaphor has served its purpose helping users familiarize themselves with the web, and provided creators with the necessary transitional language with which to create for a brand new medium. But to build thoughtful interfaces meant to be served to a multitude of connected devices, the time has come for us to evolve beyond the page [...] Right now, our entire industry is drowning in a sea of devices, viewport sizes, and online environments. And things aren’t slowing down anytime soon"


                      Brad Frost
                      Atomic Design (2016) 

We are Here

"The page metaphor has served its purpose helping users familiarize themselves with the web, and provided creators with the necessary transitional language with which to create for a brand new medium. But to build thoughtful interfaces meant to be served to a multitude of connected devices, the time has come for us to evolve beyond the page [...] Right now, our entire industry is drowning in a sea of devices, viewport sizes, and online environments. And things aren’t slowing down anytime soon"


                      Brad Frost
                      Atomic Design (2016) 

We are Here

"The page metaphor has served its purpose helping users familiarize themselves with the web, and provided creators with the necessary transitional language with which to create for a brand new medium. But to build thoughtful interfaces meant to be served to a multitude of connected devices, the time has come for us to evolve beyond the page [...] Right now, our entire industry is drowning in a sea of devices, viewport sizes, and online environments. And things aren’t slowing down anytime soon"


                      Brad Frost
                      Atomic Design (2016) 

We are Here

"The page metaphor has served its purpose helping users familiarize themselves with the web, and provided creators with the necessary transitional language with which to create for a brand new medium. But to build thoughtful interfaces meant to be served to a multitude of connected devices, the time has come for us to evolve beyond the page [...] Right now, our entire industry is drowning in a sea of devices, viewport sizes, and online environments. And things aren’t slowing down anytime soon"


                      Brad Frost
                      Atomic Design (2016) 

We are Here

"The page metaphor has served its purpose helping users familiarize themselves with the web, and provided creators with the necessary transitional language with which to create for a brand new medium. But to build thoughtful interfaces meant to be served to a multitude of connected devices, the time has come for us to evolve beyond the page [...] Right now, our entire industry is drowning in a sea of devices, viewport sizes, and online environments. And things aren’t slowing down anytime soon"


                      Brad Frost
                      Atomic Design (2016) 

We are Here

"The page metaphor has served its purpose helping users familiarize themselves with the web, and provided creators with the necessary transitional language with which to create for a brand new medium. But to build thoughtful interfaces meant to be served to a multitude of connected devices, the time has come for us to evolve beyond the page [...] Right now, our entire industry is drowning in a sea of devices, viewport sizes, and online environments. And things aren’t slowing down anytime soon"


                      Brad Frost
                      Atomic Design (2016) 

We are Here

"The page metaphor has served its purpose helping users familiarize themselves with the web, and provided creators with the necessary transitional language with which to create for a brand new medium. But to build thoughtful interfaces meant to be served to a multitude of connected devices, the time has come for us to evolve beyond the page [...] Right now, our entire industry is drowning in a sea of devices, viewport sizes, and online environments. And things aren’t slowing down anytime soon"


                      Brad Frost
                      Atomic Design (2016) 

Looking to Architecture

"But in recent years, a relatively new design discipline called 'responsive architecture' has been challenging some of the permanence at the heart of the architectural discipline. [...] Rather than creating spaces that influence the behavior of people that pass through them, responsive designers are investigating ways for a piece of architecture and its inhabitants to mutually influence and inform each other"

Ethan Marcotte
Responsive Web Design (2011

Looking to Architecture

"But in recent years, a relatively new design discipline called 'responsive architecture' has been challenging some of the permanence at the heart of the architectural discipline. [...] Rather than creating spaces that influence the behavior of people that pass through them, responsive designers are investigating ways for a piece of architecture and its inhabitants to mutually influence and inform each other"

Ethan Marcotte
Responsive Web Design (2011)

Looking to Architecture

"But in recent years, a relatively new design discipline called 'responsive architecture' has been challenging some of the permanence at the heart of the architectural discipline. [...] Rather than creating spaces that influence the behavior of people that pass through them, responsive designers are investigating ways for a piece of architecture and its inhabitants to mutually influence and inform each other"

Ethan Marcotte
Responsive Web Design (2011)

Looking to Architecture

"But in recent years, a relatively new design discipline called 'responsive architecture' has been challenging some of the permanence at the heart of the architectural discipline. [...] Rather than creating spaces that influence the behavior of people that pass through them, responsive designers are investigating ways for a piece of architecture and its inhabitants to mutually influence and inform each other"

Ethan Marcotte
Responsive Web Design (2011)

Responsive Design

"A flexible layout provides us with a foundation for the future: it allows us to step back from targeting individual resolutions, and better prepare our designs for devices that haven’t even been imagined yet. [...] at its most basic level, responsive design is about serving one HTML document to countless browsers and devices, using flexible layouts and media queries to ensure that design is as portable and accessible as possible."

Ethan Marcotte
Responsive Web Design (2011)

Responsive Design

"A flexible layout provides us with a foundation for the future: it allows us to step back from targeting individual resolutions, and better prepare our designs for devices that haven’t even been imagined yet. [...] at its most basic level, responsive design is about serving one HTML document to countless browsers and devices, using flexible layouts and media queries to ensure that design is as portable and accessible as possible."

Ethan Marcotte
Responsive Web Design (2011)

Responsive Design

"A flexible layout provides us with a foundation for the future: it allows us to step back from targeting individual resolutions, and better prepare our designs for devices that haven’t even been imagined yet. [...] at its most basic level, responsive design is about serving one HTML document to countless browsers and devices, using flexible layouts and media queries to ensure that design is as portable and accessible as possible."

Ethan Marcotte
Responsive Web Design (2011)

Responsive Design

"A flexible layout provides us with a foundation for the future: it allows us to step back from targeting individual resolutions, and better prepare our designs for devices that haven’t even been imagined yet. [...] at its most basic level, responsive design is about serving one HTML document to countless browsers and devices, using flexible layouts and media queries to ensure that design is as portable and accessible as possible."

Ethan Marcotte
Responsive Web Design (2011)

Responsive Design

"A flexible layout provides us with a foundation for the future: it allows us to step back from targeting individual resolutions, and better prepare our designs for devices that haven’t even been imagined yet. [...] at its most basic level, responsive design is about serving one HTML document to countless browsers and devices, using flexible layouts and media queries to ensure that design is as portable and accessible as possible."

Ethan Marcotte
Responsive Web Design (2011)

Responsive Design

"A flexible layout provides us with a foundation for the future: it allows us to step back from targeting individual resolutions, and better prepare our designs for devices that haven’t even been imagined yet. [...] at its most basic level, responsive design is about serving one HTML document to countless browsers and devices, using flexible layouts and media queries to ensure that design is as portable and accessible as possible."

Ethan Marcotte
Responsive Web Design (2011)

When "Killer" is was Cool

"“Killer Web Sites” are usually those which tame the wildness of the web, constraining pages as if they were made of paper – Desktop Publishing for the Web. This conservatism is natural, “closely held beliefs are not easily released,” but it is time to move on, to embrace the web as its own medium. It’s time to throw out the rituals of the printed page, and to engage the medium of the web and its own nature.

John Allsop
A Dao of Web Design (2000)

When "Killer" is was Cool

"Killer Web Sites” are usually those which tame the wildness of the web, constraining pages as if they were made of paper – Desktop Publishing for the Web. This conservatism is natural, “closely held beliefs are not easily released,” but it is time to move on, to embrace the web as its own medium. It’s time to throw out the rituals of the printed page, and to engage the medium of the web and its own nature.

John Allsop
A Dao of Web Design (2000)

When "Killer" is was Cool

"“Killer Web Sites” are usually those which tame the wildness of the web, constraining pages as if they were made of paper – Desktop Publishing for the Web. This conservatism is natural, “closely held beliefs are not easily released,” but it is time to move on, to embrace the web as its own medium. It’s time to throw out the rituals of the printed page, and to engage the medium of the web and its own nature.

John Allsop
A Dao of Web Design (2000)

When "Killer" is was Cool

"“Killer Web Sites” are usually those which tame the wildness of the web, constraining pages as if they were made of paper – Desktop Publishing for the Web. This conservatism is natural, “closely held beliefs are not easily released,” but it is time to move on, to embrace the web as its own medium. It’s time to throw out the rituals of the printed page, and to engage the medium of the web and its own nature.

John Allsop
A Dao of Web Design (2000)

When "Killer" is was Cool

"“Killer Web Sites” are usually those which tame the wildness of the web, constraining pages as if they were made of paper – Desktop Publishing for the Web. This conservatism is natural, “closely held beliefs are not easily released,” but it is time to move on, to embrace the web as its own medium. It’s time to throw out the rituals of the printed page, and to engage the medium of the web and its own nature.

John Allsop
A Dao of Web Design (2000)

When "Killer" is was Cool

"“Killer Web Sites” are usually those which tame the wildness of the web, constraining pages as if they were made of paper – Desktop Publishing for the Web. This conservatism is natural, “closely held beliefs are not easily released,” but it is time to move on, to embrace the web as its own medium. It’s time to throw out the rituals of the printed page, and to engage the medium of the web and its own nature.

John Allsop
A Dao of Web Design (2000)

When "Killer" is was Cool

"“Killer Web Sites” are usually those which tame the wildness of the web, constraining pages as if they were made of paper – Desktop Publishing for the Web. This conservatism is natural, “closely held beliefs are not easily released,” but it is time to move on, to embrace the web as its own medium. It’s time to throw out the rituals of the printed page, and to engage the medium of the web and its own nature.

John Allsop
A Dao of Web Design (2000)

You Decide: Heaven/Hell?

"I believe every material has a grain, including the web. But this assumption flies in the face of our expectations for technology.


                      Frank Chimero
                      The Web's Grain (2015)

You Decide: Heaven/Hell?

"I believe every material has a grain, including the web. But this assumption flies in the face of our expectations for technology.


                      Frank Chimero
                      The Web's Grain (2015)

You Decide: Heaven/Hell?

"I believe every material has a grain, including the web. But this assumption flies in the face of our expectations for technology.


                      Frank Chimero
                      The Web's Grain (2015)

You Decide: Heaven/Hell?

"I believe every material has a grain, including the web. But this assumption flies in the face of our expectations for technology.


                      Frank Chimero
                      The Web's Grain (2015)

Material of Interfaces

By Schalk Venter

Material of Interfaces

Exploring the strangest canvas

  • 553