Wellspring Gardens (external link) is an organization in Texas that supports Christian Scientists in home environments, emphasizing spiritual growth and nurturing relationships. The family that runs it opens their community of homes to Christian Scientists seeking long-term or short-term lodging and various levels of care, from occasional help with activities to 24-hour skilled Christian Science nursing-based care.
Exploration
Every project begins with an in-depth discussion with the client to discover the purpose and goals of the project. During the exploration phase of a website redesign project, the most useful resources for me are the client’s existing website and the websites of similar organizations, which I comb through, jotting down first impressions. What works well for the site? What about the site is doing a disservice to the organization? How can the site be more user-friendly and accessible? What needs to change to best meet the new website goals?
Screenshots of the original Wellspring Gardens website
Solutions
Studying the original site for Wellspring Gardens revealed that there were a lot of good and relevant items in place, including introductory copy on the home page, a page describing the different residences, and a page for news and events. By reorganizing and reprioritizing the different elements; improving the appearance with fresh typography and colors; and adding some design details and special touches, the site would be more reflective of the warmth and orderliness expressed in the daily operation of WGs.
A primary need of the site was to make it easier to update. In the original site, news and events had to be hand-coded by the webmaster, with earlier events being shunted into a narrow sidebar, eventually to be replaced all-together. Since the activities and progress evidenced at Wellspring Gardens are the most compelling and relevant info for website users who may be considering visiting or moving to WGs, it was vital that we archive this information rather than replace it. The website was rebuilt using WordPress to make it easier for WGs staff to add news themselves if desired, and these updates are now presented front and center on the home page.
Information on the residences was also important. Larger photos of the homes were used on the Residences landing page, which features a menu at the top of the page for sorting the residences by different characteristics, such as the types of rooms available and whether they offer services such as assisted living. Clicking on a residence takes visitors to a separate page with more photos and information.
Additional design highlights
Expanded color palette and new fonts
A fresh teal green replaced the olive green on the original site. Text areas were placed on a white background to make them easier to read.
To bring in the warmth of the people at Wellspring Gardens, a lemony yellow and peachy orange were added to the color palette.
Fonts were chosen for readability on a screen. Web fonts were used to ensure the text was presented consistently across devices.
New header and illustration
As a community of homes, the set up of Wellspring Gardens may not be familiar to people new to the organization. To depict this concept, I designed an illustration (modified from stock imagery) for the header showing multiple homes intersperse with gardens. The illustration almost looks as if it was drawn by a child, evoking the casual, family atmosphere of Wellspring Gardens.
The flowers appear in small ways elsewhere on the site, including the favicon and alongside the rotating quote in the footer.
The header illustration only appears on the home page, so that the main content is raised further above the fold on inner pages of the site.
Home page blog of news and updates
The family that runs Wellspring Gardens frequently sends out emails sharing the recent activities and inspirational moments that have occurred at WGs. Since these stories are the substance of the organization, it made sense to bring these to the front of the site. These update posts also help keep the home page fresh, so that return visitors to the site are rewarded with new content.
Several posts are available on each page to showcase the activity and progress made at Wellspring Gardens.
A sticky post provides a welcome so that new visitors are introduced to the organization.
More and larger photos
In the original site, the majority of photos were relegated to a flash gallery in the corner of the header. Photos are a great way to convey the atmosphere of Wellspring Gardens, so we gave them more prominence by having them stretch full width across the top of each post on the home page.
More photos were also included on the inner pages, such as Activities and Services page (external link).
Rotating quotations in the footer
The original website used a long, inspirational quote to express the spirit behind Wellspring Gardens. I moved the inspirational quote from the left side of the home page, thus freeing up that prime screen real estate. The quote now appears in the footer, where it can add to the design without being the primary focus.
I also expanded the quote feature, making it a selection of several quotes which rotate randomly when the page is refreshed or a new page visited, so there is always something new to engage the visitor’s attention.
