The Story of Building the New Common Craft

A few months ago, we released a completely new and different Common Craft. This is the story of the big ideas that drove the change and getting the website designed and built.

App or Not?
 
In 2010, we wanted a Common Craft app that would put our video library in your pocket, any time you need it.  We had a version built, but something didn’t feel right.  We dropped it.  Soon after, I talked to a few people I respect in the mobile world, like Brian Fling at Pinch/Zoom and Brian Leroux at Nitobi who both said the same thing:  consider the potential to build a service that ensures that your videos can play on any platform and multiple devices. They suggested using the Web and commoncraft.com to make it happen vs. a dedicated app that would have limits.
 
It took a while to sink in, but they were right and we started to think about the potential of Common Craft as a video service that’s designed for using the videos anytime, anywhere.  
 
Business Case
 
Over the past year, we heard a common comment from licensing customers - they wanted a way to access all the videos and not just pick-and-choose, iTunes style.  This planted a seed - how can we give them everything?  What’s the business model? Is mobile part of it?
 
We needed a completely new service that offers our complete library of videos, all playable on mobile devices, websites, internal networks, etc.  It was clear that we needed a membership service.  Members would access all the videos in library form and have options for putting the videos to work in multiple contexts (in person, on website and mobile).  We wanted the membership service to be available via subscription and offer a “power tool” for using videos in education.
 
The basic idea had formed.
 
Platform
 
Common Craft has been on the Drupal platform since 2005.  Since one of the core features of Drupal is member management, we saw the potential to build onto our current Drupal site, which also provides a platform for e-commerce.
 
At the same time, we needed a video host.  We’d learned over time that making videos work is a specialty and not something we should try to do ourselves.  We needed a video partner that could ensure the videos play reliably on the Web and on mobile devices.  
 
We’ve been friends and business partners with Wistia for a couple of years and started discussing it with them and eyeing their API as a resource for hosting and sharing the videos.  Aside from technology, we’ve had consistently excellent experiences with Wistia and thought - this could work!
 
By now we had an idea and potential platforms.  We needed Web pros to help us figure out the best path forward.  Sachi and I are not developers.
 
People
 
Having a Drupal site for years, we knew that Seattle has an active Drupal community and I set out to find the right locals for the job.  I knew Gregory Heller was well connected in the Seattle Drupal community and contacted him directly. He wrote back with two names:  Josh Kopel and Jared Stoneberg.  I contacted them both and found that they have complementary skills and were in the process of becoming a team. They are now operating as Number 10 Web Company.
 
In what would become one of the most fortuitous turns in the project, these two were both available and very well equipped to complete the project.  Through a few meetings at Cafe Presse in Seattle, we had a dev team in place.  This was February of 2011.
 
Of course, development isn’t everything. We needed a designer and someone to help with information architecture (IA).  Findng an IA person was easy, as we’ve had a long relationship with the folks at Juxtaprose and knew Jay Fienberg could help us nail down the structure and organization of the site.  The developers recommended a designer named Dan Shafer to do the design. In addition, we talked to folks like Tony Wright, who could be an advisor, especially during the early stages.
 
So the idea, basic platform and team were now in place. Now what?
 
Project Definition
 
Sachi and I had a pretty clear idea of what we wanted, but how to get there was the challenge. Some of the biggest questions were policy related and included:
  • Will Common Craft videos still be available for free on the website?
  • What features will only be available to members?
  • Do different levels of membership come with different features?
  • What are the required features for the project?
  • How will pricing work?
Over a couple of months we had multiple face-to-face meetings and I personally created billions of lists of things that could be features or considerations.  Thankfully Jay was able to take it all in and create the IA doc that became the foundation of the service.  It allowed us to think about what was on every page and why. 
 
Integrations
 
The new Common Craft is a tightly integrated set of platforms.  Selecting the platforms and making sure they work was a big challenge and one that was accepted by Josh Kopel.  Through a lot of discussion and testing, we defined the major pieces and how they’d work together.
  • Website Front End:  Drupal 7
  • Website Back End: PHP/MySQL
  • Video API/Host: Wistia
  • ECommerce Front End:  Recurly
  • Merchant services: Authorize.net
  • Email services: Mail Chimp
  • SSL Security: Digicert
Things were coming together.  The major design decisions were made, the platforms were lined up and development was underway.
 
Design
 
Common Craft has a clear visual identity that’s based on our videos.  Our new site needed reflect these elements: White background, limited color, hand drawn images, etc. Dan was able to take these and create designs that work well. 
 
Mobile, Revisited
 
From the earliest discussions, we made mobile a priority.  The website and videos should look and play well on small screens.  Jared Stoneberg led the way in recommending responsive design as a way to handle small screens. The website is designed to rearrange itself based on the size of the screen, creating different, more appropriate experiences based on the screen size. This meant we didn’t need an app or a dedicated mobile site. It all made sense and became our mobile direction.
 
Content
 
In relaunching Common Craft, Sachi and I thought about all the ways we could extend the value of our content. We’re big believers in the global potential of our videos, which work well with translated voice-overs. The videos travel well. So, we set out to make the new Common Craft more international, with over 30 videos with voice-overs in 8 languages.  This included professionally translated transcripts, titles, descriptions, etc. Soon, our library went from 40 videos to hundreds.  It was a major project just to get all the content completed and uploaded to the site.
 
Bringing It Together
 
We saw the first versions of the site in July of 2011.  Josh and Jared got everything humming along and Dan made everything look and work well.  The biggest challenge was the home page, which took a lot of iteration.  Two things we felt were important, aside from the sales funnel, were the use of white space and "bigness" in the design. 
 
As with any project, there were roadblocks, but we were impressed at how Josh and Jared were able to overcome them.  Josh always had some way to make things work. 
 
Launch
 
We launched the new Common Craft on August 8th, 2011, about 6 months after our first discussions with Josh and Jared. After a few initial adjustments, things have gone smoothly and the service is working, both technically and a business.  We’re excited to have a growing membership from around the world.  
 
Sachi and I have gone through a number of big projects and found, whether it’s renovating a house or building a new website, the people matter most.  If we can create a good, honest working relationship, we can overcome almost anything.  We came out of this project with great relationships with our partners - something we cherish. 
 
The Future
 
The service is up, and it’s working. Now begins the long and constant search for improvement.  We’re set up for testing and measuring, and so begins our challenge: to use data to encourage membership and make both potential and current members’ lives easier.  
 
Epilogue:
What our partners are up to and how to contact them:
  • Josh Kopel and Jared Stoneberg now run a company that specializes in Drupal development. It’s called Number 10 Web Company, based in Seattle.  
  • Jay Fienberg and Anastasia Fuller run Juxtaprose, which designs and develops websites.
  • Wistia is going strong and becoming a standard for business video sharing.
  • Dan Shafer is a freelance designer and instructor at the Cornish Design School in Seattle.
  • Tony Wright recently started Tomo Labs and launched TouchBase, a calendar app for iOS

For more,