Surf's Up - Award Winning New Site for Kalon Surf Delivers Killer UX

Building on a massively successful multi-year PPC campaign Kalon Surf, a luxury resort in Costa Rica, looked to Portent to build a website that would showcase its natural beauty, unrivaled guest experience, and pristine aesthetic.


Design & Development


Search Marketing
Brand Website




A Major refresh of the Kalon site could simplify user experience while showcasing brand essence and guest experience to increase conversion


Kalon, a luxury surf resort in Costa Rica, came to Portent after a successful multi-year PPC campaign with a need to update their website. The previous iteration had significant room to improve in both design and functionality, and the user experience was detracting from brand image as well as conversions. They needed a digital presence that effectively told their story, provided a compelling user experience, translated their brand identify, and allowed their team to easily update content.

Surfer at sunset in Costa Rica - for a new website build

Portent worked with Kalon to produce an updated brand identity built from the bottom up, incorporating video and photography into their new design. We added layers of cutting edge technology as we built the site that would enable their team to manage content easily while also providing a blazing-fast experience for their customers.

A new website for Kalon Surf a surf resort in Costa Rica
W3 Gold Award for Hotel and Lodging from Portent a Seattle-based digital marketing agency

Gold W3 Award - Best Web Design in Hotel & Lodging

For Kalon, experience is everything. Their customer’s journey starts when she is picked up from the airport and ends when she’s dropped back off seven days later. While she’s there, she lives the Kalon lifestyle. This means serene water, lush jungle, gorgeous beaches, exquisite food, and pampering accommodations. It was imperative that the website experience mirrored this journey. We went through a thorough conceptual design process to ensure that their new site would be everything Kalon.

Portent’s visual design work for Kalon included:

New Brand Guidelines

Portent created a new palette that helped mature the Kalon brand without losing their youthful energy: beiges, whites, and blacks were added to their previous pinks, blues and greens for a color scheme that’s both classic and intrepid.

Imagery-First Design

From placing video and imagery at the center of design to better tell the immersive story of the Kalon experience, to commissioning new drone and other video footage, rich media was at the center of this design project.

Double Stranded Modular Scale

The Kalon site now features a double stranded modular scale (the golden ratio and minor third) for sizing and spacing to create visual hierarchy for text and element size. These natural scales create the visual harmony that is so important to the world of surfing and Kalon.

W3 award for best practices Kalon Surf and Portent a digital marketing agency in Seattle

Silver W3 Award - Best Practices in Website Features

Kalon prides itself on providing a flawless experience for customers that’s only achievable through optimizing all the parts of their hospitality. Naturally we wanted to provide the best functioning website through the same attention to detail by using the most state-of-the-art technology.

Progressive Web App

Portent built the Kalon site with progressive web app functionality including browser based notifications.


Although HTTP2 and a secure site aren’t primary SEO factors, they help tremendously with site speed which is a secondary SEO factor. It’s also proven to have a major impact on user experience. The overall speed of the new Kalon site is blazing fast.

Lazy Loading & Code Based Effects

To provide the user with a near-instant download, all visual content utilizes lazy loading which allows the image to initially load a slightly pixelated form and quickly become crisp. We provided a fully fledged responsive image solution where the system delivers the right-sized image to each requesting browser and device.

To provide the optimal SEO-friendly content and to prevent responsive issues, all effects and copy over images are code based.

Component Driven Back-End

Portent built Kalon’s CMS using a component driven content solution which allows their marketing team to easily drop in new components rather than work through HTML. It is extremely easy to add, update, and delete elements of the site without having to deal with code.

W3 Award for best practices in web development for a surfing school by Portent a Seattle based digital marketing agency
Start call to action

Tell your brand's story with a best-in-class digital experience.

End call to action
Close search overlay