Making extensive product presentations look elegant
Product presentation is a subtle art, requiring a delicate balance of images and information. They can also quickly get out of hand, sprawling over one hundred slides rather easily.
Product presentation is a subtle art, requiring a delicate balance of images and information. They can also quickly get out of hand, sprawling over one hundred slides rather easily. Readymag editorial team asked Bohdan Broviy, a creative director at Edsson Software and a web design tutor at Kyiv-based Meat Studies, how to master this tricky task.
Put your decisions on display, but explain them
I work at Edsson Software, an outsource IT company. This position requires me to create very long presentations.
Typically I use presentations to show customers a finished design concept, be it a webpage, mobile app, or logo. Another frequent case is the presale — a stage of negotiations where we demonstrate we’re ready to resolve the customer’s problem prior to signing a deal.
The key principle is not to just show off the design, but to explain how we reached our result. Customers should feel that you fully understand their issue. If you present only the final picture they can always say “I don’t like it. The deal is over.” But if you explain your reasoning, you create the possibility for sustaining a discussion.
I have a rule of thumb regarding the number of slides: you’ll need at least five, with explanations for every design element. If the system is extra complex — say, if your task is to redesign a company’s entire website, or create an app from scratch — the presentation likely requires 100–150 slides, or even more.
Presentation and prototype is a match made in heaven
When designers encounter a job like this for the first time, they usually become disappointed: “Why don’t we get rid of these presentations altogether?” or “Let’s just give the customers the Sketch files, and they’ll learn all they need.”
But after a while designers usually realize the situation is better than it seems. A presentation allows for some important opportunities — the main one, in my opinion, being the chance to tell a consequential story. You can plan in advance when and where your customers will encounter new design elements, what they need to know by that time, and how they might react.
For instance: say we show our customers an app logo. We explain the story behind our choice of color and fonts. Then, in the same presentation, the customers can click on the logo and view the first screen of the app. The graphic design, the explanation of your decisions, and the UX presentation, all in one.
This mockup looks static, but in fact, you can click on it to see the prototype of the app in use. Combining presentation and prototype helps you display the design quicker and more efficiently. A prototype is better than a hundred words of text.
Also, sudden interactivity might be the feature that makes your clients remember you — or, at the end of the day, make a deal with you. Even if the design doesn’t exactly match the customer’s desire, they’ll see how good you are. And when you get closer to presale this might be your most important advantage. Nobody expects the first version to be perfect.
The presentation should be transferable
It’s also important to note that with Readymag it’s very easy to transfer projects to customers and colleagues.
Before, we had to send files via email or file sharing services, which isn’t the best way of doing things: requiring clients to register with a third-party service, having a third-party service menu potentially interfere with your menu, etc. Readymag helps solve all these problems.
Another useful feature is password protection. A client sees that no one else can possibly access their prototype. It’s better for your reputation, and your client’s.
The custom domain feature also helps a lot. If your domain name is chosen wisely, it will help sell your design long after the presentation itself. Even a month or two afterward a prospective customer can remember the web address and access the prototype. It gives them the chance to consider your proposal longer — and possibly decide to choose your company for the job.
Also, you’ll always have easy access to your projects. You won’t need to look for a link: you can just remember it.
Now for something more hands-on.
Layout and animation are deeply interconnected
I usually make horizontal presentations. It’s a really simple method to give you full control over the customer’s attention. With vertical layouts, it’s less clear: the movements are smooth but more difficult to predict.
On Load or On Hover animations can also cause problems if the widget you’re animating is too short: users stay there for only a brief moment, and the video won’t play properly.
On the other hand, sometimes I use vertical layouts to utilize particular animation techniques. Here’s an example.
What you see here is a logo presentation. It was intended to show the prospective customer how our logo idea was fashioned as a combination of the letters of their company name. That’s why we needed to give them an opportunity to scroll back and forth at their own pace. On Scroll animation is ideal for a task like this.
Useful little features
Here are some additional tips that could help you make the best of Readymag when creating product presentations:
- I use stock photos a lot. Sometimes you just need a generic landscape, and the ability to find and incorporate a stock photo straight from the editor really saves time.
- Another important technique is video embedding. It’s very useful in making a background more engaging.
- It’s important to remember that Vimeo and Youtube are different in this respect. Youtube uploads a lower quality video really quickly, then it gradually improves. Vimeo, on the other hand, doesn’t offer an opportunity to play the video until it uploads the best quality version. So if you embed Vimeo your user might be shown an empty screen for a while. And if you embed Youtube your user might see a lower quality video until it finishes processing.
- I use templates constantly. I have a cover slide template, a ‘last slide’ template, and a full-of-content slide template. It saves a lot of time.
- It’s also wise to realize that clicker is fully compatible with Readymag since it emulates left-and-right arrows on your keyboard. Magic Trackpad works too.
It’s easier than you think
To sum up, I’d like to emphasize that presentations are not a task to be intimidated by. I’ve learned that the larger the presentation, the less time you’ll need to prepare each slide. Some of the techniques will be the same from one presentation to another. You’ll also start to optimize the process — use styles more, or reuse certain elements.
It also helps to plan in advance. If you keep in mind that you’ll have to present your design concept, you can copy important things to your presentation draft on the fly. Working like this, I find it only takes me about 4 to 8 hours to put a quality product presentation together.
Design outstanding web in Readymag. Join now