Using Presentation as Design Deliverable

When you deliver designs to stakeholders or to engineering, how would you do it? It must be in the combination of these ways:

  • Sketch files
  • PNG/JPG mockups files
  • Digital prototypes: Invision, Flinto, Framer, Marvel, you name it
  • Videos/GIF files, maybe made using AfterEffects
  • Zeplin link
  • For advanced designers, they might be able to code it using HTML, CSS or directly to XCode or something
  • A dropbox link of some assets

…and then you just send them off to the clients, to your managers, to fellow coworkers.

Then, what would happen after that?

They will come back to you with one of these questions:

  • Can we set up a meeting to discuss this?
  • Hey, I have a question on screen A, B and X
  • Can you do a walkthrough on this with the engineering team?
  • Do you have the assets? (and then you’ll answer like: Hey, I gave you the Zeplin link already!)

First off, I honestly think sending deliverables spread out in multiple platforms can be rude without actually having something to glue them together. It’s even worse when you just send them links to these files, or attach multiple things together in an email and let them be gone with it.

When the manager or client asks you to present the design, you’ll also have trouble because you know presenting Sketch file and switching between prototypes is a pain in the ass, and sometimes embarrassing, too.

There’s one solution to this all. I’ve been doing it for a few weeks and it feels awesome.

Always deliver in one format, linking every relevant file and link inside it: a presentation deck. Yes, you read me right.

A presentation deck. Preferably, a shareable and collaborative one, like Google Slides.

Examples of a design preso I made. You can present simple diagrams like this.

Before you throw me tomatoes, let me elaborate further.

Design is all about communication. You can’t communicate with slapping files together in somebody’s face. Right?

A presentation deck allows you to craft story behind a project. Here are the core benefits of a presentation:

  • Storytelling: It forces you to think in presentation or storyboard mode, where you try to tell a sequence.
  • Relevant & hiqh quality visuals: It forces you to think even more visually, and forces you to give the best visual mockups or designs possible that are relevant.
  • Edge cases: Unlike prototypes, it can explain edge cases, or alternatives to a certain screen. Imagine this situation where you have to present 3 alternatives to a screen in an Invision prototype. You can’t. You just have to explain them, or show them separately in static images. With a presentation, you can put 3 different alternatives and explain them without leading them astray.
Show design progress or edge cases/alternatives
  • Telling concepts: You can actually write beside the screen. In a well-designed format. So you don’t have to explain it the first-time you present it.
  • It’s presentation-ready: Whenever the client and boss asks you to present the ideas, you’ll be more than ready.
Be presentation-ready anytime
  • It’s iteration-friendly: If you use cloud-based presentation, you can change things on the fly anytime anywhere and the updates will be reflected instantly. Boom, you don’t have to send new files everytime!
  • You can link to your files, still: Got Sketch file, static mockups, prototype links, Zeplin link, any other files? Throw them in one of the decks under “Files” or “Appendix”. There, it has instantly become an engineer-friendly document!
  • Integral part of workflow: You can share the presentation link to Slack, JIRA, Pivotal Tracker, Asana, or anything you can imagine. Even calendar invites.
  • Remote-friendly: Even if this deliverable works for local teams, it works even better for remote teams, since your mates can read & study about your designs for a while before actually talking on the video call. Believe me, it saves lots of times.
Showing in phone frames make it feel relevant and realistic, and they know you’re serious

See? There’s tons of benefits to this style of deliverable. It’s easy to do, too.

Just remember to abide by the rule of good presentations:

  • Always tell a story first: Don’t just slap mockups. Try to structure it in a way that tell a story from one slide to another. Keep things simple.
  • Write something useful and on point: Don’t write too much stuff in a slide, keep it well-designed, with bigger types that you can actually read in a room. Use simple languages.
  • Use the best visuals: If you have the best resolution, use it. Use a phone frame to make it look real. Use video mockups to make it look even more real. Link to prototypes elsewhere so your audience can peruse Invision or Flinto prototypes in later times.
  • Tell it like it’s yours: Make it worth your effort. You know you’ll include this deliverable in your portfolio in the future. Be the best you can be.

Love this idea? Give me your claps!