Way Past Pretty
Building Blocks for a Successful Website Makeover
Architects work with construction developers to build spaces. Graphic designers work with coders to build websites. The “brain” draws up a visionary blueprint and the “brawn” ensures that vision is realized to its fullest potential.
Originally published by Website Magazine June 9, 2016.
For architects, understanding the intricacies of laying bricks can greatly impact the outcome of a wall design. We consider bricks as modular building blocks, yet time and again we’ve seen beautiful, surprising and impactful spaces made out of this simple baked clay.
The process of developing a website shares this sensibility. Even though every website is built in standard HTML codes, a visionary graphic designer working with a seasoned web developer can create a one of a kind user experience that is equal parts beautiful, functional, and sustainable for years to come.
In the past 8 years, we have designed and built numerous websites for architects and interior designers who enlisted our help to revamp their portfolio websites. Even though beautiful photography is evident in each example, we have learned to emphasize the unique aesthetics of each firm.
Aligning your vision with a team of graphic designers and web developers at the outset of a website makeover project is key to a successful collaboration.
For 1100 Architect, we created an encyclopedic website fitting to their broad areas of focus and allowing for various filtering of projects by interest.
For Amy Lau Design, we created a screensaver-like website delivering beautiful interior design photos on every page. When viewing a project, the website interface fades after out after a few seconds delay, leaving only a beautiful image on full screen next to their logo.
For SheltonMindel, careful use of grid, proportions, and white space governs the layout of every page, reflecting the partner’s careful sensibility to traditional yet modern approach that awarded the firm a Cooper Hewitt National Design Award.
It’s worth noting that we made an effort to modernize the logos on all three websites. Without this crucial step, we would not have been able to create such cohesive and succesful makeovers. A logo defines the overall look-and-feel of a website — establishing this properly at the outset is key to the success of any website revamp. You want to choose the right set of bricks before building an entire wall of a modern house.
Here’s a checklist to help plan your website makeover project:
Do I Need a New Website?
You need a new website if:
- Your clients don’t award you projects because of what they’ve seen on your website.
- You get complaints from people trying to get information or view your work on the website.
- If your website is not responsive — chances are your website is more than four years old. Instead of buying into a “mobile optimization” project, or “deflashing” of your website, you may as well completly reimagine your website with today’s technology requirements in mind. Call it a complete website makeover instead.
- Your website loads slowly and the images aren’t formatted properly for today’s various screen sizes.
- Updating the website feels like a big personal project due to a poor content management system (CMS) or the absence of one.
- Your business model has changed and the website can’t be easily updated to reflect this.
Starting a Website Revamp Project
To start a website revamp project, first consider the following:
- The primary stakeholders are on board — usually the partners or marketing director of your firm.
- Someone in your company is ready and available to be the point contact person with the designers and web developer.
- You can allocate some time and resources to the website revamp, i.e. preparing images, proofing/editing texts, testing the website prototype, managing review and approval process internally.
Basic Technical Requirements
Your new website should fulfill the following technical requirements for today’s web standards. Don’t settle for anything less:
- Responsive design. Your website must be fully optimized for tablets and mobile phones in addition to popular desktop and laptop sizes.
- Don’t use proprietary tools that require users to install special plugins to view your website (hint: don’t use flash) — no one is patient enough to go through hoops just to access a website.
- Search engine optimization (SEO). Make sure your website is ready for SEO. This usually takes time to nail depending on your business’ focus. Hiring an SEO specialist can greatly expedite increasing the rank of your website on popular search engines.
- Content management system (CMS). Always ask for a CMS tool that allows you, or someone internal, to manage the website content on your own without having to contact the web developer for updates. The waiting game will cost you missed opportunities in no time.
- Ongoing relationship. You may not need to work with the web developers regularly, but you want to make sure the company you’ve selected to work with has a good track record in responding to existing clients when they’re in need of technical help, regular maintenance, or occasional feature updates.
Defining the Scope of Work
Answering these questions will help you define a project brief and begin conversations with web designers:
- What are your business goals?
- What are your aesthetic values?
- Who are your primary, secondary, and tertiary audience?
- Can you identify problems with the existing website, both technically and aesthetically?
- Do you need new branding/logo? Are you open to ideas? If you are, be prepared for a longer process working with the graphic designer. It’s also a good idea to work with a web designer who understands branding.
- Who will be involved in the decision making process for design and technical build? Can they be involved in the early design and planning steps?
- Do you have login information to the existing web hosting, domain registrar, and the CMS?
- What visual assets do you have? Is it worth photographing key projects for the website makeover project? If no photography is available, will you be showcasing renderings, sketches, drawn up plans, or construction photos from the development site?
- Do you need to rewrite or edit descriptions and specifications for each project? If so, make sure to schedule this properly accounting for the internal review and approval process.
Author: John Kudos is an Indonesian-born interdisciplinary designer whose work embraces strategy, design, and technology. He studied at the Maryland Institute College of Art, worked for Pentagram for seven years, then established KUDOS Design Collaboratory in 2008. John teaches Typography and Communication Design at School of Visual Arts and is a visiting critic at The New School and Cornell University.
