The goal with the new visual style was to communicate the reliability and ease-of-use of the product; it should feel trustworthy, down-to-earth, and uncomplicated. The use of plant imagery and warm gradients creates a light-filled, organic feeling to reinforce these characteristics.
In order to launch an improved site as quickly as possible, I designed the homepage with a combination of paper-and-pencil sketches, style tiles in Photoshop, and prototyping in the browser with HTML and Sass. The homepage relies heavily on clear content and great typography to communicate. For those curious: the fonts I used are Brandon Grotesque and Source Sans Pro, both served through Typekit.
After redesigning the homepage, my next priority was to tackle the features page. SproutVideo is a very robust product with a huge amount of features, so making a page that showcases the power of the product while being responsive and considerate of performance was a challenge.
Features are grouped by user goals to let users quickly navigate to the content that’s relevant to them. The feature sub-navigation is fixed to the top as users scroll, so they can easily jump between sections. The recurring element of the SproutVideo gradient appears here as a simple, bright way to anchor the navigation.
When I joined SproutVideo the team was in the process of developing a big new feature: video websites. With this feature, every user on the platform can have a beautiful responsive video website generated for them with the click of a button, which includes advanced privacy controls to configure who accesses what videos.
I designed the product and the themes for the sites, as well as this page on the marketing site which showcases what video websites can do.
For the page design I decided to run with the plant theme of SproutVideo by using gorgeous vintage plant illustrations to frame the content. The imagery was chosen to emphasize the theme of growing your businesses with a comprehensive video strategy. The responsive video site themes are also showcased; users can see a demo as well as previews of the site on desktop and mobile.
While SproutVideo’s product is fairly involved, the pricing is pretty straightforward. Customers pay based on the amount of video they stream and the amount of video they store. All plans include all features, with the exception of the base plan, which doesn’t include engagement metrics. Users can change plans or cancel at any time.
The one thing that sometimes trips users up about our pricing is estimating how much storage and bandwidth they’ll use, based on their video hosting needs. To solve this, we include a handy calculator so users can input their number of videos, video length, and estimated plays per month to get a quote for what plan they should start with. We also included our frequently asked questions on this page, for anyone who needs more information before they’re ready to start a trial.
Our Head of Marketing Courtney Pourchon does some pretty great work over on the SproutVideo blog, providing readers with tons of helpful advice about online video. I decided the excellent content deserved a style to match, so I updated the blog theme to match the rest of the marketing site.
When the time came to grow our team to include a Head of Customer Success, I needed to put together a jobs page pronto. It was important to me that the jobs page convey not just the responsibilities of the position, but also all the things that make working at SproutVideo great. With the help of the icons mind icon set, we showcased the benefits right up front with cute illustrations. The theme of growth was reinforced once again with our trusty plant illustrations.
The style and content will continue to evolve as SproutVideo grows, but this initial redesign brought a significant increase in conversion. Check it out for yourself at SproutVideo.com.