Case Study: Refresh Website with Responsive Design

Website Developer for New Website (2015)

CBM of Maryland has provided a range of children's ministry services, including Summer camp, since 1935. The webmaster wanted to convert a Dreamweaver static page website, seeking advice and assistance building an Avada-themed WordPress site. The organization has several paid staff and volunteers who plan to be content contributors to the site. 

My role involved discovery and design, building wireframes, graphic design of site icons, a sitemap, building the image sliders, menu navigation, online donation form integrated with PayPal, and page layout. Additionally, I built a full web administrator guide and a Google Analytics dashboard to display website statistics.

Sitemap

Web page table organization

Design Considerations

• Select a font, color schemes and icons with a "kid-friendly, brighter" direction - introduced multi-colored ribbon across home page with single color branding on top-level pages. Used Adobe Color to find color scheme.

Document Colors - Option #1 (underground)

Primary Color	Secondary Color	#3	#4	#5
Blue	Green	Yellow-Orange	Orange	Red-Orange
364A73	518C86	F2C166	F25835	F23E2E
54 74 115	81 140 134	242 193 102	242 88 53	242 62 46
button shade 495672	button shade 6a8c86

Design Icons - Camp and religious concept

Home Page Design

• Use IAO Medical Ministry for design consideration and layout
• Use a Maryland map behind main content section on home page (see Medical Ministry site)
• Make sure home page slider is responsive

Design Page - Wireframe - Top-Level Page (Get Involved)

Launch Date:

March 23, 2015

Live Site URL:

http://www.cbmmd.org/

Design Tools:

• Google Draw for wireframe and sitemap documentation
• Adobe Color CC for color scheme and manipulation
• Adobe Photoshop CS6 for page icon design
• Chrome Developer Tools for CSS element discovery and modification
• Google Analytics for website statistics

Content Management System:

WordPress 4.1.1

Site Theme:

Themefusion's Avada was selected because it's one of the most popular and versatile WordPress themes. The theme has a built-in mobile-friendly design, flexible styling and navigation, easy Google Analytics integration, along with state-of-the-art image sliders. 

Site Plugin Modules:

• Gravity Forms and Gravity Forms PayPal Add-on
• Contact Form 7
• Media Replace - Allows replacing media without deleting and uploading.
• Mailchimp for Wordpress plugin provides integration with the After the Harvest Mailchimp listserv so supporters can sign up to receive an e-newsletter maintained on Mailchimp.

Project duration and labor:

The project took about 60 hours over 2 months

Google Analytics:

Google Analytics chart through April 1, 2015

---

Salesforce Implementation for Online Donations

After the Harvest, a new hunger-relief organization in Kansas City, wanted a solution to track volunteers, financial donors, farmers, and pantries in a single database. My role on the project was to establish and execute a vision for a constituent relationship management (CRM) system that integrates with the organization's website that I built in August 2014. My work also included overseeing the Salesforce installation by another volunteer on the team, installing and configuring the Click & Pledge Salesforce applications, defining and testing online donation forms, then integrating the forms with the WordPress site.

The group was looking for a way to accept online financial donations, as well as a way for volunteers to create a volunteer profile and signup for volunteer events. Based on the vision After the Harvest selected Salesforce, a leading CRM solution that provides free licenses to non-profit groups through their Non-Profit Starter Pack option. They also chose Click & Pledge, a company that provides online and mobile tools for donation and event management integrated with Salesforce. This solution was the least expensive with a small monthly cost and online transaction fees.

After the Harvest has a common challenge to managing the organization's

data and information.

After the Harvest started their non-profit organization in May 2014 working to glean produce from fields and orchards to deliver to area food pantries and soup kitchens.

Many established organizations have multiple databases to track their constituencies, which makes it difficult to transition into a CRM system. After the Harvest, like many groups, tracks CRM information using spreadsheets, forms and lists, but the start-up nature of the group makes it easier to move to a new, all-in-one database.

Phase 1 - Install and configure Salesforce to manage volunteers and financial donors

The setup of the system to accept online donations was completed in time for the organization's first fundraiser conducted on October 23, 2014. Completing it by this time allowed the group to encourage supporters to donate online if they were unable to attend the fundraising event. Training and a user's guide was prepared to instructor After the Harvest's fundraising staff to track donations.

After the Harvest donation page hosted by Click & Pledge.

Additional work to publish volunteer profile and event signup forms will complete this phase.

Phase 2 - Customize Salesforce to track the acquisition and distribution of produce.

This phase of the work for After the Harvest envisions allowing produce donors -- farmers and orchard owners -- to offer a donation online. This function will allow program administrators a way to communicate with potential donors and track the volume and estimated value of the product for tax purposes and grant reporting.

KC Startup Hunger Relief Organization Needed a Website...Fast!

Website Developer for New Website (2014)

After the Harvest is a small startup organization devoted to distributing donated farm produce to area food pantries to feed hungry people in the Missouri-Kansas area. They formed the organization after breaking ties with a national organization, and they needed to set up shop quick. The organization with two paid staff needed an efficient way to communicate with volunteers, farmers, pantries and donors. Facebook and Twitter helped, but a website was crucial for After the Harvest to build their organization's following.

My role involved organizing a discovery session, gathering photos and text from staff members, selecting the WordPress site theme and plugin modules, building the image sliders, menu navigation and page layout, as well as posting events, images, and other content. Additionally, I built a Google Analytics dashboard to display website statistics.

Launch Date:

August 4, 2014

Content Management System:

WordPress 3.9.1

Site Theme:

Themefusion's Avada was selected because it's one of the most popular and versatile WordPress themes at a cost of $55, the only cost for the website project, including all donated labor. The theme has a built-in mobile-friendly design, flexible styling and navigation, easy Google Analytics integration, along with state-of-the-art image sliders. 

Site Plugin Modules:

• Timely All-in-One Event Calendar 
• Contact Form 7
• Media Replace - Allows replacing media without deleting and uploading.
• Mailchimp for Wordpress plugin provides integration with the After the Harvest Mailchimp listserv so supporters can sign up to receive an e-newsletter maintained on Mailchimp.

Project duration and labor:

The project took about 1 month and 30 hours for two people. 

Comments about the website:

• VERY nice Lisa and team!  Clean - professional - great action photos....I like it a lot. Well done. -- Rob Reiman
• Really great job on the website!  It's great looking, informative and (as nearly as I could tell) all the links seem to work as expected.  It definitely supports the professional image of our organization. - Jim Merrill, After the Harvest board member
• Oh my goodness! What an awesome website! Thank you for all your hard work and dedication to it! - Gerardo Martinez, After the Harvest board member
• I so agree, it is fantastic. Great job Matt, Derek and Lisa!! - Mark Smith, After the Harvest board member.
• This is really great. Thanks to you, Matt and Derek for your hard work. It paid off with a beautiful website! -- Sally Luck

Google Analytics:

Google Analytics chart through September 23, 2014

---