About the Project
Your Faith Your Finance is a informative resource providing information on ethical banking from a Christian context. I helped design and develop the website.
As the lead designer and developer, I created a bespoke design to suit their needs, and then developed it into site with a customisable CMS back-end. The design went through a number of different versions before reaching development stage, being signed off by a number of people. My job was collating all the thoughts and ideas in order to steer the site towards it’s final goal of being an easily accessible resource.
I settled on a bright inviting design with a background image of hills and clouds I designed, with sidebar items in a yellow or blue with calming rounded corners.
Responsitivity and cross-browser compatibility were some of the most important features. Due to the audience, and despite being built with HTML5 and Css3 components, the site had to be developed with a logical structure that could roll back and strip itself down when used on an older browser.
The design does this effectively as
border-radius, and transparent
rgba background colours fall back to less pretty but still functional hard corners and solid colours.
With particular attention spent on allowing the site to work on any sized screen, all the elements of the page would resize and shrink down, stacking on top of each other when there was no horizontal space left.
None of the content was written by me, however I did help with two important aspects of the content. The site map, and uploading the content.
The team already had a good idea of what the site map needed to look like, but were open to my suggestions of splitting sections into multiple pages. The site became more like reading a page of a book at a time, rather than never-ending broadsheet newspaper. This allowed particular sections to be shared easier with friends and family, directing them to the individual topic faster.
The content consisted of around 140 separate pages to be organised in parents, children and grand-children pages. This relationship between pages was then replicated in the navigation.
Dynamic Widgets and Menus
To help with the flow of the site map, each section had a sidebar menu showing just on that sections. Certain individual pages had quotes relating to their content, which were added generically, but displayed dynamically.
Top level pages also featured a slideshow showing images relating to the section at hand.
View the live site: Your Faith Your Finance