Product Roadmap Template in PowerPoint ✔
- Articles, Blog

Product Roadmap Template in PowerPoint ✔


Hello. This tutorial will be more
complicated than usual because I had a question from William, which is one of my students, “How could you approach Product Roadmap, “a timeline in PowerPoint, “how could you approach
designing something like that, “something similar in a different way?” I went for a more designerish approach. I’ll explain you my entire thought process and how I created all of this. This is something more
advanced than normal, so let us take this and
make it more transparent by good design practices. I am definitely no expert
in this type of content, but I did read up upon what that is, how this should be laid out, and what could be improved here. I’ll do this from a graphical perspective. What I think that is good here, and what I think that is bad here. Firstly, I don’t like those lines. This is the legend, and those
are additional informations which I believe both could
be on the right side. So the legend, the legend
could eventually stay here, but those, this is a console
of dashboard informations could be eventually on the right side. I also do not like that the marketing, the development, and the KPI,
it’s set to the left side because I can’t barely read it. I have to think about what is here. So I would place it above here. The timeline is okay. It could be of course a bit better design, but it’s basically okay. So let us try an approach slight like that where we will try to lay out a Product Roadmap in PowerPoint. In order to do something similar, I’ll try and create three boxes like this. I would simply go and I would insert three shapes with the same size. I would make sure that I have enough space for other things later on. But at first, I would focus on that. All right, this would be my
initial basic three boxes. From what I see, we have
just about enough space to cover them all, one, two, three, and we have marketing development and KPI. Let’s also do something like that here. At first, I wouldn’t definitely want to get rid of this blue color. I would go to format, I
would go to shape fill, and eventually, I would stay
with a very, very light gray because I would like them
to be a bit outlined here. About the outline, well,
at the very beginning, we don’t really need it, so select No Outline. Here we can continue our work simply by going to Insert, Text Box, and always inserting text
boxes and filling them out. Okay, I did make them gray so they will not stand in the way, and I need to consider if I want to start the timeline right here, or I want it after the
text, so the timeline here. Well, in order to save space, I’ll start the timeline immediately, because here we have empty space which is not really used, and why would we waste
precious space on our slides when we can start to work right away? So I’ll make the timeline from here. And the timeline would be very simple. You can simply select, I have a shortcut, Alt two for shapes, and you can use rectangles, you can use lines, I’ll maybe take some lines, I’ll put lines here and try to make a timeline for the entire roadmap. I’ll maybe make something
similar, like one year. So I would go here. I would consider if I want
to stay with the line, but let’s say that this will be the start and end of my series. So I can always go to
Format, Shape Outline, and I can select the appropriate color. I would also need a color scheme to later on use the colors because those colors are also very ugly. This green doesn’t work together
with this orange and red. Well, it could stay like that because those colors are
at least really visible and they stand a bit out, but I personally would go to a website, I would select a color scheme, even a bold one like that, and I would use a consistent
and well-designed color scheme. Okay, let’s assume that
I have boxes like that. I would need to go to Format, Align, align the middle so they will line up, and I’ll also select Align,
Align Selected Object, and distribute horizontally. This way, those would be
distributed equally along the slide and I would have still space. Not maybe those long
lines along the design. Okay, actually, I did the months and the months would be the same. Align, Align Middle, Align Distribute Horizontally. This way, they would be a bit distributed and I would consider if I want
to have lines for each month, or just those bigger lines. I believe I would like to
have just those bigger lines and what I would do, I would create a line like that, I would copy it, I would maybe go over the entire design, considering if I want
to have it also here, and I would take the shape outline, I would take the lightest gray, and I would make it a bit darker. This way we have a very thin line here, so it really isn’t bothering anyone. It’s really pleasant to watch, because it’s such a soft line. Okay, I wouldn’t take long, but I would select a
consistent color scheme. And just look at that, and look at this. How ugly is this compared
to a nice color scheme? The way I would go
about those informations if they would have to be
exactly the same way here I have here one product timeline, I have here three tasks to perform, but I would make everything equal. Since I made those boxes equal, I know that here I need one element, here I need three elements
to fit in this box. Okay, so what I would do, I would select Alt two in my case, and I would start by
making those rectangles. I would make a rectangle,
which would be small enough so three of them can fit here. I would make sure that everything fits, I would make equal spaces between them, and eventually, I can always
shift click, shift click, and I can make them a bit bigger. Holding the left Alt key
will give me freedom, and I would have equal boxes like that. Those boxes will be
here in the middle part, because here we had three part, but here on the top side, I
would have one box like that and this would be completely enough. And now everything would
look very consistent. I would, of course, change the color. I would make sure that in the format, I have no outline. Now let me try and design
a few of those elements to be similar to this one,
and then we can proceed. To make this easier for me, I would Control C, Control
V this object here. I would select Format, Crop, and I would leave out only the element I’m currently designing. Let’s say that I want it
to be very similar to this. So I’ll try and just make those boxes. When it comes to the text, I would place the text within this box. This is why I wanted to make it bigger, because here, really don’t see anything. We have this text, we have this text, it somehow doesn’t fit all together. So I will place the text
inside of those boxes. If you would like to go over with me, you can see we have one
mound of this press lounge. Shape Fill, Eyedropper, my first color. So the press lounge isn’t so important, so I would select a more light color. It has finished about in January, so I would make it smaller, and I’ll not have much
space for the text here. So I’ll have to think of something. I can select this text, and I’ll press Launch. I need to make sure that it
will be big enough to fit here or maybe small enough. Format, Text Fill, white
to make it visible, I’ll select my left control
key and my left bracket key to make it smaller, maybe not bolden, and now you need to decide
if this is big enough. If not, you need to reconsider
the size of the boxes. Well, this is the smallest box of all, so this is the only trouble we have, but I could always make
those boxes a bit longer. We have still space on the bottom, space on the top side, because we can use this entire space. I’ll not do this. I’ll stay with the size that I have. I’ll just make the text a bit smaller. I’ll make this box, of
course, a bit smaller, because later on we’ll have
plenty of place for the text. So let’s make the first
one small like that. We have the press launch. I think it’s still visible,
and it should be all right. Isn’t that quite a bit
nicer than this one? So I would get rid of this one. I would prepare this like that. I have, for each element, a
normal box, and a text box. Now I will just press
Control C, Control V. I would place them here. Of course, I would need to
change the names, the values, I would make them longer, shorter, but basically I would approach
the design part like this and I would have this very well prepared. Of course, I would need
to spend a bit more time to make everything equal,
everything beautiful, and now do we want to consider
the additional informations? Do we want to have it one the
bottom, on the right side? Do we need the legend? And how could you approach that? I personally would consider
placing this on another slide because if we place this here, of course we can do this, but it would very cluster
the entire design, So you need to carefully consider what will be your next move? Just a little hint, if you have trouble resizing those boxes because this is so many elements, and everything is snapping together, you can always press,
look at the snapping, you can always press left alt key, and you have total freedom. Nothing is snapping, you can do what you want, you can make the space
exactly as you want, because normally you have some troubles. It either snaps here, or
you make it big like that, but I want it to have a bit smaller. I’m pressing the left alt, boom, and now I could make the space as I want. All right, but let’s say
that you have to place this bottom side here on the right side or on the slide you are presenting. I, again, I would encourage you to select a new slide, place
all those informations here, and make a hyperlink. For example, this element
could be a hyperlink. You go to Insert, Action or Link, for example a link, let’s maybe select an action. On mouse click, hyperlink
to, in this case next slide, but you can also select slide number two, or let’s say slide number three. Slide number three, boom, okay. And as you are presenting this slide, you can always click here and it will take you to the slide
with all the information. But all right, let’s consider if you would have to put it here. What I immediately see here, why do we have one box, this
is totally waste of space. A green box that says green. Like a delivery, and a box that says red. Why don’t you just take the delivery, and put it in a red box instead? This way, you can put two
informations in one box. Delivery red, and information. Delays expected to version one. I have it here. And I would make those boxes
super small, like that. Control C, control V. Control C, control V. Control C, control V. I would use those colors I have here like the amber, the green, of course not the green because I would select my colors here. Let’s make this somehow a legend, or something like that. Shape fill, I would
select the colors I have and I would make the
explanations here under it. This way, look at that. Just look at the slide. Everything is well-balanced. You can immediately see what is going on. The text is also very similar. I use Century Gothic, by the way, to make the font consistent. I have the marketing, the development, those key performance indicators, and just look at this slide, and look at this slide. Everything is clustered. You have those informations
like set in one place, plenty of informations, plenty of text, and those lines with those circles. Those circles represent end
of a certain development path, but they are not really necessary, and they really look,
in my opinion, not well. I understand that this is
just a simple product roadmap, and example, and this is not
something that you design, this is an example from which you could take inspiration like I did here, but I would go about
this somewhere like this. I would make this very readable, so it’s very easy to distinguish
the time on the timeline, and then I would just take
those consistent colored boxes, and I would make them smaller, bigger, I would label them differently, so we immediately can see those labels, because those seem to be
very important in this. This is a very long tutorial, but it was something out of the ordinary. It is more complicated. So we did need more time to elaborate on what we are doing here. I hope this will be helpful, William, and it will help you solve your problem while creating roadmaps like that. Let me know what you think about it and I’ll see you in
other lessons like this.

About Ralph Robinson

Read All Posts By Ralph Robinson

9 thoughts on “Product Roadmap Template in PowerPoint ✔

  1. Thank you for this – your designs always inspire me.
    I'm wondering is there a specific reason you use Ctrl-C + Ctrl-V instead of Ctrl-D?

  2. You are amazing. Thank you for doing this. I really like your design-ish roadmap approach. Keep doing this. I'll spread the word as much as possible. Thank you. @webgyver

  3. This was really helpful to me, I just created a roadmap for myself. If possible could you please let me know how to fetch the color schemes and use it in the ppt like you did?

    Thanks

Leave a Reply

Your email address will not be published. Required fields are marked *