The Before & After Redesign Series is a Legendary Lion Web Design project aimed at showcasing an overview of our web design process through the lens of well-known existing websites.
Before & After: The W3 Project
At Legendary Lion, our mission is to build a better Internet one website at a time. As such, it was only natural for us to explore where the Internet all began. Behold, The W3 Project:
We immediately felt inspired to dive into this site and expedite 25 years of updating in one take. To start things off, Kayla created a style tile to help propel us in the right direction:
To create a style tile, we collect each design element that we plan to incorporate into a website and arrange them in a quick document to give the team (and the client) an at-a-glance view of the direction we hope to take for the final design. This is a great way to communicate the aesthetic feeling that a client is trying to achieve. For style tiles, we focus solely on:
Menu and Button Shapes
Header, Subheader and Body Copy Size
While Kayla is working on the style tile, Erin is spending time with the existing copy, reorganizing it to make it accessible, interesting, and appropriate. She creates a new sitemap to ensure that each page is fully incorporated while still keeping the new site simple, straight-forward, and navigable.
“The W3 Project legacy site was laid out in an incredibly convoluted way. The original designers built pages upon pages into one another with no clear menu to navigate back and forth between pages. It’s like the forefathers of the Internet always intended for the World Wide Web to be a forceful rabbit hole.” – Erin
For the sitemap, Erin pulls the original sitemap out into a document and renames pages to be more intuitive. Then, she adds submenus where appropriate. When there’s a lot of information to incorporate, she creates a copy matrix as a basic outline of each header on each page.
Home Page Design
When logic and inspiration collide, we call it design. After Kayla has finished the style tile and Erin has finished the sitemap, the two are combined to create a new home page.
“For this design, I was inspired by the clean and simple feel that the original site was already portraying. I thought that a crisp new design was the best approach. I chose the imagery because, to me, the Internet encompasses the entire universe, which is what is also being shown by this powerful display.” – Kayla
And there you have it! The W3 Project Redesigned.
Like what you see? We’re always taking suggestions for future projects to include in this series. We’d also be happy to work towards giving your company its lion’s share of the web. Feel free to schedule your first appointment to find out more about what we can do for you.