A New Homepage to Empower the Marketing Team

As a web design and marketing intern, I helped the team become self-sufficient by updating their Hubspot CMS theme. They became able to publish page elements themselves.

A monitor screen with it`s display divided diagonally in two. One the left side, a blue print diagram of a website, on the right, the resulting website. The HubSpot and HTML 5 logos hover near the monitor.

Project

Better looking = more leads

A determined start up wanted to improve their website's ability to generate leads by hiring an intern to improve it's appearance.

Before I began as a web design and marketing intern and started their CMS redesign, the site was managed by a single person. It was powered by an older HubSpot theme that was purchased years ago that was difficult to update. Outdated custom CSS also cause further design inconsistencies. They needed practical and specific design help to improve the appearance both in comparison to their competitors and their expectations of a quality website.

Objective

Upgrades

Modernize the website's appearance, make its content competitive to generate more leads, and improve self sufficiency.

The overall objective was to generate more leads by improving the appearance of the homepage.

My objectives:

  • Install a new modern theme that made the website easier to update.
  • Research competitor websites and ensure the content was competitive.
  • Create new elements that would better represent the company and describe it's products and services.

Work

New theme, new tricks

I installed a new theme, completed competitor website analysis, then developed elements with balanced content.
  • I researched, installed, and recieved approval for a new theme that had drag and drop features.
  • I researched the competitor's websites and found elements that the original design was missing.
  • Based on the research, I created a page elements that helped showcase their product and its merits.
  • I wrote and edited content to create concise descriptions of key points and ensure a visually balanced appearance.
  • To accompany the content, I sourced and edited photos to attract the eye.
Three presentation slides displaying findings from competitor research.
To find direction for the elements I would design in the new theme, I completed an analysis of four competitors. I presented my findings and recieved the approval to begin desiging the elements.

End Result

Looking good

A new theme improved aesthetics, competitiveness and self-sufficiency.
  • The new modern theme was published after I had left the company, which indicates self-sufficiency.
  • The homepage now has an improved asethetic appearance.
  • The new elements that were created based on competitor research are still there, helping to communicate the product's benefits.
A collage of four images depicting different elements of a web page.
Based on the previous research, I was able to create these elements in the new theme. Many are still used today on their current website.

Reflection

Design by communication

Flexibility in design techniques helps solve real world problems that often have constraints.

I learned that flexibility is required when applying design theory and practices in the real world. Client preference, budget or time constraints can prevent activities like user testing or a design-thinking-based iterative process. I realized that in these cases, an understanding of fundamental design princples, research practices and strong communication skills are needed to enable the best possible design.