Redesigning lessons from Super Bowl

About 100 million people tune into Super Bowl every year. The game is big because the money is big. Companies spend an average of $5 million for a 30 second screen time between plays. Apart from that the Super Bowl generates $300 million in commercial revenues.

With all this money and eyes included, Super Bowl’s 2000s online persona would have been a bad fit for today. Around that time the TV spots were doing great; they were emotional and hitting the right spots, online space on the other hand was the exact opposite. A texty mess.

This blog takes a dive in the website redesign of Super Bowl and helps you draw conclusion in case you’re also asking yourself ‘If I should redesign?’.

Practically speaking, we didn’t have the modular frameworks back then and there was so little to work with. HTML, PHP, CSS, and maybe Flash. In hindsight lack of choices seems better.

Then why even bother doing this unfair comparison, you ask?

Because with this comparison we’ll help you answer a decade old and the most crucial questions of all: Whether you should redesign or not?

Let’s answer this big question with a couple of smaller ones-

  • What is the end goal with your website?
  • What are the problem areas?
  • What will redesign cost?

This is a capture of the old Super Bowl website before the redesign. It shows a 3 column layout filled with all sorts of content with no visual hierarchy and respect to white spaces in sight.

Screenshot of superbowl.com 2009

The Homepage looks like a headache made out of HTML.

For a dedicated page this homepage sure seemed like a missed opportunity to draw attention towards the primary goal of NFL; getting more people to see the game night. Which brings us to the goal of redesign.

Goal of the redesign

Your reasons for redesign can be purely aesthetic like getting bored of your existing design to something strictly business related; existing design being not good enough for conversions. Rebranding also could be one of the reasons to redesign, when you’re trying to launch a new product or service. Like Super Bowl rebranding their colorful and lively logos for an easy consistent brand image in the form of a new logo post 2010.

Once you’re clear about your goal you can start working on the website or tell the people, who are doing it for you, exactly ‘what you want’.

For the Super Bowl homepage the goal would be to get more people to watch the game, while providing other information like venue and time, all at a glance. Something that doesn’t make the visitor work for little but crucial information.

A picture is worth a thou……

Screenshot of Super bowl website

The new design uses the same principal. Just a few days before the game, the homepage features a simple hero image with the game venue cleverly placed in the backdrop.

The new website leverages contrast to make the important information stand out. Like who’s competing, when, and where? There is also a CTA, that clearly mentions what to do next. Being the only action visible before the scroll makes it easier for the readers to complete their journey to the goal.

What are the problem areas?

Like any other website suffering with bad UX, the design team responsible for Super Bowl’s also had to answer questions such as this.

When you’re sure about giving a makeover to your website. Usability reports and insights will help you reaffirm the reasons for your redesign. Having the data-backed reasons to do so won’t hurt.

Ask your agency or hire specialists to evaluate your website, think heuristics, visual QA, and accessibility tests. Knowing exactly what’s wrong helps you gauge the magnitude of the solution, since redesign is not a days job.

So now you’ve figured out the goal of your redesign and the problem areas that you need to work upon. Now all you need is a plan.

How will the redesign work?

Redesign for an enterprise is like clockwork, where all the cogs need to be engineered to fit without fault. Ask these questions to ensure smooth operation of your clockwork:

Is the development in house or outsourced?

It’s not necessary to keep the redesigning in-house if you have a team of your own, since outsourced dedicated teams can produce equivalent or better work more efficiently. When an outsourcing team handles the grunt work, your design team can dedicate their important time for planning how the redesign will go about. If you lack resources, you can completely outsource the design otherwise you can opt for design assistance.

Who leads the overall project and vision?

Inclusion is great for collaboration but it can distract the team from the goal. It is important for your redesign that there is a nay-sayer that keeps the team on track and keeps the project and vision from becoming something else, a hybrid of everyone’s opinion. Just as a Quarterback in football.

How will progress and success be measured?

If there were no yard markings then the football players won’t know if they get another 4-downs or how far they have come on the field. Clearly defined milestones of progress and success will do the same for the team working on your redesign. It prevents constant to and fro later in the process that only results in delays and inconsistent outcomes.

What are your timelines?

Football games typically last for 60 minutes, divided in four quarters of 15 minutes. It helps decide the pace and play of the game. For somewhat same reasons timelines are important for your milestones too. After defining the milestones you’d also need to plan when you’re expecting them. Getting chunks of predefined deliverables in time helps set momentum for project completion.

How much will a redesign cost?

If you manage to find the right agency and all the cogs slide right into place, then you won’t have to worry about the overheads.

A medium to large website redesign can cost around $10000 to $50000 depending on the customization and functionalities you require. Before throwing that kind of money on a redesign project you must ensure that you’re getting a handsome ROI out of the whole exercise.

If you’re thinking that ‘Just doing it’ would fix all your issues then it’s nothing more than a shot in the dark.

Takeaways

  • Keep Navbar sticky and visible at all times
  • Avoid multiple CTAs on a single screen
  • Give content some room to breathe
  • Make your copy clear and concise
  • Prioritize content according to your goals

When it’s the right decision, redesigning your website can have a positive impact on your business. But, if it isn’t the right decision, a site redesign can be a huge waste of time and resource.

If not redesign then what? Custom landing pages, targeted ads, and localization are a great place to start.

Posted in UX

Share

Stay up to date with latest happenings in our space