Let’s just get it out there — I never loved our logo.
The copyediting concept was just a quick idea and great play on our name that Brian came up with when filing our business paperwork. I mocked it up and went with it to get the business off the ground, never intending to keep it. But everyone we met loved it. People raved about it at conferences and networking events when they asked for my card, they raved about it when calling about new projects, and over time, it just stuck.
For the first several years Bourn Creative existed, I was by myself. The colorful rainbow branding we’ve had for years evolved out of my love of color and my desire for something other than the logo to represent me, because at the time, I was the business. I loved the color, the positive feedback, and the praise we received from others about how much they loved it.
Then Brian joined Bourn Creative and took over the company as CEO and all WordPress development, and the brand had to evolve. It didn’t represent a company, but me and my freelance history. So we redesigned the Bourn Creative site, simplifying the rainbows. And about 18 months later, we did it again to “man up” the brand even more. But…
Each redesign was done in constraints created by our brand, our audience, and our lack of time.
We were bursting at the seams with more client work than we could possibly handle. We were saying no to more people than we were saying yes to. We were so focused on serving our clients and getting the work done, that we failed to remain the drivers behind our visual brand. We let what other people thought about the brand — what other people liked — drive the decisions we made about how we were showing up.
Luckily, by focusing on doing great work and providing great service, we continued to build a stellar reputation in the market, which has led to even more work — better work with better clients — but…
When it came to our own brand, we were uninspired, bored.
Most of our clients already have everything we can create for them in place. They call us when they realize that while what they have got them to where they are today, it isn’t going to get them where they want to go.
One day I was explaining this idea to a prospect, and had a stark realization. We were in the exact same place. Our brand represented where we had been and our history, not our vision for the future and where we wanted to take the company.
Bourn Creative needed an overhaul.
At first we were just going to do some minor site updates, finally moving to HTML5. Then we decided to make some design changes, which evolved into a full site redesign, which then expanded into a complete overhaul of the site from top to bottom.
At that point, we just decided it was time to rip the band-aid off, leave behind the old logo and my glittery rainbow, and step up our brand to truly reflect the level of work we do.
The decision to let go of the past and focus on the future was incredibly liberating. We were giving ourselves the permission to start fresh and damn it, I wanted a logo with an icon.
So, over the last week of September, I spent hours combing through typefaces and font families, working through accent colors, and working through icon concepts. By the end of the weekend, I finished the redesign our logo, we nailed down the final color palette and typography, and had a rough idea of what we wanted for the site.
Just a few days later, I flew to Minneapolis to speak at the inaugural Prestige Conference, and made the decision to use our new logo and palette to create my slide deck. I tested the waters with the new brand and the feedback was overwhelmingly positive.
Then during the Q&A after my talk, someone asked when the new site would be launched. Off the cuff, I replied, “By WordCamp San Francisco.” I think at that time I was so excited about what I knew was in the works, that I never really evaluated just how much work we had ahead of us.
We were optimistic. We honestly thought we might be able to do it, or at least get close — and we did get close. We almost made it, but decided to hold off the launch to finish the portfolio completely and do some final polishing.
I got back from Prestige Conference on October 5, 2014, and here we are live exactly four weeks later.
The entire month of October was a blur.
We still had client work to do, meetings to attend, projects to finish, presentation decks to create, WordCamp San Francisco to attend and speak at — all not part of this project!
This was by far the most intensive overhaul of our own site that we have ever done.
If you’re thinking about a rebrand or a redesign, and you’re wondering what the process may be like or how much work goes into a project like this, I’ve included an outline of our site redesign process from start to finish below:
Bourn Creative Website Redesign
The day after I got home from Minneapolis, Brian and I reviewed our analytics in depth. We looked at what pages visitors spent the most time on and what pages no one cared about. We looked at where they were clicking, how they were moving through the site, and what they were doing, as well as what browsers and devices were being used to view the site.
Based on our findings, we made some immediate decisions, like removing some pages completely, removing the sidebar from the entire site, and simplifying the site footer, and beefing up the main call to action.
We then reviewed our past contact form and inquiry form submissions, evaluating the questions prospects asked most, and mapped out a content plan, outlining exactly what content we need, what order it should be in, what must be communicated, and what questions should be answered.
Once we had a clear roadmap, I opened Photoshop and got to work.
- To pay homage to our history, we kept the red and black, our core brand colors from the beginning of the business, and the full width bands of color throughout the theme.
- We chose to make the new menu a sticky menu (pinned at the top of the screen), and added a more prominent call to action in the menu.
- A call to action section was also added just above the footer across the entire site.
One week later, the the design for almost every page of the site was done and I kicked the PSD over to Brian to start building.
One Step At A Time
We approached this project in a different way than we typically do, partly because of the amount of work that was ahead of us and partly because we had years of existing content to work with.
Brian built the site one section at a time, pushing each to staging as they were finished so I could work on the content as we progressed. This allowed us both to be pushing the project forward at the same time without any delays.
The Blog Section
First, Brian got started with the blog section of the site, as it uses the default styles, and I turned our collection of icons, both custom and curated, into a custom icon font for our site.
As he worked on building out the blog templates, I:
- Audited 527 blog posts by topic, deleting all that were not in alignment with our vision for the company brand, narrowing it down to 375, and redirecting each of the old URLs.
- Removed all uses of the H4-H6 tags in the content, and adjusted the markup to use the H2 and H3 tags properly.
- Removed all inline styles and poor HTML from when I was new to blogging and still learning, and edited CSS as needed.
- Updated and rewrote the content in several older posts.
- Removed all customization (custom text) I had applied to the WordPress More tag in every post, one-by-one.
When Brian finished building the blog section of the site, he pushed it up to staging, imported all of the content from our site, and got started working on the Testimonials section of the site.
The content width of this site is 32 pixels wider than our old site, and now all posts use the featured image, which meant all of the blog images needed to be redone, so for all 375 posts, I:
- Removed the primary blog post image from the content area
- Created about 35 custom featured images
- Pulled about 25 from our family photo archives
- Searched for and purchased the remaining 315 through our stock imagery resources
- Cropped and resized them all, uploaded them to the new site, and assigned the featured image to every post one-by-one
We also needed to curate our categories and tags better:
- I edited every post to only use one category (mostly) and removed a couple categories
- Our tags were out of control! I edited them down from 823 to just over 100, auditing tags on a post-by-post basis, making sure they are tagged appropriately and only using 1-5 tags.
With the redesign, we introduced a new feature — post formats, which meant reviewing each post and reassigning it to the appropriate post format. Luckily, this could be done mainly by category, so it went fairly quickly.
Also, we receive requests weekly from people who love our social icons and want them in other colors and for other networks, so we figured this was as good a time as any to add the new icons and provide each collection in vector format — so all of the free social media icon posts have also been updated.
The Testimonials Section
After finishing the development of the site’s testimonials section and pushing it up to staging, Brian got started on the templates for the Contact and Get Started pages, and got started with the About, Home, and Services page templates, while I cleaned up Testimonials content — and it needed a lot of clean up.
Without a personal website, all of the testimonials for workshops I have taught in the past or for my speaking just got added to the Bourn Creative site along with our client testimonials, and they needed to be removed.
- I culled down the testimonials on the site from just under 120 to just under 75.
- We changed the way we handle and format testimonials, as well as how the images are added, so for every testimonial, I had to create the post, format the content, create the images at the new size, upload, and apply them as the featured images.
- I wrote new content for the page introduction and short content blocks for each of the full width colored bars on the page.
The About, Home, and Services Pages
Brian finished the About, Home, and Services page templates, pushed them to staging, and immediately got to work building our new portfolio, while I then got neck deep in writing content.
I wrote new content for the Home page, Services page, and About page, including new bios. I also added a new team member and all new imagery.
I had done quite a bit of work mapping out the content for the site with sticky notes in advance, so luckily the copywriting for these pages went pretty quick — and the back end of each template was designed to automate as much as possible, so adding the new content was easy and fast.
The Portfolio Section
Once Brian finished building out the Portfolio section of the site and pushed it to staging, he moved on to the responsive development and meticulous testing, while I tackled a complete redo of our portfolio.
Our old portfolio was impressive but overwhelming. While not everything we did made it in, it still had 9+ years of work included, which means there were more than 150 portfolio entries with several work samples in each one.
It need to be smaller, simpler, and more of an overview of what we can do.
First Brian and I reviewed every portfolio entry, deciding what would stay as a primary entry, what would be merged into a “collections” entry, and what would be removed completely.
We ended up with 30 individual portfolio entries and three collection style entries.
- Again, because the content width changed, every work sample had to be redone at the new size — which equated to literally hundreds of images that needed to be recreated.
- The new portfolio uses featured images, so each entry also needed a new “overview” image created and assigned as the featured image.
- We switched from displaying our work in a gallery-style format to using Soliloquy, so every work sample also needed to be added to the individual project slider, which also meant each needed SEO data added and the slider short code needed to be applied to a custom field so it would be output above the entry title.
- Once done with the images, I grabbed short pieces of each coordinating client testimonial and added it to the bar at the bottom of their portfolio feature.
- Then I wrote a short description for each portfolio entry, giving our visitors some more information about what we did for the client.
Once I was done, Brian went through the portfolio and deleted more individual work samples from projects, as he is much less attached to them than I am.
Tweaking And Polishing
While I worked on finishing the portfolio images, Brian finished the responsive development, pushed it to staging, and tested the site on every device he could get his hands on.
He continued to make small tweaks here and there, and began clicking through the site page by page, post by post, portfolio entry by portfolio entry, making notes about small content changes, image issues, and things we would need to evaluate together.
We cleaned up all the typos and grammatical errors we could find — and I’m sure missed a couple — checked everything one last time, and finally pushed the site live.
We Thrive Under Pressure
Luckily we thrive under pressure and do our most focused and best work while under deadline. We loved the compressed timeline and total immersion into the project and really hope to have the opportunity to work with clients like this in the future.
As I write this post and look back at the project, I am happy to say that from start to finish, the site got done in only four weeks. From strategy and content, to design and development, I am really proud of the site and look forward to sharing it with you and hearing your feedback!
But for now, we’re exhausted, we need a long nap (or two or three), and we’re ready for our next vacation — a week in Disneyland to celebrate with the kiddos!