CONTEXT
Orange Tree House is an alternative wedding venue based in Greyabbey, Co.Down. With their popularity growing steadily every year, I felt like their website was in need of an update to represent the professionalism and great service they offer.
ISSUES WITH EXISTING WEBSITE
+ Unappealing due to lack of imagery and doesn’t portray the elegance and sophistication of the venue due to colours and font choices.
EXISTING LANDING PAGE  (BROWSER)
EXISTING LANDING PAGE (BROWSER)
+ Overall inconsistency and messy/ unnecessary CTA's​​​​​​​​​​​​​​
+ Very text heavy with layout and paragraphing issues. 
EXISTING LANGING PAGE (BROWSER)
EXISTING LANGING PAGE (BROWSER)
EXISTING LANGING PAGE (BROWSER)
EXISTING LANGING PAGE (BROWSER)
+ Wanes in comparison with competitors.
COMPETITOR'S LANDING PAGE (BROWSER)
COMPETITOR'S LANDING PAGE (BROWSER)
COMPETITOR'S LANDING PAGE (BROWSER)
COMPETITOR'S LANDING PAGE (BROWSER)
EXISTING LANDGING PAGE (MOBILE)
EXISTING LANDGING PAGE (MOBILE)
COMPETITOR'S LANGING PAGE (MOBILE)
COMPETITOR'S LANGING PAGE (MOBILE)
COMPETITOR'S LANGING PAGE (MOBILE)
COMPETITOR'S LANGING PAGE (MOBILE)
BRIEF
Design a responsive website that appeals to the target demographic for the brand as well as honouring the nature and personality of the venue.
DESIGN OUTCOME
I decided on an infinite scroll design which expands across both browser and mobile views, with responsive layouts allowing the same look, feel and experience for all website visitors. Immediately the viewer can read the history and story of Orange Tree House as well as download their brochure for package prices and check availability all on the same screen. I played with the hierarchy of information, splitting the original body text into smaller paragraphs which entice the viewer rather than overwhelm them.

NEW DESIGN - INFINITE SCROLL

IMAGERY
Imagery is incredibly important when promoting a wedding venue as the viewer wants to see all that it has to offer and to imagine themselves within the space. It was beneficial that this wedding venue already had a promotional video on their website, which allows the viewer to see all aspects of the venue without filling the page with large images which can affect it's speed, overall performance and therefore viewer experience. I included this video on the landing page so it would be the first thing the viewer would see when they visited the site. I then included a small carousel gallery underneath showcasing some of the highlights of the venue such as outside appearance, inside appearance and the spectacular views which could be a selling point for people.

UPDATED LANDING PAGE IMAGERY

STYLING CHOICES
For all text, I chose a more elegant serif font style - Cormorant Garamond - which I feel pairs nicely with their logo. For the colour scheme I tied in colours from the venue itself with a soft sage balanced with a dark grey and white. I also wanted to keep it visually interesting with the use of padding to highlight key points for the viewer such as how many guests they can hold or their new guest house extension and to also split up the page in order to prevent it from looking stagnant.

COLOURED PADDING HIGHLIGHTING KEY POINTS FOR VIEWER

CTA'S
An issue with the original website was that the CTA’s looked cluttered and messy on screen and so across all platforms I knew this needed rectification. I increased the size and changed the signifier of the brochure download CTA to be something more recognisable for the viewer and changed the menu layout, which now appropriately appears as a burger menu on mobile view in the correct location. I added their contact details in the header and footer of the page so that it was always accessible for the viewer.

UPDATED CTA'S - CLEARER AND MORE RECOGNISABLE
ORIGINAL BROCHURE DOWNLOAD CTA (BROWSER)
ORIGINAL BROCHURE DOWNLOAD CTA (BROWSER)
UPDATED BROCHURE DOWNLOAD CTA (BROWSER)
UPDATED BROCHURE DOWNLOAD CTA (BROWSER)
MOBILE & TABLET VIEWS - CLEARER CTAS AND RESPONSIVE DESIGN

MOBILE VIEW

TABLET VIEW

CONCLUSION
When starting this project, I went through a number of interpretations before settling on this design. I feel my final design brings attention to the necessary information effectively and is now fit for purpose. The page now has an overall elegant and wistful appearance which brings it on a par with its competitors whilst honouring the individuality of the space.

PRELIMINARY LOW FIDELITY MOCKUPS

PRELIMINARY LOW FIDELITY MOCKUP

AESTHETICS NOW ON A PAR WITH COMPETITORS
Back to Top