In the TWD program at BCIT, the final project required working within a team of three others to create a website using wordpress for a real life external client. The business that we worked with was called Cedarside Coach House - a vacation rental located on the beautiful Sunshine Coast. Although they had an existing static website, it had not been updated for over a decade. Therefore, we decided to start from scratch and completely redesign the website into a fully functioning, responsive, and dynamic platform that would allow the client to change content by themselves whenever they needed to in the future. This project was a great opportunity for us to enhance the skills we already had from the past several months. It also pushed us beyond our comfort zones and helped us gain experience in dealing with both the client, and fellow workmates. Overall, at the end of the project I was much more confident with using content management systems like wordpress as well as coding in teams using version control systems such as GitHub.
Our challenge here was to take what content the website had now, and update it so it would be more clear, comprehensive, and ultimately user friendly. Using the UX design methods we had learned in class, we created content lists, an information architecture, and wireframes for both desktop and mobile. By organizing the content first it was easier to communicate with the client and discern what their needs were for the pages and content of their website.
For Cedarside, the client wanted to have a clean, simple look, while maintaining a calming earthy vibe. We wanted to design something that would capture the charming feeling of Cedarside as well as the Sunshine Coast. By avoiding overly modern fonts, and choosing colors that reminded us of the natural surroundings that make up this area, we were able to successfully create an inviting atmosphere that would draw people in and give them a taste of what they could experience if they took a trip to Cedarside.
The Client wanted to keep their orgininal logo, as they felt it was suitable to their business and had sentimental value. They were willing to have adjustments made to the logo, however the only file available was a small jpeg file. Using illustrator we were able to trace the image and create a new svg file of the logo. Not only did this make the illustration much more crisp, but it also gave us the ability to change the shape and give the logo a new color, all while keeping the original look that the client wanted.
Updated SVG Logo
Since we were building a custom theme for our client on wordpress, we spent a lot of time working in functions.php creating custom post types and taxonomies as well as building other features such as adding image sizes.
One of our custom taxonomies in functions.php
Creating custom image sizes and displaying them as a responsive image using the image as ID feature
In the end we were able to create a clean, responsive website that appropriately reflected the feeling of our client's business. Another advantage is that because we made the site dynamic, the client will have the ability to change content wherever needed or added images to the gallery.