Skyfield Ranch

Project Deliverables: Responsive website design

My Role: Creative Direction, UX/UI Design, graphic design, and writing

Skyfield Ranch is a rustic event venue located on the prairies of Alberta, Canada. Skyfield offers a unique experience for events, blending nature with modern convenience that guests won’t forget. Their main focus is on providing a unique and memorable location for weddings and wedding receptions.

Many wedding venue booking websites are confusing and don’t offer clear information on pricing and how to book for a specific date. Our goal for the Skyfield Ranch website was to let users quickly and easily see pricing information, and when the venue is available to book.

The website has a warm and romantic design, featuring beautiful images of the venue's natural surroundings and rustic architectural features. The main page includes a carousel of photos showcasing the various spaces available for weddings, as well as a brief introduction to the venue and its amenities. The navigation menu includes detailed information about the different spaces available for weddings, a "Gallery" page with photos of real weddings held at the venue, and a "Contact" page with information on how to book the venue and get in touch with the staff.

The website is mobile-friendly and easy to navigate, with clear and concise information about the venue and its services. It also includes a user-friendly booking system, allowing potential clients to check availability and reserve the venue online.

The goal of the website is to provide a professional and engaging online presence for the rustic wedding venue, and to help generate interest and bookings from potential clients.

User Research: Summary

I conducted interviews and created empathy maps to understand the users that I am designing for, and their needs. A primary user group identified through this research was young working adults who don’t have the time or budgets to submit wedding venue bookings online.

This user group confirmed initial assumptions about Skyfield Ranch customers, but research also revealed that time was not the only factor limiting users from booking a wedding venue. Other user problems included interests, obligations or challenges that make it difficult to price and book a venue online.

User Research: Pain Points

• Pain point 1: Working adults are too busy to spend time online researching wedding venue pricing, especially as most websites do not clearly display pricing.

• Pain point 2: Text-heavy wedding venue booking websites are often overwhelmingly difficult to read and navigate.

• Pain point 3: Online booking systems are confusing to navigate and don’t offer suggestions if the user’s chosen wedding date is unavailable.

Stephen is a busy freelance videographer who needs to quickly see whether a venue is available on a certain date, because his wedding date has already been chosen and can’t be changed.

Emily is a busy office manager who needs clear, easy access to pricing information because she’s on a strict budget for her wedding planning.

I then moved on to create digital wireframes of my initial concept screens. Here I was able to refine the visual designs by implementing a grid system and establishing a visual hierarchy of elements. I also started to better understand the user journey from screen to screen within the app.

I began to establish a basic layout for the main pages of the desktop website. Here is the photo gallery page, featuring a large showcase image, with a carousel of smaller thumbnails below that a user can scroll through to get a better idea of the look of the venue.

The prototype connects the user flow of reviewing pricing, choosing a date, and booking the venue, so the prototype could be used in a usability study with users.

Here are the main findings that we made during our Skyfield Ranch website usability studies:

Round 1 Findings

• Users want clear, accessible language, and lots of high quality photography

• Users want to see suggestions for available dates if the one they’ve selected isn’t available

• Users want to see clear, unambiguous pricing information (no hidden costs)

Round 2 Findings

• Users want suggestions on alternative dates for booking

• Users want readable text (high contrast, not too small a typeface)

• Users want a shortcut to ‘contact us’ page for further inquiries

Early designs had the functionality we were looking for, however the text was far too small, and navigation elements were too difficult to click on. I cleaned up the navigation, made text and clickable elements far larger, and included high quality photography and a soft, delicate color palette. We included a call-to-action with the ‘Book Now’ button on the top right.

Users wanted to quickly and easily see if their chosen wedding date was available to book. We included an easy-to-click calendar system, as well as suggestions for nearby dates if the one they chose wasn’t available to book. We also allowed them the option to change their wedding date selection at any point throughout the user flow process (low-fidelity wireframes on top, high-fidelity mockups below):

The high-fidelity prototype for the Skyfield Ranch booking website follow the same user flow as the low-fidelity prototype, including the design changes after the usability.

1. Provide access to users who are visually impaired by increasing text size and contrast

2. Use high quality and large imagery showcasing all aspects of the venue to help users better visualize the wedding venue space and how it could function for their own wedding.

3. Include alt text to all images for screen readers.

Impact: The website makes users feel like Skyfield Ranch really considers how to meet their needs.

User quote from peer feedback session: “This is the first venue booking website I’ve used that provides clear, concise information on pricing! I love it!”

While designing the Skyfield Ranch wedding venue booking website, I learned that the first ideas are just the beginning of the design and iteration process. Usability studies and peer feedback greatly influenced every step of the iteration process and the design of the site.

• Conduct another round of usability studies to validate whether all of the pain points identified in the first study have been effectively addressed.

• Conduct further user research to identify and determine any new areas of need.