San Diego Humane Society
Objective: This is a 5 page website campaign for the San Diego Humane Society. The focus of the campaign is the traditionally hard to place animal – the cat. The “Celebrate Caturday” theme website features a Home page, and Movie in the Park event page, Feline Facts, Adoption Success Stories, and an information page.
This Website also has a Companion Print Campaign, Social Media Campaign and Web Banner Ads.
Design Process:
All of my projects begin with research about the client and finding inspiration for the design. Details on the client and project scope can be found in the Design Brief.
Mood Board
SDHS Mood Board / Inspiration
Wireframes
The next step in the process is to create wireframes for both desktop and mobile sizes. This helps to map out the designs and get a feel for the flow and user experience of the site.
Home Page Wire Frames
SDHS Schedule Wireframes
SDHS About Wireframes
SDHS Feline Facts Wireframes
SDHS Success Stories Wireframes
Mockups
Once the wireframes are complete, it’s time to add some fun! Using the mood board for inspiration, colors, fonts, graphics and images are added to create a fun, lively site.
SDHS Home Mockups
SDHS Schedule Mockups
SDHS Feline Facts Mockups
SDHS Success Stories
SDHS About Mockups
Coding
When the design mockups are finished, it’s time to code! I truly the design process, but translating the designs into a functioning site is like working magic. I love bringing designs to life!
This site was built using HTML5 and CSS3 using the Foundation framework. The site integrates the Foundation Off-Canvas menu for mobile sized screens. It also features the Foundation Accordion and Modal Window features.
Facebook Campaign
The SDHS Celebrate #Caturday campaign also featured Facebook cover photos and posts to market the #Caturday Movie Night event.
SDHS Facebook Cover Photo and Landscape Post Images
Web Ads
The SDHS Celebrate #Caturday campaign featured animated web banner ads for the 2-Purr adoption special. This coupon coincides with the discount voucher included in the direct mail piece. These ads were created using Adobe Illustrator, Photoshop and Edge Animate. You must disable ad blockers to view the ads.
Companion Print Campaign
The SDHS Celebrate #Caturday campaign featured a print mailer/brochure with an adoption voucher. This is a tri-fold brochure with a semi-circle die-cut on the cover. The mailer/brochure promotes the #Caturday Night Movie event. The included money-style voucher gives a discount for the adoption of any adult cat.
SDHS #Caturday Mailer Brochure – Inside
SDHS #Caturday Campaign Brochure – Outside
SDHS #Caturday Campaign – Adoption Voucher
SDHS #Caturday Brochure Assembled