Service
Development of a new WordPress membership website with user profiles, a searchable member directory, communities, forums, events, and trainings.
Technologies Used
Custom Code Written
- 4 custom plugins
- 1 custom theme, based on Love Charlotte by Get Polished
- 8500+ lines of PHP/HTML
- 6700+ lines of SASS
- 1000+ lines of JavaScript/jQuery
Designed By
Irene Hardy of Magnoliahouse Creative
for Heather Crabtree
The Vision
Have you ever felt alone in your business? Like you’re not a part of the “cool” crowd? Have you wondered if you have it in you to keep going, felt like everyone else has it all figured out, or wished you could have some #realtalk with someone who’s been in your shoes before? If any of those resonate with you, Heather Crabtree has just the place for you: The Savvy Community membership site. Heather had already built a thriving community for female entrepreneurs on Facebook -- the Savvy Business Owners group -- but knew that the limitations of Facebook’s group system were holding the community back from reaching its full potential.
With the help of her team, Heather came up with the idea of a membership site that would fill its members up instead of overwhelming them like the Facebook group did. She wanted members to be able to interact on a more personal level, wanted to create a place where authentic connections could be made, and wanted everyone to feel like they were welcome there.
The Savvy Community membership site had to be full-featured from day one. Included in the laundry list of necessary features: protecting members only pages from outside eyes; complex user profiles with custom fields; a searchable directory of members to make it easy to find exactly the person you need; a dashboard where members could find all the latest updates and happenings; a home for in-person Savvy Meetups that integrated seamlessly with the forums; a calendar of upcoming events; a catalog of trainings, both future and past...and, of course, everything needed to be painstakingly styled to match the mockups created by Heather’s brilliant designer, Irene Hardy of Magnoliahouse Creative.
Selected Mockups
The Challenges
I knew before development even started that this site was going to be particularly challenging, if only for the sheer complexity of it. There were so many moving parts -- MemberPress, BuddyPress, bbPress, and many more -- that getting them all correctly integrated into the site and working in harmony with each other was a daunting task.
The timeline was also a challenge: originally planned for fall 2016, it took longer to prepare and design The Savvy Community than estimated. It ended up getting pushed from a September start to November/December, when I already had a different, complex website development project underway and would be out of office for a week for the holidays.
But, ready or not, The Savvy Community was launching on January 18th, 2017, so I had to find a way to reconcile the demands of two big projects at the same time.
The Process
Overcoming the challenges of The Savvy Community’s build came down to two essential keys: getting a solid plan in place, and taking development one component at a time. The idea of working on two projects of similarly large magnitude at the same time was overwhelming at first. But, both projects were non-negotiable, where their timelines and my desire to complete them were concerned, so I knew I had to find a way to make it happen.
I already had a plan in place for tackling the other big project in active development when Savvy was ready to be built, so I knew exactly what I needed to have done each week for that project in order to launch by a certain date.
I didn’t start the Savvy site with a plan like that, though. I needed to get my hands dirty first, figuring out the best way to approach this huge custom build before me. I spent the first couple of weeks working on both projects simultaneously: first came the other project (it was launching over a month before Savvy). Once I checked off my list of tasks for it that week, I shifted gears to work on Savvy as much as possible before the week’s end.
It took me a couple of weeks of experimental development to figure out the best way to proceed: one piece at a time. As I slowly and carefully worked through this process, I figured out that our original plan would need some adjusting, and that all of the separate components weren’t natively integrated with each other. After I considered the completely custom elements that would need to be built from the ground up, I knew the only way to get the site done was by creating a sturdy foundation, then layering on one additional item at a time.
Once I had a plan for approaching development of The Savvy Community, I wrote out a week-to-week timeline that would carry me right up to the delivery date for the testable site concept, knocking out each crucial component in the right order. I stuck as close to that plan as possible, even though it required a lot of late nights, early mornings, and weekends spent holed up in my office. I was able to deliver the testable site a week before the original deadline, so we could get started on revisions before the Christmas and New Year holidays.
The Results
A few weeks, a little testing, and a lot of revisions later, The Savvy Community officially launched. Despite the large number of new visitors to the fledgling site, there were nothing more than minor, easily fixable hiccups, none of which hindered the success of the first round. Over 200 Savvies raised their hands and joined the membership site in twelve days.
Desktop screencaps
Mobile screencaps
The client's opinion
Irene Hardy, Magnoliahouse Creative
What made you decide to work with a web developer? Describe the moment where you knew it was time to work with one.
“I am not a developer, but I want to provide my clients with truly custom designs, so I've been working with developers since I started my business. However, it took me until I was two years in to realize that I need to work with a GREAT, domestic developer, instead of inexpensive overseas developers. After yet another round of revisions, where I was paying the developer to fix things that should have been obvious, and still coming back with more errors, I knew I needed to find a true partner, not a virtual freelancer.”
What went into choosing the developer you would work with?
“Well this one is easy! I knew I needed a talented, dependable, capable developer with great communication skills to make this happen, and so I wasn't willing to work with anyone but you!”
How did it make you feel to outsource the coding, so you could focus on design?
“Amazing! SO freeing! Instead of having to focus my designs on something easily create-able, or something that would be easy to implement from a standard theme or framework, I was able to truly focus on creating custom designs for my clients.”
How did you find the experience of working together to create results for your client?
“It was amazing, as always...it was so great to truly work together to serve the clients needs.”
How has working together transformed your business and how you work with your clients?
“Working together has allowed me to be a much better designer, since I can put my clients' objectives first, instead of feeling limited by the development options. I'm able to take on more ambitious projects and really elevate my client experience.”
What was the most positive thing about working with me on this project?
“No stress!! I knew you were going to get the work done and done well. I could hand off my designs and know you were executing them beautifully, without me having to double check everything, micromanage or write a 20 page PDF outline all the obvious information.”
How did your client respond to the finished product?
“Absolute OBSESSION! She loved the site, had a great launch, and was so proud of the results.”