It's just a draft

When quickly putting a draft presentation together, it is tempting to not spend any effort at all on design and layout. “We can always fix that later”.

I would argue the opposite. Make the draft look as good as the final product will be. It sets the entire mood for the project. Looking at messy / ugly charts is not a big motivation to do great work. Messy / ugly charts encourage people to add bullet point and too much text, because you can always remove it later.

The good news is that a simple chart with simple content does not take a lot of effort to design properly. Fix proportions, alignment and colors and everything looks great in a few clicks.

(Pro-tip: use SlideMagic for your draft documents)

Parking allowed?

Tel Aviv is trying to improve the clarity of their parking signs, who can park when. The sign below is the new format. (If you do not read Hebrew, you will get tickets…)

I would have gone for a much simpler shape that would make the table easier to read. Here is a sketch (obviously not a final design)

Put all the details (hours of day and night, etc.) in a dense footnote at the bottom. Once you have read the footnote once, you can just glance at the shape anywhere in the city and now what you are up to.

My guess is that the detailed table with explicit instructions was selected to make it easer to deal with law suits of people disputing their tickets.

Design culture

It is tricky to get a big company all aligned behind one consistent approach to design. Twitter is going through a lot changes: changes in strategy, changes in people, etc. You can see it in inconsistencies in the web site. Colors, language, layout, icons,, other design elements, etc..

How do people glance over a corporate web site?

There is a lot of science and analytics available for eCommerce web sites. Changes in layout, design, and content immediately translate into changes in clicks and sales. The story is a bit different for a corporate web site that is not transactional, it does not sell anything, it does not have a big signup button, but plays the role of a digital business card for a company. Let’s say the first web site of a startup aimed at investors and the first enterprise customers.

Some things to look at:

• The most important aspect is probably the look and feel of the site, regardless of the content. Does it look professional and serious (as in of a serious company). If that funky or complex graphic somehow does not look quite right and you can’t put your finger on the spot why, take it out. A professional looking simple graphic is always better than a botched attempt at a complex one. Make sure that copyright year is the current one.

• This seems obvious, but is often lacking, the site should actually state what it is you do. Try it on people that have no background at all in the market you work in, try it on people that love to put you in well known boxes (i.e., venture capitalists)

• Different companies need to emphasize different things. For most companies, the founding team and its head shots will be buried in some ‘about’ section of the web site, for very early stage startups, it might need to feature prominently on the first page since it is basically the only asset it has.

• No one reads a web site top to bottom like a newspaper article. Instead, people glance. Read a headline, look a the small text below a photo, read a random paragraph. Don’t arrange content in order of importance solely, but think about the visual hierarchy. A small picture might grab more attention than the big cliche headline.

• It is tempting to lift stories from presentations and translate them to the web site. The founding story of how it all began to where you are now including that big pivot in 2020, the market gap analysis that is the start of your investor pitch deck. These stories need a place, but maybe not on the home page of your web page.

• Avoid jargon. “Ah, this site is filled with blah blah” and people will stop reading. But do include language that is common in the industry you are working in.

• Make sure that the site has the details that should be there: contact details, etc.

Car dashboards

I grabbed this screenshot of the evolution of dashboard design in Mercedes cars (can’t find the source anymore). I think the fake “analogue” looking displays do not look good at all in modern cars. On top of that, information that you don’t always need is screaming at you. combined with shiny interior materials and LED lighting makes the whole cabin look cheap. It does not look good today, for but will for sure age pretty poorly.

(The first one though would look a lot better without the wooden background though).

Perceived quality

The real quality of a car is expressed in how little time it spends in the repair shop. You are unlikely to be able to figure this out in the showroom, or in a test drive. Problems will only show up after a few months of driving.

The perceived quality of a car is a different story. The sound of a door closing, little rattles. They might have nothing to do with the actual quality of the car, but have a huge impact on how we perceive things.

Car manufacturers spend a lot of time and money on ironing out this little imperfections. Testing, testing, and testing at different speeds, different surfaces. As soon as the tiniest noise is heard, take out the statoscope (the passenger tester), locate the sound source and fix things. (A heavier material, some padding, a different screw).

There is a parallel here for your slide deck. The actual quality of the raw story, and the perceived quality of its presentation.

Should the fonts of your logo and presentation match?

No.

Now that mobile devices are becoming the dominant screen on which we look at brands, more and more logos become text-based. The font is the key design aspect of the logo. To set your whole presentation in a funky font would not make sense.

Having said that, the fonts of your presentation and the logo are very close, but just a bit different, a design nerd might find it bothersome. (Arial - Helvetica for example). This would only be an issue for big, bold headlines. Though.

Some brands do force the match between logo font and text font. Think of the ads produced by the Absolut Vodka brand. Slogans and headlines are in Extra Bold Futura Condensed all caps and it matches the brand exactly.

Black flags

Many visual identities use a dark or even black background. It looks great on web sites, or presentation slides, or print ads, even billboards. One place where it does not work: flags. Flags should be happy and/or vibrant. A row of black ones looks depressing and even scary.

If your identity does not have any happy colours: go for black on white which should work fine.

A sense of space

Consistency between slides is important in your presentation. There are the obvious elements that need to be consistent: fonts, layout, colours, etc. But also pay attention to more subtle ones in images. Color vs B&W, and the style of images. Peaceful landscapes, busy ‘real’ images, threatening thunder clouds, stylised super stock photo model images, “funny” face expressions, etc. etc.

Modern movies are a good analogy. In the good old days, movies would be filmed on an actual location. The story is set in a city, village, a house, a place where characters roam around and visit places from multiple angles all the time. Bit by bit, you start to understand the space in which the story is et.

New technology allows you to create pretty much any movie background you want, projected behind actors saying their lines in front of green screens. The result is that that sense of place is lost. The movie is set against a series of random backgrounds that do not seem connected. High resolution screens emphasize the disconnect between characters in the foreground, and the backgrounds. Something does not seem right…

Interestingly, I do not find this effect with classic cartoons, with totally artificial backgrounds, but the whole story seems cohesive

Furniture ads

Why does furniture always look great in ads? The beautiful castle or villa as its backdrop is only a small reason. The big visual trick is space: lots of it, not only square meters, but also very high ceilings.

Most houses and apartments are designed functionally, rooms with just enough space to put a sofa and chairs against the wall to sit a normal sized family with a few guests. If there is more floor space available, we tend to add rooms rather than giving the furniture more space to breathe.

The same is true for museums. Huge open spaces with big white, clutter-free walls. Paintings are made to look good in museums. Put that masterpiece (or a copy) on your kitchen wall, and it looks less impressive.

When making presentations, you are not constrained by white space, so add it freely.

Changing the color of the French flag

President Macron of France changed the blue color of the French flag. He made the blue darker again, after it was set to be the same blue as that of the European Union flag back in the 1970s. (Then president Giscard d’Estaing thought the different shades of blue clashed during photo ops).

I agree with Macron, the darker blue looks better, flags have a history, and i don’t think the two shades of blue clash at all. When doing design work, pay attention to flags. They have very specific colors (like logos), and very specific aspect ratios.

Organized randomness

This is a tricky thing to do: create a layout of seemingly random elements that look good together. I need to deal with this now for the new venture I am setting up

It is a process of constant iteration. Put one type of elements, put another. Add text and titles. They shift the weight of the page, so everything has to move around again, different screen aspect ratio, another shuffle. Repeat, repeat.

Subconsciously, your brain is scanning for anomalies in the unwritten rules of a layout. You don’t know what they are, but you see it when you break them. For example, including one angle in the path above that is “sharp” (i.e., smaller than 90 degrees, would stand out.

Architects have to deal with this a lot, or painters laying out the “random” elements of a still life painting.

In the end, we are all artists.

Messaging group avatars

“Upload a profile picture” is the question you often face when creating a new messaging group for an upcoming event, a school parent group, etc. Most people go for a relevant picture, for example the class group photo of last year’s end of school year party.

But avatars are tiny and often have a circle shape. What jumps out most to the user is the dominant color of the image. So the best solution for avatars for these temporary messaging groups is a big bright colorful square (will be come a circle after uploading) with a big bold letter or number. “52” on green for the birthday party, 2 on purple for the 2nd grade parent group. Easy and effective.

(Pro-tip: use SlideMagic to create your avatar…)

Prototype design

I am currently working flat out on a new business that my wife and I are putting together in the field of healthcare. With a bit of luck, we can take the covers of at the JP Morgan Healthcare conference in San Francisco next January. (Hopefully after that I can boost the SlideMagic product more, I have a few interesting ideas).

I am becoming better and better at designing web front ends, fusing what I am learning about HTML, CSS, and JavaScript, with what was already in my head when it comes to slide, spreadsheet, and data dashboard design.

I am surprised of the impact the look & feel of a prototype makes on early users. Investing in design can take a lot of time, and can be wasted when you are taking your product into an entirely new direction.

My approach is similar to presentation design. Focus on easy wins that make your product look professional and organised, and skip the “marketing design” for the moment.

• Minimal effort on the public facing web site

• No investment in “flashy” animations, videos, and other spectacular effects

• Instead get the little details right that make a big impact, and fixing them does not take a lot of time:

  • Layouts of screens

  • Lining things up

  • Colour contrasts

  • Font size and emphasis

  • Rounding of numbers

  • Etc., etc.

Having a prototype that looks good makes it also a lot more fun to work on.

The right proportions in design

Certain layouts and compositions look right, others seem wrong. We can see it, but we can’t point our finger to exactly why.

This formula for the constant pi got my attention:

From John Wallis, 1656 pic.twitter.com/VXqTWGeLkO

— Fermat's Library (@fermatslibrary) August 28, 2021

It is the so called Wallis product, a beautifully simple representation of a number that seems very random, the first 50 digits of pi are 3.14159265358979323846264338327950288419716939937510..…

Pi governs the shapes of rounded shapes, , waves and much more. The elegance of a circle is simple. But it is governed by a complex set of harmonics and ratios that all relate to each other. Beautiful designs have them, beautiful music has them. In most cases, we only appreciate the end result without grasping the underlying logic.

Picking a useful accent colour

SlideMagic uses a simple colour scheme: (just) one distinct accent colour and lots of shades of white/grey/black.

What are good accent colours?

• One that stands out

• (This is the tricky bit):

  • One with good contrast with white

  • One with good contrast with black

• One that fits with your brand and/or industry, or the opposite one that really sets you apart from everyone else in your industry if that is what you want to do.

• One that you like

People often forget about number 2, which cuts off a lot of creative possibilities with your design

Photo by Daniele Levis Pelusi on Unsplash

Using brands in presentations

It is usually hard to find good images of products made by well known brands that are of high quality, not obstructed by advertising copy and free of copyrights. Free photo site Unsplash is trying to change that by building up a revenue model where photographers post (and get paid for) posting images with brands in it. (Curated for quality by Unsplash and endorsed by the brand in question).

This is very useful for presentation designers. Looking for a nice Harley-Davidson motorcycle? Here you go.

I agree with Unsplash’s observation that advertising has deteriorated in quality over the years.

But on their own web site, they can do a bit better with ads for their new shareholder/investor….

Photo by Harley-Davidson on Unsplash

Will the designer change your text?

When I started making pitch decks 15 years ago, there were not many people who called themselves “presentation designer”. Now the world is flooded with them. But “designer” is a very broad term used by people with varying skills.

Most “before and after” examples on designer’s web pages are beautiful makeovers of slides. Better fonts, better colours, a nice image. It all looks a lot better. But makeovers are makeovers: the fundamental layout of the slide almost always stays the same, and the text always stays the same.

Maybe this is the question you should ask a potential presentation designer: do you rip up the slide, change the headlines, round up numbers, regroup boxes (these 4 points are actually 3), etc.

The text changer is a very different designer from the makeover artist. And very often the text changer might not be very good at design. (The SlideMagic bespoke design pitch was the unusual combination of skills in one pair of hands).

There are different types of designers, but there are also different type of projects, and different types of clients. I had clients who were not that happy that the first draft of their redesigned pitch deck had almost no resemblance to the original.

The SlideMagic presentation software is designed to reduce the dependence on a makeover designer. The average corporate presentation creator can focus on structuring her story, putting the right messages in, and slides will look pretty decent without the need for a drastic cosmetic overhaul.

But, if you are looking for “presentation designer”: know what type of client you are, know what type of project you have, know what type of designer you need.

Photo by Hannah Lim on Unsplash

Pick your battles

Professional designers can do it all:

1. Give slides a professional look

2. Come up with innovative visualisation concepts that make messages stand out

3. Use advanced software features to craft technically complex slides

The amateur designer is in a different position and needs to pick her battles. That amazing visual concept of the elephant riding a convertible car does not really work if it does not look picture perfect. That very clever consulting diagram does not really contribute when it actually does not support your message.

You do not need to be a graphics designer to ensure number 1, a decent professional look of your slides. Simple designs can look great (look at Swiss graphic design for example).

When in doubt, drop ambitions on point 2, and 3, and but never compromise on 1. (And this is exactly what SlideMagic is trying to do).

Chart make-over: UK vaccine priorities

I took on the challenge from this tweet:

Admittedly a tricky challenge to visualise 9 bullet points when they're all very similar but is there a better #design?https://t.co/3romtz5hSJ pic.twitter.com/ElK7J3ajfO

— Jamie Garroch (@JamieGarroch) January 2, 2021

The embedded tweet is obscuring the image, here is the original taken from the BBC:

I think these icons are very cute, but are very hard to understand. I quickly put the following together in SlideMagic.

In the philosophy of SlideMagic, not the design of a pro, but very clear and very quick to put together. Notice how I kept things simple, by including the theoretical 0-16 years in nursing home residents, there won’t by any but the big horizontal bar shows the message “everyone” and maintains the visual harmony.

I have added this vaccin priority slide to the SlideMagic template database. You can access this slide for free by simply searching for “vaccine” from within the SlideMagic desktop app.