Last week, I finally finished one of the toughest assignments in the short history of Craft+Story: re-branding my wife’s business. I’ve always built her sites and helped her when possible, but this was a big deal. This was a total relaunch of the name, brand, and everything. She bribed me with a steak dinner and a couple martinis, and I spent my weekends working on it until it was finally (mostly) done. Luckily for me, she loves the finished product. For those interested, this is a basic breakdown of what we did and a few lessons learned.
The original name of Rebekah’s business, Images by Rebekah, was very – utilitarian. The rebranding was a chance to show how she was shifting focus from a lot of weddings and a few other things to doing exclusively weddings, and it was a chance to highlight her fun personality. We went through a lot of brainstorming and thought experiments, and produced nothing memorable. At one point, she came into my room and wrote “Hello ____” on the whiteboard; I immediately finished the thought to “Hello Beautiful”, and the name stuck. We checked the domain name, Facebook, Twitter, trademarks, etc, and we went for it. I’d like to say there was more to the process, but this really was a situation of just banging our head against bad ideas repeatedly until something we both loved emerged from the bloodshed.
For the new brand, I drew a lot from things I already knew my wife loved (Kate Spade, script fonts, girl-y colors) and the brands and designers that already appeal to her brides. We had played it safe in early designs, but this time we knew we needed to stand out to find the “right” brides and couples who would be excited to work with Rebekah (or “believers”, as Jason Blumer says). I created a simple logo and some “style tiles” where we paired the bold pink with complementary blues and yellows (later used in her print materials).
In true backward fashion, I started playing with the gallery first because I knew that everything else (static pages and even the blog) would key off this central piece. Traditionally, we’ve always shown a handful of large images at a time (like most photographers), but I really wanted to change that. I started sketching some ideas and decided that in order to fully show the stories in the galleries and to encourage people to look at more than just a couple photos, I wanted a to use a reponsive grid of smaller images (with lightboxes for zooming in). The next step was just figuring out how to tie that into a back end gallery system that Rebekah could update herself.
After I came back, the bugs were gone, but the responsive grid solution I was using was not able to handle lazy loaded images (loading the images “as necessary” after the rest of the page is visible). After just moments of testing, I knew that lazy loading the images was absolutely essential when you had live galleries that could grow to hundreds of photos. So, I scrapped the grid system that I almost had working and decided to implement Masonry.js using some hooks to call it after each image had finished loading (which is surprisingly fast per incident and alternates between downloading and processing).
This was the first part I started, and the last piece to be finished.
Like I said, I started out using Koken, and I had actually gone pretty far doing the whole site in Koken until I hit some major snags. First, the only way to have a contact form was to code it in PHP; annoying (because Rebekah couldn’t update it), but workable, I guess. Then, I was implementing the blog (which will launch later), and realized that there were some features missing. The blog posts themselves had to be added using the simplest of forms; so simple, in fact, that the only option for laying out images inside a post were straight HTML (bad for Rebekah) or no formatting at all (bad for everyone). I thought I could work around this until I realized I didn’t know how to implement an indexed search; and then I found out that there was no indexed search capability, and it wasn’t even on the roadmap according to some answers I found from Koken developers.
Since a blog without even basic searching is not a long-term plan, I decided to just use TYPO3 (which I could modify to do anything I want in the posts and has great search plugins) for everything but the galleries. I could have done the galleries in TYPO3, but Koken really does have some great tools like Lightroom integration.
Seeing this as a chance to start over and not have to conform to some of the “quirks” of the Koken page systems (which are admittedly kinda slapped into a great portfolio/gallery system), I started out from scratch with my TYPO3 implementation. Not a lot of gory details here, but I created a pretty good design system and got it working. Once it was done, I went back and finished the gallery.
I don’t always get to write copy for websites, but it’s definitely one of my favorite things. All of the writing on the website sounds just like my wife (who loves exclamation points) and is geared towards brides and their moms (our main visitors). One of the questions I added to the form, “What part of your wedding are you most excited?”, had some initial resistance from Rebekah because it wasn’t entirely practical and she was afraid everybody would say “getting married”. I liked it, though, because I knew it’s one of the first questions Rebekah loves to ask, and brides love talking about their wedding. In the first day the website was live, we had multiple people filling out the form and they all gave fun answers filled with exclamation points, and excited brides is pretty much what we’re about. Yay!
We didn’t get to launch with the blog because this has been a project strictly for the weekends, and it was more important to get the new brand out there than to wait for total completion. I am excited about the blog, though. We’ve setup a system in TYPO3 to really highlight her images, and I think everyone will love hearing her unfiltered excitement.