FincaCarpeDiem.com has a new face and I believe it showcases this jungle oasis very well. The old site was due for an upgrade and not just a facelift. I worked tirelessly on structuring the content and creating an intuitive, responsive, and clear experience that would answer any questions Finca Carpe Diem’s guests would have. Without further ado, the following is a list of some of the new features on the website!
Activities
The main attractions of Finca Carpe Diem are the variety of activities you can do in and around the hostel. With everything in walking distance and no local activities further than 1.5 hours away (minus the longer walks), it’s in my opinion one of the best places to enjoy lots of what northern Colombia has to offer in the neatly wrapped area of Paso del Mango.
Finca Carpe Diem activities grid
Activities Grid
I tried to really show the quantity of activities by allowing the user to view them in two different views. First, the activity grid which is, as it’s named, a grid of activities sized into small thumbnails. When you hover over a thumbnail, the name and distance slide in from the bottom so you never forget of what you’re looking at.
Activities Map
Second I displayed the activities in map form (locations roughly positioned). This really helps us get across how close everything is and how it’s easy to combine activities together. Here you can click on the markers to get more information about the activity. It is also easy navigate to that activity’s page from the marker’s info window.
Finca Carpe Diem Activity Map
Finca Carpe Diem Activity single page
Activities Single
When looking at an activity’s page, I wanted to make sure that the user would have as much information as possible to make an informed descision on whether they wanted or could do the activity. I included information such as distance, time to, duration, difficulty, price, a gallery of images, a breif description about the activity, hostel and tour recommendations near the activities (for regional activities), and various icons to breifly describe what the activity entails. I also wanted to make it really easy communicate with Finca Carpe Diem by adding the contact form in the sidebar to the right.
Just as important as the activities are the rooms that Finca Carpe Diem offers. As they try to appeal to both the economical and luxurious travellers, I wanted to display the rooms from every conceivable angle to make it easy for the user to have a good idea of the structure, volume and contents of the rooms.
Finca Carpe Diem Room Single
Room Single
I really wanted to supply as much information as possible to allow the visitors to make the hard decision of whether they should splurge more on a private room or go more economically by staying in the dorms. The site shows the price and photos as well as information such as checkin/checkout times, a brief description of the room, icons that visually describe the features of the rooms, number of people it accommodates, size of bed, and whether the bathroom is private or shared.
Another standout feature I’ve added to the single room pages and throughout the site is the ability to request a booking through an easy to use booking form. You can find it in the sidebar of the single room pages as well as at the top right of the main navigation bar throughout the website.
Finca Carpe Diem has a restaurant with some amazing food! In a colaboration between Belgain and Colombian cuisine, they offer many options for breakfast, lunch, dinner, snacks and drinks. I also felt it necessary to highlight some of the important features of restaurant through large banners that are found in between menus.
As Paso del Mango is such a diverse and beautiful area, Finca Carpe Diem felt it was their duty to give a first hand narrative on the various activities and locations found throughout the region. Make sure to either check out their older posts or keep an eye out for their newer ones as they give their opinions and thoughts on their experiences in and around Finca Carpe Diem and Paso del Mango.
As users are visual and like looking more than they like to reading, I wanted to make it easy to view various photos of the facilities and activites in and around Finca Carpe Diem. For this reason, I added a simple photos page where the thumbnails flow seamlessly on the right as clicked photos swap the main photo out on the left.
Finca Carpe Diem is an active contributor to local workforce however they believe that volunteering is something every traveller should experience. For this reason they really wanted to show what you get for volunteering and helping out the local workforce here at Finca Carpe Diem.
Getting here can be quite an adventure for some so I wanted to outline the various methods of getting here by displaying intuitive instructions and making it easy to request a door to door shuttle service. I also added a map showing the location relative to the nearby towns of Santa Marta, Palomino and Minca.
Localized version of the rooms section on Finca Carpe Diem’s website
As some of you may have noticed, the website is in both English and Español! With easy to use toggles located at the very top and very bottom of the pages, once a language is selected, it remains for the duration of the session. Unfortunately localizing is a lot of work so not every page has been translated. The posts for example remain in the native language that they were written.
Exploring the blog of Finca Carpe Diem on a laptop
I originally found Finca Carpe Diem on Workaya.net while i was searching for hostels that needed a new website. After arriving, I immediately got into the meat and potatoes of site building. I made an inventory of what they had in terms of content and, to be frank, there was a lot. Over a dozen activities, eight rooms, a restaurant with many options, ambitions for creating and maintaining a blog, and the list went on. I sat down, trimmed the fat and started with the wireframing process.
Wireframing & Design
First draft wireframe of the Finca Carpe Diem Website
When I finished with gathering content, I started wireframing and designing the site. Wireframing is much like a blueprint except completely unsaturated and focused on content flow and positioning. It was great for determining exactly what the goals of the pages and sections were. It was also essential for determining wether or not I needed to add call to actions (buttons) and other types of content funnels.
Design (pre color change) of the Finca Carpe Diem Website
After the wireframing was complete I entered into the design phase. Using the wireframe as a backbone, I started adding color, fonts, images, and consistent sizing and margins to the various elements and sections throughout. Everything went smoothly due to the constant transparent communication between Kobe and I. When the design was complete, we sat down and went through it. We made minimal changes and I dove straight into the development phase.
Development
Developing (Coding) Finca Carpe Diem’s Website
Being that we’re in the middle of the jungle with internet is nothing short of amazing. That being said, there were many thunder storms that knocked out power which made it difficult to rely on the web for development. In response I developed it locally on my machine without the need for connection. This sped up development dramatically as there was seldom any interruptions. After I finished development, we went through various tweaks and changes and then launched it softly (launched it without telling anyone).
We started slowly by verifying prices and facts, replacing copy-written photos with our own, and creating and publishing posts on the blog. Now, with the site nearly complete, we’ve been posting blog posts to the Facebook page.
Site Development summary
Finca Carpe Diem website on laptop
It was an extremely diverse project being that it was for a finca/hostal/eco reserve/activity hub. The content diversity in my opinion was one of its strengths. While building it, I never grew tired of the site as a whole. When I grew tired of working on a feature, I was able to easily switch to another. The following was the timetable relative to the construction of the site:
Task
Duration
Content wrangling
0.5 weeks
Wireframing
1 week
Designing
1 week
Development
2 weeks
Localization
2 weeks
TOTAL
6.5 WEEKS
Roughly 6 – 8 hours per day
If you enjoyed using the new website and/or have any thoughts or recommendations in terms of features you think would help users better understand Finca Carpe Diem, send us a message.
Let me know what you think!
If you enjoyed using the new website and/or have any thoughts or recommendations in terms of features you think would help users better understand Finca Carpe Diem, send them a message on the Contact Page.
Vincent is a travelling web developing Canuck who enjoys nature almost as much as he enjoys programming. In his off times, he can be found venturing out into the surrounding jungles and camping/hiking. He has been with us for just over 2.5 months now and has plans of continuing on north from Panama to Mexico.
On his current trip he’s also visited Bolivia, Perú, and Ecuador where he’s also done various volunteering jobs. When he returns to Canada, his plans are to study game design and create interactive experiences that encourage youth to travel and explore our large and beautiful world!
Beautiful 35 m2 ecohut in the middle of the the hills, surrounded by lush forest. An incredible pool at only a few meters outside the cabin. Indigenous styled roof, made with palms from the tropical forest. Nice private bathroom with all services and trimmings, very comfortable king size mattress of the best quality and special...
An elegant 30 m2 room with airconditioning, king size high quality mattresses and private bathroom. Great for couples who are looking to have a peaceful, clean and intimate space. Very comfortable king size mattress of the best quality and special fabric to protect yourself in case of any insects. Some nice furniture within the room...
A quaint 28m2 room with airconditioning, 3 comfortable high qulaity beds/mattresses and private bathroom. Located just to the side of the main courtyard, it is close to both the pool and the restaurant yet far enough away that noise is not an issue. Some nice furniture within the room and a private terrace outside.