SproutVideo is a powerful and affordable video hosting service for businesses.
As the Creative Director, one of my top priorities when I joined was redesigning the homepage to be beautiful, informative, and responsive. The new site conveys what SproutVideo does, and what value it provides– regardless of the visitor's device.
The goal with the 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 top half of the page shows how SproutVideo helps businesses with their video hosting needs; it also shows an example video player, and the highlights from the product's features.
The bottom half of the page has a simple trial sign-up form, logos of some of the recognizable customers, and a testimonial. It also includes information about pricing plans and customer support, since the price and support are factors that separate SproutVideo from competing services.
This section 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.
This is just the first of many iterations of the homepage, but even this quick solution increased traffic to the site and trial signups.
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.
The features are ordered based on what most differentiates SproutVideo, and the content that has generated the most user interest.
Simple screenshots and iconography are used to support the content, and the clear typographic hierarchy lets users quickly scan for the information that pertains to their needs. Limiting imagery and relying mainly on SVG icons and simple content to tell the product story also kept the page size down, which is good for performance.
Unique calls-to-action throughout make it easy for people to sign up from wherever they are in the page.
For visitors looking to quickly do a side-by-side comparison between SproutVideo and competitors, or who are concerned about a specific feature, they can review the features overview. This area has a complete list of all features, with explanations that appear on hover.
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've 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. We decided the excellent content deserved a style to match, so we've updated the blog theme to match the rest of the marketing site. This design is the first step towards a more airy, light-filled style for our marketing presence, still using the gradients and plants we've come to know and love without so much of the heavy brown. It feels like a step in the right direction.
In addition to redesigning the blog, I've also cranked out some graphics for various emails and blog posts (a few of which can be seen above and in context below), as well as a new jobs page (keep scrolling for that).
When the time came to grow our team to include a Head of Customer Success, we decided we 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.
