Design can make or break your digital magazine
The role of good digital magazine design is to support the content and visually express the publication’s values, optimized for the digital space.
Can you recall 8 or 9 years ago thinking up the different ways a headline could move across the page, with a roundel bouncing into view 0.3 seconds after?
If so, let's note how much the web has matured and so have we.
Before the lines blurred.
Websites were information only, blogs were simply quick reads and digital magazines were a sexy extension of the print version.
Today, websites are from Wikipedia through to experiential.
Blogs are the sexy influencers that lead big brands, and the digital magazine is a mash up of the three.
The model today is, there is no model!
Most editorialized content online is being packaged as a magazine. The role of design brings order to this dizzying array of content choices and platforms.
Here, design is referred to in the broadest sense: from obvious attributes like colour and type, to nuances that are simply invisible to the average user.
An intuitive UX and elegant animations can evoke the impression of refinement and quality to users subliminally.
The launch pages of mobile apps like EasyJet and Shpock are perfect examples of this.
The model today is, there is no model!
EASYJET
Angled shapes form the dynamic background to the app. This design of overlapping shapes runs throughout the brands VI and can been seen on everything from their posters to their in-flight magazine. With the app, these panels are brought to life as moving shapes that glide into position as the page loads. The simple animation gives meaning to the background design whilst adding excitement before you begin your holiday search.
Overall it subtly enhances the user experience.
SHPOCK
The often dull and cheap look of car boot sales is given a vibrant facelift with the Shpock app. The colour palette and fonts have the energy of a young vibrant clothing brand, instantly repositioning the app as new, urban and cool. Upon launching the app you're greeted with a mix of pastel gradients, a city building or landscape which feels global and inviting. The Shpock logo then zooms towards you, creating drama before revealing the main shopping page. This sequence may only last 2 seconds, but it's these two seconds that create a memorable first impression of the brand.
This is especially important as the TV advertising for this app must have been costly.
What matters most
The truth is, digital magazine content has to compete with all other forms of web content available, blogs in particular.
Like digital magazines, good blogs have a distinct tone and opinion which people trust and engage with. Design helps to differentiate, if the same content were presented side by side it would be the best-designed page that would win.
A good design solution will give the content a sense of time, place and visual identity. This is more important now than ever before, amidst all the online competition.
The most important elements are compelling imagery, clear navigation and a layout that supports the reading experience. Once this is established, you can explore creatively across video, animation etc to add a dash of flair.
A good design solution will give the content a sense of time, place and visual identity. This is more important now than ever before, amidst all the online competition.
The 3 most common design mistakes and how to solve them
There are tons of bad examples. They frustrate readers and hinder the content.
The role of design is a very critical one, especially as analytics are used to measure performance.
Here are a few common mistakes with some possible solutions:
1. Confusing navigation
Unlike websites, digital magazines have sections, which designers tend to simply re-purpose online. This high learnability is confusing, it reduces engagement and can lead to abandonment. This happened occasionally whilst I researched for this article!
When there’s too much choice, people will not bother.
Solution: Use familiar icons and functionality found on popular websites.
They have a more familiar UX to users, making them feel more comfortable whilst navigating. Major company sites like Amazon or FedEx have great navigation and signposting. They manage tons of data that people need to find easily without getting lost, ever.
2. Typography
Legibility is crucial and this is often ignored, especially on mobile.
Magazines have box-outs, slugs, sells but users scan pages in seconds.
Well crafted typeface can really help content engagement.
Solution: Try less typefaces or font families with a larger selection of weights. This can really help overall consistency of the magazine. For smaller screens (say below 720px) you may decide to go up a font weight to compensate. If they're squinting, they're not reading.
3. Lack of identity
The danger in following trends is that everyone looks the same and becomes instantly forgettable. With a flurry of nice templates from companies like Squarespace it’s key to ensure your digital magazine stands out amongst the crowd.
Solution: Define your magazine's USP (unique selling point) if you've not already done so. Weave this USP into your images, or try adding character with some new web fonts.
Once you've nailed this, you'll have a clear visual stance and readers will identify better with you for it.
Iconic magazines like Wallpaper, Vanity Fair and Wired do it so well that you can guess the publication from the image alone.
4 examples of how good design has helped content
There are many other good references that demonstrate design enhancing content.
The four below simply showcase the diversity of approaches. Each one can utilise tips and techniques from the other.
Unlike print, digital magazines are constantly in beta and have to evolve with usability standards and trends of the web!
1. The New Yorker
This credible content is enhanced by the iconic typeface, characterized with playful illustrations in homage to the legendary print magazine.
The logical page structure uses white space very well.
The content mix of lists, bite sized chunks and long columns in staggered positions keep pages interesting as you scroll. I call this "invisible design" as this simplicity enhances the reading experience overall.
2. Top Gear magazine
Cars are innovative, exciting and reflect character. The use of confident fonts, colours and bold imagery directly reflect this in the design. These details make for a compelling reading experience ..
It’s a high energy solution that directly reflects the subject and content.
3. Mazda Zoomzoom
A small publication in comparison, but it's the pagination and rich mix of features that take centre stage here.
Like the quality print version, this magazine has a refined design, immersive images and rich illustrations that resonate "quality" for Mazda's more premium brand positioning.
4. The New Brit (issue 1)
Urban youth culture is gritty, raw and unapologetic. This magazine boasts honest imagery, slick typefaces with a mix of snappy and elegant animations that enhance the reading hierarchy. The result feels credible and refined, making heroes of its subjects.
The role of design may be the saviour!
How dull would it be if every web page were like Wikipedia. Don't get me wrong, I love Wikipedia, but magazines have always been a beacon of social standing.
What you read reflects who you are.
A magazine’s values can resonate on a deeper emotional level.
Brands need differentiation.
People want good reading experiences.
Content alone can only do so much.
The role of design crafts this experience and now an arsenal of digital media tools are available to help.
I believe the opportunity is for digital magazines to balance optimized performance with innovative visual expression of content. The key is using the two in such harmony that it creates distinction, as Mitchell Kapor states: "What is design? It's where you stand with one foot in two worlds - the world of technology and the world of people and human purposes - and you try to bring the two together."