6 big redesigns of summer 2015

After:

1. Top navigation bar left untouched, both colour and content
2. Transition in brand messaging from a “marketing software company” to a “marketing and sales software company”
3. All CTA buttons now say “Learn More” as opposed to a mix of “Learn More” and/or “Start a Free Trial”
4. Removal of Inbound 2015 content, which is HubSpot’s marketing conference held in September (Inbound content will likely return sometime next year as they prepare for the 2016 conference)
5. A “Just Launched, New in HubSpot” CTA section is now the largest real estate owner on the home page, right of center and above the fold
6. HubSpot is now highlighting that their software is available in 5 different languages
7. Darker, more established colors/tones being used in the new design for a more professional look
8. New content for all headlines and subheadlines
9. Headline font sizes have been reduced compared to headlines in the previous design
10. The content calling out HubSpot’s 15,000+ customers in 90 countries has been removed

See the evolution of HubSpot’s website on their timeline

02. Yodle

Before:

After

1. Full screen autoplay video added, which also replaces a multi-gray coloured background
2. Press to play video changed from a square clickable video image to a large play button in the top right which triggers a pop-up product video
3. Updated product video, reduced from 4 minutes to 2 minutes
4. In the top navigation bar, the login has been moved to the far right
5. In the top navigation bar, “Call” has been changed to “Customer Support” and moved to the left side of the login. An additional number next to the heading “Learn More” has also been added to the left of “Customer Support”
6. The headline is now centered, has an increased font size (now taking up three lines instead of two) and changed to white font
7. Subheadline increased in font size, changed to a white font and “45,000” has been updated to “50,000”
8. 8. Left of the subheadline, a logo for “Forbes 2015: America’s Most Promising Companies” has been added
9. New content section has been added under the video, offering “More customers. Less effort. All-in-one affordable marketing solution”
10. Pie chart displaying Yodle’s product offering has been changed to 6 boxes with content written over each box

See the evolution of Yodle’s website on their timeline

03. 99 designs

Before:

After:

1. Top banner changed from blue to gray
2. Content in banner changed from “”Free tips: learn how to brand your new website Check it out” to “Save: Bundle a logo design with matching website from $499”
3. Header image area now consists solely of an image, with content written over in white font
4. Orange and blue logo replaced by white logo
5. The link to “agencies” has been removed from the top navigation
6. A phone number is now included on the same horizontal line as in the top navigation
7. Both links entitled “Questions? call us” and “Request a design consultation” have been removed
8. Headline content has been changed from “Get a design you’ll love – guaranteed” to “Great business starts with a great logo”
9. CTA has been changed to a centered rectangle instead of a rounded button left of center and is now orange instead of blue
10. The text “100% money back guarantee” has been added, while the click to play video image has been removed and replaced with a “how it works” link to a pop-up video player

See the evolution of 99design’s website on their timeline

04. Evernote

Before:

After:

1. The top, dark colored banner has been removed
2. Top navigation links changed from “download” and “menu” to “pricing” and “menu”
3. A search box has been added
4. New header image included with a more colorful background
5. Headline content, subheadline and CTA all remain the same, however, the font color is now white so it can be more easily read over the image
6. While the image of a man is still the focal point of the home page, the content surrounding him has changed from “airport, new space – desks, floor plan – lighting” to “write article, story ideas, destinations, call editor, photographs.” The change in tone is highlighted by the tasks, which change from being more traditional, in-office tasks in the old design to the evolving “work from anywhere” culture portrayed in the new design
7. Under the header section, pricing has been added across three different tiers; basic, plus and premium
8. The “One Workspace” section has been moved down to make room for pricing content
9. A second section on pricing has been inserted towards the bottom of the page
10. The image at the bottom of the page, where the content reads “Available on everything you use every day” has been updated to more clearly show all of the devices Evernote can be used on, now including watches

See the evolution of Evernote’s website on their timeline

05. Prezi

Before:

After:

1. Top navigation bar changed from black to white
2. Logo color changed from white on black to blue on white
3. Three links added to the top left navigation, including “Gallery, Features and Support”
4. The hero image updated from a woman in the midst of a presentation, to a tablet with a scrolling finger, and common items usually found at a desk
5. A subsection (above the fold) has been added with secondary messaging of “One to one”
6. Headline and CTA button moved higher up on page and are now left of center as opposed to centered
7. Headline changed from “Be a great presenter” to “The presentation software for when it matters”
8. Subheadline removed
9. Video link removed
10. CTA button content changed from “Get Started” to “Give Prezi a Try”

See the evolution of Prezi’s website on their timeline

06. Casper

Before:

After:

1. Logo centered
2. Top navigation links changed from “mattress, design, reviews” to “shop, design, reviews”
3. Top navigation bar changed from gray to white
4. The headline font has changed and moved further up the page
5. CTA content remains the same and is still all capitalized, however, now inside of a button with a different font/size
6. Image now includes man and woman, as opposed to one woman
7. There is a lighter shading overlay used in the new hero image showing multiple people
8. The full product (the bed) is shown for scale, and is now on top of a mattress frame instead of sitting on the floor (may also enhance quality of the product so not pictured on the floor)
9. Cart icon implemented in the top right of the page
10. 100 night trial CTA made a focal point below hero image

See the evolution of Casper’s website on their timeline

That’s it! We love redesigns, and track as many as we can as often as they happen. Stay tuned for more and check out Crayon’s all new timeline feature and more here.

Liked this? Read these!

• The top 10 website redesigns of 2015
• How Firstborn’s website redesign subtly breaks expectations
• Secrets of a branding agency’s website redesign