From Issue N°05: Websites for Sustainable Brands (That Aren’t Boring).
There’s a giant question looming over many a changemaker’s head, and it sounds something like this: how do we get the public to act upon climate change (and social equity)?
Getting the average person interested & participating in your initiative is a tricky problem, and one that can be argued back and forth upon from many different angles. Climate alarm? Optimism? How about not even mentioning climate at all?
What we can generally agree on is that climate movements tend to lack the excitement and cultural impact of consumerist, corporate-driven brands—take, for a recent example, the hot pink Barbie craze that swept across global social media.
Building that level of engagement is an immensely complex (and often high budget) challenge, but as changemakers, we can start with a simple goal—by creating brand experiences that aren’t boring!
For non-profits and community-focused organisations, ‘boring’ can be a particularly common trap when trying to engage the general public, but there’s plenty we can do to ramp up wider interest. Let’s begin with one of the most important touchpoints: the website. Here’s our 9 fave design tricks for engaging & inspiring web experiences that strengthen your impact!
Immersive Visuals
Punchy Colours
A strong, bold application of brand colours tends to be plenty more fun than plain ol’ white. Different coloured sections & pages help to keep visitor attention switched on. With colour psychology, colours have the power to continuously communicate & strengthen the spirit of your organisation—without a single word.
Creative Use of Iconography
Icons are an ultra versatile asset in branding—they can be applied at different scales and patterns to create a delightful and consistent visual language. They can also provide tiny points of visual interest throughout a website to break up text (without imagery).
Full Page Imagery & Video
Transport your visitor to the community you’re building, the vibrant future you’re shaping, or wilderness you’re protecting with high-quality imagery and video that takes up the entire screen. By helping the viewer feel the place, you can build sympathy to your cause. Word of warning: large scale images and videos can generate bigger carbon emissions and loading times on websites. Try compressing the files or being selective.
Snappy Copywriting
Visual Emphasis
Linking copy to visuals—such as a call to action with a matching animation—can really drive your message home. This kind of copy to visual synchrony and storytelling is also just lots of fun for a visitor to scroll through.
Keep It Short!
There’s nothing more boring than a wall of 12pt text. Keep it short, snappy, and cool. Try communicate your message in the most concise word count for the greatest impact.
Brand Voice
Crafting an interesting brand voice and using it across the entire website can give your organisation a strong character that, if done right, can humanise your initiative and speak to the visitor on a relatable level. There’s also creative ways to apply your brand voice to inject humour and delight into the experience.
Dynamic Animations & Depth
Scroll Animations
As the visitor scrolls down the site, they trigger animated elements moving in, changing scale, rotating, etc. Scroll-based animations can create a super fun, effortless experience that compels the visitor to keep scrolling.
Reactive Effects
Similar to scroll animations, when a visitor does something (e.g. hover over an image) the specific element can animate; perhaps the cursor switches colour or the image flashes as a slideshow. These micro surprises encourage the visitor to keep exploring the site.
Parallax & Layering
Give depth and three-dimensionality to the site for a more immersive feel—almost as if the visitor is moving through a space. One way to achieve this is by layering elements; another is the parallax effect on scroll (background image moving at a different speed to the front elements).
