Presentations & Projection
Nearly all presentaions are, in one way or another, difficult to understand and follow, not because of the speakers, but because of problems with the projected slides.
Some of the problems:
The room is rarely completely dark, so colors and values are diluted by the light in the room - either from overhead lights or through the blinds. The latter is especially bad on a sunny day.
Projectors enlarge the image greatly, so you cannot count on very much detail in the text or images. Most visual subtleties are lost.
Many presentations are developed on a computer screen which is backlit, has a high resolution and good dynamic range - all of which are missing when the slides are projected.
The audience usually sees the screen from very different viewpoints - the rooms are not like a movie theater - narrow and deep - but like a classroom, they are broad and shallow.
The presenters only has the vaguest idea of what is can be seen by the audience because they are often facing them and looking back over their shoulder to see the screen.
How can these problems be addressed?
If possible, all presentations should be previewed in the place where it will done.
Donʼt try to put more information up than can be easily read as projected on the screen and give the audience time enough to read it.
Work with black on white with the text and be careful with font size, line length and word spacing. This can minimize the loss in readability due to light dilution of the slides.
If you use Arial, be sure to use a small amount of letter spacing (.01em) so the r and n don't run together and make an m (then yarn won't look like yam).
Don't use fonts with hairline serifs (common ones are Bodoni, Didot and Walbaum) because the thin serifs disappear when projected.
If photographic images are used, try taking them into Photoshop and increasing the contrast and saturation will make them visually more effective when projected.
Make your presentaion in html and post it to the web. Then it will be easy to scale on the screen and available to anyone who wants to review it later.
Presentations are difficult because there are so many variables which are not in your control – the quality of the projector, the surface it is projected on, the light in the room and the different relationships of the audience to the screen.
Because of those problems, it is best to stick to text or line graphics in black and white, be sure your your presentation can be made large enough to be read, darken the room as much as possible, and don't expect anything but the coarsest information to be communicated by color.
Avoid any presentaion software. Use html. It is easy to prepare, edit and revise, if necessary, on the spot.
An Example
Here is the Bill of Rights as an slide show in html. It is designed to project well and and print well.
It also small in size and accessible and an easy model to follow. Here is a shorten version of the code:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport"content="width=device-width,user-scalable=yes"/>
<link href='http://fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css'>
<style type="text/css">
html{margin:0 auto;max-width:33em}
body{font-family:'droid sans',sans-serif;font-size:17px;margin:0 1em 0 1em}
h1{font-size:140%;font-weight:700;padding:1em 0 0 0}
h2{font-size:125%;font-weight:700; line-height:1.3em; padding:1.5em 0 0 0 }
h3{font-size:115%;font-weight:bold}
h4{font-size:110%;font-weight:bold;padding:2em 0 60em 0}
p{font-size:100%;font-weight:700; line-height:1.5em;}
.dot{color:#fff}
.arrow{font-size:125%;font-weight:700;color:#ddd;text-align:left}
a.arrow:link { color: #ddd; }
a.arrow:visited { color: #ddd; }
a.arrow:hover { color: #666; }
.top{padding:4em 0 0 0}
</style>
<link rel="stylesheet" type="text/css" href="slideprint.css" media="print">
<title>Original Ten Amendments</title>
</head>
<body>
<article>
<h1 id="one">Original Ten Amendments:<br> The Bill of Rights</h1>
<p>Passed by Congress September 25, 1789.<br>
Ratified December 15, 1791.
<h4>
<nav> <a class="arrow" href="#two">▼</a></nav></h4>
<section>
<h2 id="two">Amendment I</h2>
<h3>Freedoms, Petitions, Assembly</h3>
<p>Congress shall make no law respecting an establishment of religion, or prohibiting the free exercise thereof; or abridging the freedom of speech, or of the press, or the right of the people peaceably to assemble, and to petition the Government for a redress of grievances.
</a><h4>
...
</body></html>
This is the print style sheet, which eliminates the spaces between the amendments:
@charset "UTF-8";
body{margin:0 auto;font-size: 12px;} h1{padding:1em 0 0 0} h2{padding:0;margin:0} h3{padding:0;margin:0}
h4{font-size:110%;font-weight:bold;padding:0;margin:0} .dot{margin:0; padding:0}
.arrow{font-size:10%;font-weight:700;color:#fff;
text-align:left} p{font-weight:400; margin:0;padding:0} section{padding:0;padding:0}
Here is a second example of a simple, easy to scale, html based presentation.
And a third example showing the use of different filters on a photograph.
Save the source of any of the three and use it as a model, if you like.