welcome to
Selva madre

A Eco Sanctuary & Retreat Center
A small business hotel/ retreat located in Costa Rica.
Marie and Dominque contacted me to re-design their website to reach a wider clientele.

WHat is Selva-madre?

A natural eco-sanctuary designed to hold transformational experiences in the heart of the Caribbean jungle. The space provides a harmonious blend between comfort and connection to nature. Their belief is set in the healing powers of nature, in taking care of our precious earth and walking together towards the creation of a kinder, more compassionate society.

PROBLEM : The primary goal for this website is for users to understand the client’s vision and the beauty their hotel offers, so they are inclined to book a stay. The existing platform is scattered and not user-friendly. Clients are not able to book, nor does the website showcase the unique style of the hotel.

Solution : To provide a refreshing and creative interface for users, I was tasked to redesign their Home, About and Booking page. We wanted to keep the entire process simple while maintaining an aesthetically pleasing design.

Kick-Off Meeting

As the designer, I was responsible for organizing and hosting our kick-off meeting to help us get acquainted and discuss the project objective of redesigning primary screens to improve usability. I guided the delineation of tasks for upcoming deliverables, discussed additional information needed from the client, and answered questions. We reviewed the existing product and client-provided assets which included competitors, user groups, user stories, and demos.

Client Q+A

In order to better understand user pain points and client needs, a list of questions were compiled covering the product's content, features, functionality, styling, and user data. The client provided ample responses with additional assets including brochures, survey responses and a preferred color palette from which we were able to extract the following key actions:

Users should have the ability to experience the ambiance of the hotel and the sense of community they have cultivated through the website.
The website emphasizes the sanctuary's role as a retreat destination.
The website is designed with a user-centric approach, allowing visitors to seamlessly access information about the various rooms offered by the sanctuary.
To facilitate further inquiries, the website provides easily accessible contact options.

REVIEWS & FEEDBACK

“I had a lovely experience during my time at Selva Madre.”

The website and images don’t do it justice!! I’m glad I decided to book a stay

“I had an absolutely delightful experience during my stay at this hotel.”

The warm hospitality, impeccable service, and attention to detail made my visit truly memorable.

“My family and I loved the community.”

The charm of Selva Madre lies in its dedicated team and the close-knit community they have established with the locals.

Competitive analysis

A competitive analysis was conducted to familiarize myself with the product's main competitors and identify areas of opportunity. The following key insights were identified and integrated into my designs:

Ensure that the website design is clean, visually appealing, and easy to navigate
Emphasize eco-friendly practices and unique offerings prominently on the website
Capitalize on targeted marketing strategies to reach specific niches within the wellness and Eco-conscious traveler market

Personas

I created user personas for the user groups provided by the clients :

Julie is a Yoga Instructor seeking to host a retreat surrounded by nature.
The Brown family is a Eco-conscious family searching for a hotel that practices sustainability.
Jason is a photographer who is looking to photograph local community during his travels.

USER STORIES

Having gained a comprehensive understanding of the product and its competitors, I shifted my attention to three client-provided user stories that lay the groundwork for a dynamic and scalable product while inspiring a design that resonates with users:

As a user, I want to learn about the eco-friendly practices of the sanctuary, so I can make an informed decision and support environmentally responsible businesses.
As a user, I would like to view images of the space, learn about their amenities and proceed to make a reservation for a retreat.
As a user, I want to explore choices for a room and make a booking.

Site Map

By leveraging user personas and user stories, I successfully crafted a site map. The primary emphasis of our website revolves around facilitating retreat bookings, hotel stays, and providing users with insights into the sanctuary's dedication to
Eco-Sustainability and community engagement.

The main priority became :
Homepage, About page and Booking page.

User Flows

Once the user stories & site map were established, I meticulously crafted a user flow for each user story through collaboration and reviews. I advocated for the omission of unnecessary screens and interactions while balancing client needs, and industry best practices, yielding streamlined and laser-focused pathways for users to complete their goals. This process impressed upon me the importance of using established industry conventions as a guide for optimal usability.

As a user, **I want to learn about the eco-friendly practices of the sanctuary, so I can make an informed decision and support environmentally responsible businesses.**

As a user, **I would like to view images of the space and proceed to make a reservation for a retreat.**

As a user, **I want to explore choices for a room and make a booking.**

LO-FI SKETCH WIREFRAMES

After a few rounds of sketches, playing with various layout options and utilizing the clients feedback, below was our final layout. We aimed to keep consistent & clean look throughout the pages. We agreed less was more, as long as we can convey the message clearly through visuals.

MID-FI WIREFRAMES

To refine the designs, I iterated to medium-fidelity wireframes. I worked to achieve cohesion with thorough and attention to detail, allowing us to prioritize ideas and narrow focus into a clean and usable interface that balances the needs of the client and users. We added a new section- the client wanted to highlight the classes offered- after some playing around, we decided it fit best in the homepage and created a space for it.

Style Guide

A style guide was created to reflect the chosen styling and ensure cohesion throughout the design. Client’s brand colors and logo were incorporated into the site- slight changes were made to the existing text styles to improve accessibility and hierarchy. Buttons were created with varying state changes to provide clear feedback to the user. As well as grid and spacing system were established to ensure uniformity and illustrations were selected that reflect Selva Madre’s playful branding.

High-Fidelity Screens

With a finalized style guide, I was able to seamlessly apply these guidelines to all screens. Since we were working with a big color palette, I strategically paired colors together and kept it consistent throughout the site, to affirm the brands playfulness. Illustrations were placed throughout to evoke a whimsical feeling. The client provided images they wanted to use to elicit an energy of community and the space being surrounded by nature. I felt like a call to action to book button was needed on all pages, for those user’s who might already know about the space, so a BOOK NOW! button was added into the header of the website.

Redesign

In summary, I redesigned the home, about and booking page- with restructured navigation and implementation of new features such as classes offered and booking services. We refined the information architecture, color palette, and typography which was informed by client-provided user research and best practices for a more streamlined and usable experience that is responsive and engaging.

Reflection

Collaborating with this incredible client stood out as the pinnacle of my professional journey, enhancing my confidence in leadership, honing communication abilities, and refining workflow strategies to align seamlessly with project goals. In this position, I had to fine-tune my time management expertise to juggle project scope and deadlines while prioritizing client values. Furthermore, this encounter underscored the vital connection between creative ideation and efficient execution. I found the process of working on the homepage particularly captivating. Despite its simplicity, the landing page serves as a crucial entry point, and I am confident that its uncomplicated design complemented by playful details will attract the intended audience and elevate their user experience. Looking ahead, I am eager to apply the insights gained from this valuable experience to enhance future design projects.

welcome to Selva madre