Back
Web Platform · Hospitality

Village Porto de Galinhas Website

Client
Village Porto de Galinhas
Role
UX/UI Designer, Art Director
Summary
Website design for Village Porto de Galinhas, a beachfront resort on one of the most famous beaches in Brazil, renowned for its warm, crystal-clear waters. The goal was to create a UI inspired by local craftsmanship that would load fast, perform well on mobile, and bring the resort's personality to the screen.
UI Design and UX Design project intro — Village Porto de Galinhas logo and colorful brand mark over vibrant aerial beach photography from Porto de Galinhas showing crystal-clear turquoise waters and a traditional jangada sailboat with a red sail.

Problem

Village Porto de Galinhas needed a website that captured the hotel's personality and its connection to the local culture of Porto de Galinhas. The challenge was to create a visually distinctive design inspired by regional craftsmanship while keeping the experience fast, responsive, and easy to use on mobile.

Solution

The visual design drew from local craftsmanship, using organic shapes and colors that felt native to the destination. Performance was a priority from the start, with fast loading and clean mobile navigation built in alongside the visual work.

The interface showcased the hotel's colorful architecture, tropical setting, and beachfront experience through strong photography and visual detail. Navigation was kept simple and direct, making it easy for visitors to find accommodations, amenities, and destination information.

Results

The site gave Village Porto de Galinhas a visual presence that felt rooted in local culture while performing well on mobile. Visitors could navigate the resort's offerings quickly, with strong imagery carrying the atmosphere of the destination.

01 Website Design — Village Porto de Galinhas homepage showing: navigation (Accommodations, Water Park, For the Little Ones, For the Big Ones, Promotions), hero section with aerial resort photography and 'a place to be happy' headline, editorial split section with pool photography, For the Little Ones and For the Big Ones family activity sections, and Water Park feature. Continued homepage — Porto de Galinhas destination section, Gastronomy and Vila do Mar editorial tiles, Accommodations grid (Apartment, Bungalow, Luxury Bungalow), Casa Village feature, Promotions banner (Children's Vacation, Valentine's Day), TripAdvisor award badge, and full footer. Interior pages — left: The Hotel page with Mission and Values sections, photo gallery, and video area; top right: Accommodations listing with three room types (Apartment, Bungalow, Luxury Bungalow); bottom right: Bungalow detail page with photography and room description. Casa Village interior page with pool and beachfront photography, Luxury Bungalow detail page with interior photography, and color palette swatches (yellow/gold, lime green, teal, white). Homepage hero close-up showing the Village Porto de Galinhas booking bar with Reservations, Check-in, Check-out, Adults, Children, and Search fields, over a desaturated aerial resort view with the 'a place to be happy' tagline. 02 Details — two smartphone mockups showing the Bungalow accommodation page with a Make Your Reservation booking CTA and resort photography, on a teal background. 02 Responsive Design — three mobile screens showing The Hotel page with fountain photography, the homepage with 'a place to be happy' hero and pool imagery, and the Accommodations page with room photography. Responsive mobile screens showing the full page scroll: The Hotel, homepage sections (a place to be happy, For the Little Ones, For the Big Ones, Water Park, Porto de Galinhas destination, Gastronomy), and the Accommodations listing with room types (Apartment, Bungalow, Luxury Bungalow) and footer. Additional mobile screens showing Vila do Mar editorial, Accommodations detail, Luxury Bungalow, Promotions with Children's Vacation and Valentine's Day offers, TripAdvisor badge, footer, and Bungalow detail page. Editorial pages — Porto de Galinhas destination section with beach photography; Gastronomy section with restaurant photography; Vila do Mar section with aerial beach photography. Clean editorial layout with gold accent headings and Learn More links. 03 Wireframes — two-column desktop wireframe layout showing the full homepage structure: left column covers hero, 'a place to be happy' section, For the Little Ones and For the Big Ones, and Water Park; right column covers Gastronomy and Vila do Mar tiles, Accommodations grid (Apartment, Bungalow, Luxury Bungalow), Casa Village, Promotions, Newsletter signup, and footer. Closing slide — villageportodegalinhas.com.br — Thanks for Watching! — irvingsuna.com — deep navy background with gold smiley face.

Want to learn more about this project?
hello@irvingsuna.com