Bringing nature online
If you had to work in a windowless office, what would you add to it to create a better experience for yourself? If you’re like the office workers in one large Norwegian study, you might compensate for not being able to see any nature—light, sky, trees—through a window by dragging in plants or pictures of nature to your workspace. In this study, people in windowless offices were nearly five times more likely to bring in plants and three times more likely to bring in pictures of nature than those in offices with windows.
If there’s no nature around, we bring in our own!
What kind of things can we drag into our nature-less digital environments to create a better experience for ourselves?
If you are reading this, then you’ve probably seen this photo.
It’s “Bliss”, the default Microsoft XP computer wallpaper and likely the most-viewed image of all time.
The story behind this image is pretty fun. The photo was taken by Charles “Chuck” O’Rear, a National Geographic photographer, around 1998. Chuck was driving through California’s wine country on a visit to his then-girlfriend-now-wife, when he spotted an open field among the vineyards. “It was a Friday in January, after a storm, the grass was green, and I thought ‘Oh my god! Look at that scene!’”
Look at that scene, indeed. Chuck pulled over, grabbed his medium-format Mamiya RZ67 camera loaded with Fujifilm Velvia film, an apparently magical combination he credits for producing saturated, sharp, and high-contrast nature images, and got to snapping.
Once he developed the photos from that day, Chuck added the image to a stock photo library that would end up being owned by, who else, but Bill Gates. From this photo library, Microsoft selected Chuck’s photo to serve as the Windows XP wallpaper (side note: apparently another one of Chuck’s photos was supposed to serve as the default but it got scrapped because it looked too much like a butt). After Microsoft paid hundreds of thousands of dollars for the photo, no one would insure it during shipment and Chuck had to fly to Seattle to hand-deliver it to the Microsoft office.
Since then, billions of people have seen this photo.
I don’t think it’s a coincidence that the most-viewed digital image is a not-too-exciting nature scene. And today we’ll talk about why.
We’ll start in the physical world to talk about the two big benefits that access to nature can offer for people’s experience. Then, we’ll cover design strategies borrowed from the physical world that could also bring nature into our digital and online environments.
Benefits of nature access on experience
In previous Minding Design features, we’ve talked about some of the benefits that nature can offer: improved learning in schools (here and here), improved mood, and high-quality neighborhood public spaces.
But let’s quickly cover two general reasons WHY nature improves our experience.
Nature restores attention
Back in the day (I mean back, back, back in the day), things that were interesting were also important. A pack of wolves creeping up: interesting, important.
In the modern world, things that are important may be deeply, deeply uninteresting. Filling in an expense report to get back thousands of dollars you spent out of pocket: uninteresting, important.
But these uninteresting, important things need to get done. Sometimes all day long.
It’s hard to sustain attention on things that don’t naturally draw our attention. And when we need to sustain our attention for a long time, we get fatigued and our performance suffers.
According to what’s called the attention restoration theory, we can replenish our attention with restorative experiences. Restorative experiences are ones during which our attention is drawn effortlessly, but not fully, so that we have a chance to introspect or reflect. This state is also called “soft fascination,” which seems pretty evocative. Nature is full of sources of soft fascination: leaves fluttering in the wind, water shimmering on the surface of a lake, falling snow, a crackling fire. We can let our attention go and engage in these experiences while occasionally thinking about other things or reflecting.
Nature reduces stress
Another, not unrelated, benefit of nature is its effect on stress.
The stress reduction theory proposes that natural environments can reduce the nasty leftovers of stress: physiological arousal (think: fast breathing, high heart rate, high blood pressure) and negative mood.
Natural environments that have positive, calming qualities like complexity, surface texture, an absence of threats, and the presence of resources can reduce our physiological arousal and negative mood, helping us bounce back and recover from stressful events.
As you might guess, the attention restoration and stress reduction theories are complementary. When our attention is overused, we become fatigued and may feel like we can’t face subsequent difficult tasks. And feeling like we don’t have enough resources (time, ability, emotional strength) to face our challenges is a hallmark of stress.
Imagine how you might feel after a cognitively demanding, emotionally draining workday. Now imagine how it would then feel to take a break for an hour by swimming in a lake, wrapping yourself in a robe, and sitting by a fire pit. Ahhh. Stress reduced, attention restored.
Biophilic design has been embraced in physical spaces
While office buildings might not come with lakes, robes, and fire pits to decompress after work (yet!), architects and designers have applied principles derived from nature to improve the built environment. This practice is called biophilic design, and it has been applied to many environments where stress reduction and attention restoration are important, like hospitals, prisons, and schools.
Image source. Biophilic design in hospitals. Khoo Teck Puat Hospital.
Image source. Biophilic design in prisons. Rivergum Residential Treatment Centre.
Image source. Biophilic design in schools. Common Ground High School.
What about digital and online environments?
There are digital and online environments where we need to sustain our attention even though it’s hard to do so or where we experience stress.
A few I can think of—
Collaborative work tools. Now that most knowledge workers are working remotely, a lot of time is spent collaborating using shared tools like Google Docs, Slack, Asana, or Mural. Sustaining attention for hours while working in an internet browser is not easy.
Online learning. What’s harder than doing what you already know how to do? Learning how to do a new thing. With remote learning, students need to pay attention during monotonous days of online classes, online assignments and quizzes, and online discussion groups.
Video calls. Not the fun ones. Important client calls, progress reports, pitches, presentations, and teaching can be difficult and stressful without the non-verbal cues of real-life interaction.
Tedious, boring tasks that need to be done right. Applying for government programs, doing taxes, looking through legal documents, figuring out mortgage or insurance details. These tasks drain our attention because they’re boring and detail oriented.
Experiences that start with frustration and annoyance. Are you on a company’s FAQ, returns, or support page? Then something’s probably not right. Insufficient information, bad UX, a weird edge case. You’re likely annoyed, grumpy, and tired of dealing with this problem.
In these sorts of cases, could applying biophilic design help us restore attention and reduce stress?
Applying biophilic design principles to digital and online environments
To get an answer, I started with two great practical resources on biophilic design in physical spaces – 14 Patterns of Biophilic Design and The Practice of Biophilic Design—and looked for solutions that could also apply to digital and online environments.
Multisensory experience
Ideally, experiences of nature should be multisensory – integrating sight, sound, touch, etc. But given the constraints of the digital world, we have sight and sound. Still, the two can be integrated by using video or matching visual and sound effects. What should images, videos, and sounds be of? I’ll cover that in the themes section below.
The only constant is change
One important note. Nature is not static. Conveying a sense of change through time is important, because static or repetitive experiences don’t hold our attention. Imagine the difference between a predictable sound loop of a bird chirping every eight seconds and real birdsong outdoors.
Some ways to integrate a sense of change:
Non-rhythmic patterns – patterns that can be analyzed statistically but not predicted precisely. An example could be a shimmering visual effect similar to sunlight hitting the surface of water or an ever-changing sound of leaves rustling in the wind.
Changes that follow the course of the day and night. In nature, light, plant and animal activity, and their resulting sounds follow daily patterns. Perhaps colors within websites or apps could change to follow the color of daylight or added visual or sound effects could change to match typical plant and animal activity? I’ve seen a few examples that have applied this principle already like f.lux or dynamic computer wallpapers, but there’s so much more potential for integrating daily changes.
Seasonal changes. In areas further from the equator, we experience changes in light, as well as plant and animal activity throughout the year. This means changes for what we see and hear around us. Did you know that color preferences change throughout the year? Yes! How wild is that? For example, people like dark red, olive, and brown more during the Northern Hemisphere fall. This principle could be applied to online environments by changing colors to match the outdoor environment or picking visual and sound effects from the corresponding season.
Changes that respond to environmental conditions, like changes in local weather. This solar-powered website sometimes goes offline during long cloudy periods, but its state is only tied to the host’s location, not the user’s. The user’s location could be used to pull data about local weather conditions and make changes to tie in with outdoor conditions. For example, imagine looking out the window to see rain while hearing the sound of rain while waiting to join a conference call – pretty relaxing.
Changes that continue through time, AKA aging. This one sounds weird but also interesting. While I’ve seen websites that look old because of dated design choices, broken images, or out-of-date information, I’ve never seen a website that’s designed to obviously age. Could a website develop a “patina” over time the way that copper or cedar shingles do? Could be a first!
Image source. Copper patina.
Themes
Now that we’ve covered the importance of dynamic and ever-changing experience to draw and hold our attention, here are a few themes that pop up again and again as particularly restorative.
Water. River, ocean, pond, fountain, or underwater. It’s especially restorative if the water looks clear and drinkable. Movement could be incorporated through shimmering of light on the water surface, reflections from water on another surface, or dynamic water sounds. What if users saw a peaceful brook while waiting for a customer support rep to respond to their complaint? It might help to de-escalate some conflict.
Image source. Water reflections.
Image source. Water movement.
Light. Sun patches, shadows. Light that changes in color over the day. Effects like sunlight on a billowing fabric moving in the breeze or the shadows cast on walls by trees outside a window.
Video source. Shadows in billowing fabric.
Plants. Diverse plants. They’re especially restorative if some of them are flowering. A breeze moving leaves or grasses. Plants opening up in the morning, or at dusk. Changing plants through the seasons: flowering trees, followed by peonies, followed by tiger lilies and so on from spring to summer.
Not-shocking confession: I love taking videos of relaxing nature and watching them later! Here’s one from Montreal’s Parc Jean-Drapeau.
Animals. Non-threatening ones. Local wildlife. Birdsong and forest sounds. What if students saw a video of cute local critters after submitting an online quiz? That could mean bison and pelicans for Canadian youth in the spring.
Fire. But controlled fire. The light crackling sounds of a small outdoor fire. Or even the color or movement of light and shadow similar to a fire. I’ve seen people play fire videos on shared TVs and monitors in offices. Perhaps it would be easier to focus on a shared collaborative task, like filling in details of an idea in a Google Doc, if you could all “sit” by a fire while you did it.
Weather, seasonal, and planetary changes. Local weather conditions like rain, hail, snow, wind, clouds, fog, thunder. Seasonal patterns like the winter freeze and the spring thaw. Changes in the night sky – the movements of stars, astronomical events, moon cycles, and corresponding tide changes.
Image source. Weather provides good environmental movement in winter.
Finally, aside from these themes, there are a couple of broader ideas to help bring natural elements online.
Natural colors and materials. Colors found in nature, especially in the kind of natural environment the user is familiar with. There could be some allusion to natural materials like wood, stone, clay, grass, cork, wool, cotton, or leather.
Nature-inspired shapes, forms, and patterns. Right angles are rare in nature. Contours of shapes could be more fluid, and textures added for softness. Patterns and numerical arrangements found in nature might add a feeling of order. Some examples: using fractals, the golden ratio, or the Fibonacci sequence to organize elements within a larger system.
Image source. Organic shapes.
Image source. Seems like the National Geographic has heard of the golden ratio.
Returning to Bliss
So, why are default computer wallpapers, like Bliss, so often of nature scenes (see examples from Microsoft and Mac)? Well, we need all the nature we can get in computer world. Bliss has some of the elements we’ve looked at above – a relatable landscape, plants (including some flowers!), evidence of abundant water, as suggested by the bright green grass, and quickly-changing weather: dynamic clouds and a large shadow cast over part of the scene.
In case you’re looking for a new wallpaper of your own (e.g., if you have the decidedly-not-water-abundant Mojave default dune), the archetype of a restorative scene is one where you’re looking down from a vantage point to see bunches of shady trees, flowering plants, non-threatening animals, some indications of human life, and bodies of clean water.
Which sounds suspiciously like this scene from Animal Crossing.
Image source. Animal crossing — a supernormal biophilic intervention?