Don’t forget about design!

A great design has the power to engage, impress, and most importantly, leave a lasting impression. A symbolic gift design is no different. Think of design as a first impression. Your site may be loaded with personality and endearing qualities, but if there is no initial attraction, it may often get overlooked.

The importance of a great design cannot be emphasized enough. How many times have you investigated something further simply because you thought that it “looked cool”? It should be noted that these ‘cool’ designs were no accident. Throughout the evolution of design, there have been many rules and principles that designers have followed in order to brand a successful design.

Over the past few years, hjc has designed numerous successful symbolic gift giving campaigns and with our successes, have developed our own set of design principles. We refer to them less formally as “Tips and Tricks”, but they are as follows:

Keep it Simple
The main idea with great design is to find the balance of a nice visual and usability. The site needs to look great, but also be very functional. Nothing will turn off a potential donor more than having a site that is difficult to use. A symbolic gift site should be very simple and have a step-by-step flow.

Navigation
The navigation of a symbolic gift site is very important as well. The main menu should be clear and concise and also appear “above the fold” (i.e. within a regular screen size without scrolling). It is also important to have only the most important information in the main navigation. A good example of this can be seen in our WaterCan ‘Gifts of Water’ site. Although the site contains many add-ons (social media, slideshow, interactive map, etc.) the main menu only contains the most vital information about the campaign. Having a ‘view cart’ and ‘checkout’ button in the header works really well too.

Featured Gifts
On the homepage, always have a section to display a few featured gifts. We like to recommend two to three, but there is no set amount. We also recommend that you vary the prices of these gifts to showcase items with low, mid and high price points. These featured gifts should link directly to the product page for that specific gift (Note: Be sure to include a link to the ‘All Gifts’ or other category pages in this section).

Categories/ All Gifts
When choosing gifts, we recommend grouping them into separate categories. The benefit of this is that you can save a lot of real estate on the homepage while still being able to offer the user different choice options. It is then also crucial to have an ‘All Gifts’ page where the user can see the entire selection at once.

Personalized cards
The best way to enhance user experience with a symbolic gift site is to offer personalized cards (e-cards, PDF cards and/or print cards). Having a minimum of three general card designs, or one card design per gift, that can be sent with a personalized message to the gift recipient is a great way to share the ‘warm fuzzies’ that go along with making a donation. It is also a great way to increase the exposure of your campaign and drive traffic back to your site. Having the card page as a stand-alone page in the checkout process is also encouraged.

‘How it Works’ graphic
A graphic located on the homepage explaining the site process is also highly recommended. This graphic, which should be simple in nature, offers a visual representation of the gift giving process. The two best options would be either a step-by-step process of how to use the site (i.e. Step 1 – Buy a gift, Step 2 – Send an e-card) or a ‘your gift in action’ explanation of how the gift will help (i.e. Your donation of $20 will help give…).

FAQs
The design of the FAQs page should also be very simple. These pages can tend to be long so it is important to put some design thought into the layout. Our suggestion is to have all of the questions be grouped together at the top. When the user clicks on a question, either have a Flash or JavaScript function to reveal the answer as seen in our OSPCA site, or have it anchored to the answer below (Note: If choosing the latter, make sure to have a [back to top] link at the end of each answer to bring the user back up to the questions).

Rotating Banner
A great way to showcase a lot of information on the homepage without taking up too much real estate is to have a rotating banner. This trend is highly functional and used more often as of late. The two development options for this would be flash or JavaScript (jquery),with the latter being much more efficient in terms of Search Engine Optimization). It is important to remember that this will likely be the first visual element the user notices, so it should showcase only important information.

Branding
It is important that users understand who is behind your symbolic gift site, but that is not an excuse to stay 100% on brand. We recommend having your organization’s logo present in the header, so it’s easily identified as your microsite, but also believe it’s important for the symbolic gift site to have its own unique brand. Don’t be afraid to explore a secondary brand, or sub-brand, by using different colours and imagery. If your symbolic gift site looks too similar to your main website, it will lessen the impact.

Checkout add-ons
The newest trend we have found to be successful is the inclusion of checkout add-ons. This step occurs in the shopping cart process after the user has added a gift. It can be thought of as a gentle suggestion to add a bit extra to their gift. As such, add-ons should have low price points to help encourage this extra step. A good example of this can be seen on our WSPA ‘Really Wild Gifts’ site.

Gift Registry / Wish List options
Another great secondary function is the addition of a wish list and/or gift registry pages on your site. Adding these features provides donors more options to use the site outside of the basic ‘gift in lieu’ function and also outside the traditional times of year or occasions. They also give current donors reason to come back year after year and new potential donors more reason to choose your site.

Campaign support
As with every great campaign, having a great supporting cast is also an important element. This could include (but is not limited to) the following supporting activities:

• Email blasts
• Email list rentals
• Radio/tv/billboard ads
• Branded web banners
• Homepage buttons that drive from the organization’s homepage to the symbolic gift site.

Checkout Forms / Cart
In design, a simple approach is almost always better and that is definitely true when designing the pages for the checkout process. These pages can be graphical in nature, but layout is the most important element to consider. For clarity, and also to help ensure conversion, they should be logical and linear. Confusion on these pages will surely lead to a lack of gift purchases. Some tips for these pages include:

• Keep the form elements stacked on top of each other. This makes it easier to follow the process.
• Make sure there is added padding (spacing) in between form fields to make them easier to read.
• Use a graphical menu at the top to show the step-by-step process and let the user know how many more steps are involved to complete their gift purchase/donation.
• Keep the forms short in length. It makes it much easier to troubleshoot if a form is filled out incorrectly.
• Make the total cost of the purchase stand out at the top.

In the cart page process, make sure to add a ‘remove item’ button as well as an ‘edit’ button (mainly for the card selection).
Make the “Checkout/Proceed/Next Step/Continue Shopping” buttons stand out. Making these graphical is a big plus.