CASE STUDY
Castello Boutique Rooms
Digital Experience Transformation
Overview
This is not a redesign. It is a shift from an unstructured, outdated experience to a clear, intentional digital product. Not just better looking. More controlled. More precise. More meaningful.
before-desktop
Before: Desktop Experience
Generic structure. No hierarchy. Navigation without direction.
The site felt like a template — not a place.
after-desktop
After: Desktop Experience
Clear structure. Defined hierarchy. Space that allows content to breathe.
before-mobile-menu
Before: Mobile Menu
Standard hamburger menu. Functional, but forgettable.
after-mobile-menu
After: Curtain Menu
The mobile menu was not designed as a simple navigation layer. It was designed as a stage.
Instead of a standard slide-in motion, the menu unveils — like a curtain.
The transition controls pacing, creates anticipation, and transforms a functional action into an experience.
Navigation is no longer just supportive. It becomes part of the site's identity.
This approach elevates perceived quality and differentiates the product from typical hotel templates.
before-gallery
Before: Gallery
Flat grid. Images without relation.
after-gallery
After: Gallery
The gallery was not designed as a collection of images. It was designed as a sequence.
Instead of a flat grid, a structured flow was created to control how content is revealed.
Through controlled transitions, subtle distortions during movement, and emphasis on the active frame — user attention is intentionally directed.
Images are not equal. Each one plays a role in the overall narrative.
The result is not just better presentation. It increases dwell time, improves spatial understanding, and creates a stronger emotional connection with the property.
before-map
Before: Map
Static Google Maps embed. Generic. Functional.
A placeholder, not an experience.
after-map
After: Interactive Map
The map was not designed as a location tool. It was designed as an exploration experience.
Instead of a static Google Maps embed, a fully custom interactive system was built to express the relationship between the property and the city.
Through dynamic points of interest, connections between locations, and hover and focus states that guide attention — the user does not simply "see" the space — they understand it.
Information is not dumped. It is revealed.
The result transforms the map from a utility into an experience: increasing interaction time, sparking curiosity, and creating a sense of destination before booking.
Performance as Design
Performance was treated as part of the design, not as a final step. The experience was built to be fast, stable, and responsive at every interaction. Speed is not just a technical metric. It is part of perceived quality.
Metrics from homepage via Google PageSpeed Insights (mobile).
SEO as Part of the Structure
SEO was not treated as a separate layer, but as part of the site's architecture. The focus was on: The goal was not over-optimization, but a clean and understandable foundation for both users and search engines.
- Semantic structure
- Clear content hierarchy
- Performance and Core Web Vitals
Color Palette
The palette is based on real elements of the space — the tone of the plaster, the green of the wall, and the curtain color translated into the menu. Colors are used with restraint, supporting the typography and overall experience.
Experience Direction
The design was not based on decoration. It was based on a system.
The experience does not dump information. It reveals it.
Rooms are expressed through color. Navigation behaves like a stage. The menu opens like a curtain.
Scroll does not move content. It reveals it.
Every interaction has intent. Nothing is accidental.