Introduction

While I’ve highlighted best practices and resources on how to pitch your ideas in the past, I thought I’d take some time to share exactly how we prepare for our demos when we’ve been invited to showcase Wufoo at conferences, events and VC boardrooms. We’ve spent a lot of time refining and practicing our workflow for presentations and after doing this a number of times now, I think we have a method that seems to produce results that we’ve been pretty proud of. While the amount of prep work we do probably isn’t for everyone and might be overkill to some of you, hopefully there will be some tips in here that will help you in your own presentations and demos.

HTML Form Builder

For all the examples in this article, I’ll be referring to the prep materials I generated for a 7 minute demo we were asked to do this past summer at the National Society of Collegiate Scholars Convention in Orlando, FL. Because we (the founders) have demoed Wufoo countless times, we had one of our new hires, Tim Sabat, do the presentation to get some experience under his belt. Because this would be his first time with the material and because we’re obsessed about polish, you’ll notice that we leave very little to chance and improvisation.

Getting Started

If we’re presenting something completely new, we’ll start about a week before the presentation. If it’s something I’ve presented before and I have the slides and prep work already done, then I can probably get away with looking at stuff a day or two before. Either way, I’m probably going to be working and tweaking the slides all the way up until the moment before it’s time to go on stage. Because I wanted to try a new script (Wufoo had a lot of upgrades since the last time we demoed it) and Tim was new to this, I treated this presentation as if I were creating it from scratch.

We like to start every presentation with a rough outline. In fact, I pretty much start every thing I ever write with an outline and it’s one of the most common recommendations I have for people that have trouble with rambling and organization. It seems obvious, but you’d be surprised at the number of people that try to wing these things. Outlines keep us focused and help us make sure we hit the points that we need to cover like who we are, what we do, who uses us and the major features we want to highlight in the app. Here’s the outline I developed for our NSCS demo.

Introduction- Particletree
- Treehouse
- WufooWhat is Wufoo?
- online form builder
- help people collect information over web
- Infopath but friendlieretc.

The Transcript

If the time allotted for the demo is under 15 minutes, which this was, then I basically take that outline and write out a full transcript—a word for word articulation of what would be said during the presentation. Not going to lie, it’s a lot of work to do this, but it’s definitely worth it. During a 6-8 minute demo, there isn’t any time to waste on finding your words. We believe a good short demo is like a good short story—it’s carefully crafted. Even with material that feels like I should be very familiar and intimate with it (like talking about a startup and application I created from the ground up), I feel much more comfortable knowing that if I have a brain fart on stage, there’s a safety net for me to read from. Here’s a copy of the final transcript I made for Tim for our NSCS demo.

Wufoo Demo Transcript

The first version of this transcript is written as fast as possible since I know that it’ll go through lots of revisions when we start timing it and whittling it down. After the first draft is done, I’ll do a time check. Basically, I time how long it takes to read the introduction, how long it takes to read the demo and how long it takes to read the closing. I’m careful to make sure I’m reading slowly but clearly (I actually have a problem with speaking too fast when I’m confident), which is probably the most important part of this process. For me, I know I’m reading at the right pace when it starts to feel a little uncomfortable. Timing and reading out loud will let you know where there’s flow problems and also what needs to be cut or made more succinct.

For this presentation we aimed for about 2:45 in the introduction, 2 minutes for the demo and then about 2 minutes for the closing. Now, when we first launched Wufoo, we didn’t have any of the information on traction and usage and so during those presentations, our intro was obviously shorter and our demo time was then extended to show more features. One thing we’ve learned about demoing features is that it’s impossible to show everything. Even if I took the entire 7 minutes, I couldn’t show all the things possible with Wufoo and so it was important for us to hit the highlights and then compromise by just showing screenshots of other major features to wet an audience’s appetite and imagination for more.

After I was happy with what I came up with, I sent a copy off to Tim so he can look over it and let me know what phrasings didn’t sound like him or felt uncomfortable rolling off his tongue. I’ll also have him do a time check since he’ll actually be presenting. When that’s done, I’ll leave him to practice while I work on the slides.

The Slides

I do all of our presentation work in Keynote. We’re all on Macs and so it’s very convenient. And while I do love the way everything looks on it, I’m pretty sure I could be just as effective with the latest version of Powerpoint. Here’s a copy of the slides from the NSCS Demo.

The nice thing about making slides from a transcript is that it’s much more efficient. When I’ve made presentations based on just an outline in the past, I would usually waste a lot of time making a bunch of pretty slides that ended up being cut out of the final presentation after going through a few rehearsals and timings. In regards to actually designing it, there are so many ways to effectively illustrate a presentation. Since we’ve covered this in past articles, I’ll just share some of the things I like to do when I design one:

  • As you can see from the slide overview above, I like to use a lot of bright colors, images and screenshots. I prefer to illustrate rather than explain.

  • When showing a web site, I’ll cover a screenshot of the site with the url in large text so it’s easy to read even in the back of the room.

  • When I purposely want the audience to feel overwhelmed, I’ll show lots of text or images on a single slide. Otherwise, it’s never more than a short sentence, if that.

  • Duplicate the first slide. A tip I got from Tim. This way you can leave it up on a screen without my notes showing or the timer starting.

  • Try to use humor when possible. Sparingly and tastefully, of course.

  • Add any slides at the end that will easily answer some of the most commonly asked questions (this is why pricing page is added after the Thanks! slide).

Additionally, I try to avoid using any transitions or animations in my presentation. I know some of them can be really slick, but in a demo with strict time limits, not only do I fee like I don’t have any time to waste, but I also don’t want the audience distracted by eye candy that makes them wonder about the software powering the presentation over what’s actually being said.

Using Notes

In Keynote (and I’m pretty sure in Powerpoint as well), you can add notes to each slide that will only display on your laptop when showing slides through a secondary display. Honestly, I think this notes feature is one of the most under-appreciated features in presentation applications. Ever since I’ve started using them, I’ve never gotten lost again or wondered why a certain slide was showing in the middle of a presentation. And so after the slides are done, I’ll start to copy and paste the appropriate sections in the transcript into the notes for each slide. Here’s a copy of the slides with the transcript inserted as notes.

slidetextformat2

One thing that you’ll notice in the slides with notes is that certain sentences or phrases are copied across multiple slides and formatted with odd line breaks. The duplication is done so that if a sentence is illustrated by multiple slides, the rhythm of a sentence won’t be disturbed during the slide changes. Each new paragraph represents when the presenter should proceed to the next slide.

In Keynote, I’m not a fan of the default layout for showing notes. Thankfully, you can change these settings under Preferences -> Presenter Display -> Edit Presenter Layout…

keynotepreferences2

Obviously, you should experiment and find the layout that works best for you, but I like to maximize the amount of notes I can see and so the presenter layouts for my keynotes are set up like this:

keynoteslidesetup

Pre-Recorded Screencast

There are a number of studies out there that show that mult-tasking is a myth. Our brains aren’t meant to do it. It should therefore be no surprise that driving your application and talking about it articulately at the same time is a really hard thing to do well—especially, when you’re under pressure to do so in a narrow range of time. During practices, we’d notice that when we tried this, it was never smooth. There would be awkward gaps of silence whenever any thought processing needed to be done to show off a feature and, for some reason, the ability to type always seemed to escape the person when they were talking at the same time. That’s when we made our demos a two man operation.

Kevin and Chris at Under the Radar by Brian Solis

One person would drive the application and the other person would do a running commentary of what was happening on the screen. This worked out alright, but it also had its issues. For example, there would be this awkward transition where you have to wait to pull out of the program and then open a browser to start the demo part. Because of this, you couldn’t fall back on your notes inside the presentation software, which means you have to effectively completely memorize this part of the sequence along with your driver.

You could bring two laptops, but most displays at conferences aren’t prepared for this setup and you end up with an even more awkward transition that has the potential for a dreaded AV malfunction. Additionally, this also added two additional variables to your presentation: another person and another piece of software. In addition to having to pay for two people to do every demo, you and your driver both have to be in sync and your application just has to work. Even though we would run everything off a development localhost on our laptop so we wouldn’t have to rely on an Internet connection, it always made us nervous. And so after a few presentations run like this, we decided that it would be better to just pre-record the demo as a screencast. Here’s a copy of the movie used in the NSCS demo.

Using a screencast solved the awkward transition problem, allowed us to still utilize notes, eliminate the variables of another person and software and made sure that we would not go over on time for that part of the demo. Keynote makes it very easy to insert movies into presentations. Just drag the movie into a blank slide and it’ll work pretty much like you expect. The only problem I have with it in Keynote is that the movie only plays on the secondary display and not in the presenter layout view and so you have to make sure you’re looking on the screen behind you so that you start speaking at the same time. But when it’s done right, it’s a pretty smooth experience.

The down side, of course, is that you have to do a lot more work ahead of time in prep. For the NSCS demo, I had Tim read off the demo portion of the script while I recorded myself doing the screencast with Snapz Pro X without the sound. It took us about 10 takes to get it just right and in the time span that we wanted.

Keynote Display Preferences

And that’s pretty much how we do it. After all the prep work is done, it’s pretty much up to the presenter to practice it enough for a smooth delivery and to memorize enough of the material so that they don’t have to rely on the script. Before I leave you to make and modify your own demos, I’d like to quickly share with you one last tip. Make sure you set up your presentation display settings ahead of time if you’re using Keynote. Here’s our settings:

keynotepreferences

Basically, have it set up to Present on secondary display and then definitely check your Display Preferences to make sure Show displays in menu bar is checked off so you can easily make adjustments on the spot. When you’re plugged into the secondary display, then you’ll want to make sure your Mac is not mirroring the primary display (done in display preferences). If that’s done right, your presenter notes will show properly on your laptop and keep you from looking like a spaz when the projector isn’t doing what you expected. Alright, good luck and happy demoing!

HTML Form Builder
Kevin Hale

How We Prepare a Demo by Kevin Hale

This entry was posted 2 years ago and was filed under Features.
Comments are currently closed.

· 33 Comments! ·

  1. Phil Crosby · 2 years ago

    Helpful, thanks Kevin.

  2. Kr0n · 2 years ago

    Great article! Thanks a lot

  3. Jason · 2 years ago

    Thanks for the tips, very helpful

  4. Tony Summerville · 2 years ago

    When I have a lot of notes for a particular slide but want to keep the text big in the presenter display, I will duplicate the slide (several times in some cases), then split the notes over the identical slides. A simple click of the remote and I can see the next set of notes, but the audience can’t tell that I’ve changed slides.

  5. babul · 2 years ago

    Great stuff, thanks for the article, finding it very useful in preparing my pitch.

  6. Tim Sabat · 2 years ago

    Kevin did a terrific job of breaking down the the workflow and did touch on the need to practice your demo. I’d just like to hammer that point home. I bored my wife to death reading it to her (thanks Cam), I read it to the cat, my neighbor and most importantly, I read the presentation aloud to myself over and over, using the slides each time. I can’t stress this point enough.

    One final point… Be aware of which monitor is set as your primary before you get to the event. For example, I use a secondary monitor attached to my laptop at home, but I set it as the primary screen. If you don’t fix this, you can inadvertently give those there for the pre-show a peek at your notes. A good magician does not reveal how he does his tricks!

  7. Abdulkadir Topal · 2 years ago

    The keypoint here is practising. Some tutorials suggest writing down just a few words so you can remember what to touch on, but that’s BS. When you are presenting in front of a crowd and have to resort to your notes, those words will mean nothing to you. And even if they do, you’ll have to come up with meaningfull and well crafted sentences with the right intonation and speed alltogether in some of the most stressful situations in your life.

    Therefore it’s really important to know the whole presentation by heart. The side effect is, that you’ll feel so much more condifdent and can infact deviate from the text because you allways now that you have your saftey net to fall back to.

  8. Dr Grammar · 2 years ago

    “One person would drive the application and the other person would do a running commentary of what was happening on the screen. This worked out alright, but it also had it’s issues.”

    It’s = It is or It has

    for more info see: http://www.angryflower.com/itsits.gif

  9. Kevin Hale · 2 years ago

    Ah. Thanks for the catch, Dr. Grammar.

  10. Gustav von Sydow · 2 years ago

    I usually write down plenty of loose ideas in the beginning. Then I write an outline and attach the loose ideas to the proper item in the outline. Then I write my script. Then I practice and iterate like crazy ;)

    Your slides look wonderful by the way.

  11. Myles Weissleder · 2 years ago

    You guys are my favorites.

    When can we expect you to demo Wufoo @ SF New Tech?

    :)

  12. Torley · 2 years ago

    I love Wufoo, and this just adds to my big bag o’ lovin’!

    Wonderful, elegant insights — thanx for sharing!

  13. Rod Begbie · 2 years ago

    Great stuff. I’ve always been surprised that more people don’t use screencasts when demoing software, thus avoiding the GAZILLION things that Sod’s Law will ensure go wrong.

  14. Lenen BKR · 2 years ago

    Wonderful insights indeed, keep it up!

    Regards, BKR

  15. Michael Galpert · 2 years ago

    great job recounting your process and providing lots of helpful tips

  16. Gary D · 2 years ago

    Thank you, This was awesome and very helpful, rockstar work.

  17. Alexandre Silva Hostert · 2 years ago

    Everyone needs a hug. Yes, I agree.

    I love your wp template!

    “Particletree Code Preface

    Feel free to look. Feel free to dig. Feel free to touch. Ask us, though, if you’re going to take. We are generous souls.”

    Did you borrow a copy to me? :)

  18. Ali Reid · 2 years ago

    This is excellent. I shall take a lot of this great advice on board!

  19. fwefewfewf · 2 years ago

    Everyone needs a hug. so they do

  20. Definite Web Hosting · 2 years ago

    Nice article man, thanks. Keep well.

  21. invest in china · 2 years ago

    you guys are amazing! Well done!!!

  22. logotasarimcim · 2 years ago

    nice work.

  23. logotasarimcim · 2 years ago

    Did you borrow a copy to Alexandre? :)

  24. webdesign etten-leur · 2 years ago

    Great job, well done!

  25. Christopher Roberts · 2 years ago

    Cool article. Keep up the good work.

  26. Discus Group · 2 years ago

    Everyone needs a hug. - I agree! LOL

  27. Nathaniel · 2 years ago

    Thanks for the tips, info and generaly a good site.

  28. Manduca · 2 years ago

    Hi Kevin, thanks a lot for the great article, it was very helpful for me to shoot the demo building troubles…Hugs from germany Sue

  29. tanden bleken · 2 years ago

    Thanks mate. Love your post!

  30. train amsterdam · 2 years ago

    A good article indeed!

  31. wat is beleggen · 2 years ago

    I am not so possitive because i think there are some faults in the final transcript.

  32. Sudeep Tamrakar · 2 years ago

    Everyone needs a hug.

  33. Benjamin Wiederkehr · 2 years ago

    Very nice and comprehensive write up. There are a lot of superb articles about how to present something right, but they most of the time cover the behavior, tone, language etc. and to read more about other people’s technics is very exciting.

    Thanks, Benjamin