Skip to main content
Previous post All posts Next post
Banner image

A meltmedia.com Refresh

3
min read

Lynn Fisher
Screenshot of meltmedia's website

 

Even though meltmedia's been a company for over 12 years now, we've produced relatively few versions of meltmedia.com. We've been blessed in that most of our time is spent creating custom solutions for really awesome clients. Sometimes we're so busy we forget to show our own site a little love. And, as many people in our industry know, sometimes designing for yourself can be the most difficult project of all. 

Practice what we preach.

For this refresh, we wanted to stay focused and follow the advice we often give our clients. We preach that content is king and to keep things simple. We recommend against unnecessary animations and in favor of removing features that don't add any value for the user. And of course, when done correctly, less is more. While using CSS3 animations and cool JS libraries can be fun and innovative, in the end, we want the site to be accessible, fast, and to provide good content.

If it ain't broke...

From our last redesign, we established new brand standards and a look and feel we loved. These were aspects we definitely wanted to maintain through this site refresh. After analyzing the site, these are the aspects we decided to keep:

  • Our brand color palette of white, grey, and melt blue
  • Font families Adelle and Helvetica Neue
  • Simple navigation
  • Hero space with large headlines
  • Alternating white and grey content sections
Annotated screenshot of meltmedia's website

 

We changed the Home page to get right to the point.

Although we think our Twitter feed is full of hilarious gems, it's just not as important as the work we do and the work we've done. Now the Home page features project snippets with easy access to case studies and an easily scannable summary of what our company offers.

Screenshot of the old meltmedia homepage

 

Screenshot of redesigned meltmedia homepage

 

We updated our Work page to better showcase our portfolio.

We removed the slider and opted for each case study to have its own dedicated page. You can now read about specific obstacles and features we tackled for each project, or you can simply look through the many images of each interface. We eliminated the additional decoration and interactivity to focus on delivering meaningful content.

Screenshot of the old meltmedia work page

 

Screenshot of redesigned meltmedia work page

 

Screenshot of a redesigned meltmedia case study page

 

We simplified our About page.

Previously, to learn more about a melt team member, you clicked the photo to reveal a more detailed bio. While this was a fun way of including more information, the transitions slowed the page down and we found users clicked their browser back button instead of the "close" button in the upper right corner.

Instead of long bios, this time around we opted for funny (and totally true) facts about each of our team members. We also included each person's name and position with his/her photo for quick scanning. We hope people will stick around the page to read some of the little blurbs we made up, and, at the very least, it shows we're a fun and silly group.

Screenshot of the old meltmedia team bio page.

 

Screenshot of old meltmedia individual bio page

 

Screenshot of the redesigned team bio page

 

We added a Careers page for potential hires.

The jobs feed on our Culture page just wasn't cutting it. It was an after-thought and did not do our work environment justice. So we made a page specifically for potential hires. We wanted to show what it's really like to work at meltmedia by publishing our values, benefits, and additional perks. We included photos of our team and, of course, our office pups. We want to attract great talent and our website needs to show why working at melt is a perfect fit.

Screenshot of the old meltmedia careers page

 

Screenshot of redesigned meltmedia careers page

 

Screenshot of the perks section on the careers page

 

We added header illustrations

Another change we made was to move the page's main content onto a white background instead of grey for better contrast and readability. We incorporated grey landscape illustrations into the headers to provide the needed division, but also to subtly tie in our fun, superhero theme.

An example of the new header images used in the redesign

 

We made it responsive and accessible.

The site utilizes a combination of fluid layout and media queries to respond to the user's available viewport. We envisioned people visiting our site on a variety of devices and on varying connection speeds, so we worked to make the site as fast and light-weight as possible.

Redesigned meltmedia site on mobile devices.

 

We're constantly improving.

Of course, our work on the site can't end with a production deploy. We're tracking user behavior and conversion rates, and we're always looking to improve, no matter how small the change. Check out our site in full and let us know what you think!