We just had Patrick McKenzie, better known as patio11, at 500 Startups give us better SEO advice than I’ve learned in 3 years. I learned so much I wanted to hug the guy. Here are some of the best nuggets. If you have zero clue about SEO, start with the SEOMoz beginner guide.
“Your…
In this tutorial you will learn how to create an online pitch deck. We won’t be going into any specific details about how to design the deck, or how to do the basic HTML and CSS required, but we will be showing you how to implement the simple jQuery plugin we built to run the pitch deck interaction. If you’d like to find out more about why we did it and what the results were, read our recap here.
1. Design the Pitch Deck
Start out by creating the design for your pitch deck using your favorite graphics editor. We used Photoshop, but depending on how much you plan on working with vectors, you may want to use Illustrator or Fireworks. Make sure you know how users will navigate through your presentation. Our plugin is set up to work with table of content links that are directed to each slide individually, and next/previous buttons.
2. Develop the Pitch Deck with HTML+CSS
You can create code that is as fancy or as simple as you want. On our presentation, we exported entire slides as images, rather than breaking them down into text/images. The only thing you need to keep in mind while coding is that each slide needs to be in an element that can be identified by a single class. By default, the plugin uses .slide to identify a new slide, but that setting can be changed if desired.
3. Make it awesome with jQuery PitchDeck
Now you’re to the easy part. The simple plugin we created is used to add the same functionality shown on our pitch peck. This plugin will add the following functionality:
Including the Plugin
To include the plugin, you will have to first download jQuery, Ariel Flesler’s jQuery.ScrollTo, jQuery Waypoints, and of course our plugin, jQuery PitchDeck.
Make sure to include all the plugin files in the head of your HTML document. To call the pitch deck plugin, it simply takes:
$(document).pitchdeck();
You can optionally change the default settings of the plugin. The settings are as follows:
In order for the navigation links to work correctly, you must link them to the id of the slide you want to navigate to. For example, for slide 1 you would give the .slide element an id of “slide1” and for the link you would set href=”#slide1”.
4. Connect it to AngelList
If the goal is to get investors to request an introduction, you can integrate some cool tools to do this using a little bit of code from another 500 Startups accelerator company, Spinnakr.


5. Enjoy your very own awesome online pitch deck!
That’s it! Feel free to post any comments/questions on this post.
6. Share the love
If you found this helpful, plan to use it as a guide to build your own online pitch deck, or write about it on your blog, all we ask is that you provide a link back to this article. If you end up creating your, share a link to it here as well!
And, if you know someone getting married, in a wedding, or attending a wedding, please point them to DressRush.com and we promise to take care of them!
7. Contact us
If you’d like to contact someone from our team, you can find links to our emails, twitter, and LinkedIn on slide 3 of our online pitch deck. Oh, and a special thanks to our friends at AppSumo for being so supportive!
Thanks!
♥ The Dress Rush Team
(Aaron, Sara, Matt, and Mike)
Last Friday, we decided to employ a different tactic to get the attention of investors than the traditional route that most current startups are expected to follow. Instead of sending our deck out via email in a powerpoint or pdf, we thought we’d create a web version and share it on Twitter with our fellow 500 Startups accelerator companies and ask for feedback. A few minutes after posting the deck, one of our friends at Redeemr checked it out, liked what they saw, and decided to post it to Hacker News. The next thing we knew, our pitch deck was climbing the charts, on its way to #2 on Hacker News and simultaneously going viral on Twitter.
We received tons of awesome feedback, including serious props from other founders (a big thanks to everyone for their support)! Much of the positive feedback we received also came with requests to help other entrepreneurs create an online version of their pitch deck. It was humbling and flattering, and with all of the support, we wanted to think of a way to say thanks. So, we thought it would be cool to share the results from the last few days and to make the plugin we created for our pitch deck public, so that other startups can use it.
Results
We’ve been bombed with emails, tweets, and friend requests since the deck went viral (the deck itself was viewed over 15k times on Friday and hasn’t slowed down since). It has put Dress Rush on the map with other entrepreneurs, advisors, mentors, and investors here in the valley, and, yes, even all over the world. Our AngelList followers doubled (100+ new followers) and we’ve had over 40+ people inquire about investing. I say this not in any way to sound pretentious, but rather to illustrate that sometimes, taking a risk and doing something unexpected can create results you wouldn’t have even imagined.
The coolest thing that it has done is opened up a conversation with some people that I’ve admired for a long time. Noah Kagan, the founder of AppSumo (who we referenced in the title of our deck, called “AppSumo for Weddings” because of similarities in our model - not our products) reached out with some kind words and offered us some invaluable advice we may have never received otherwise.
If you do traditional things, you are going to get traditional results. Creating something unique like DressRush’s pitch deck is how you stand out. However, pitch decks are just the beginning, making a successful business is the hard part :)
- Noah Kagan (Chief Sumo @ AppSumo)
It taught us that while entrepreneurs are, of course, mainly focused on making our own companies go, that there is an overall shared love of tech, innovation, and the desire for constant change and disruption that connects us and makes us want to help each other succeed. It’s awesome.
To view the tutorial on how to setup your own deck, check out the Dress Rush Online Pitch Deck Tutorial.
Thanks again for all the positive feedback from everyone who checked out our online pitch deck!!
♥ The Dress Rush Team
DressRush.com © Copyright 2011