03

/

05

Casa de Matilda

Landing PagePWANext JSMongoDBAWS SesMaterial UI
Project Rationale

The Background

A marketing website for Casa de Matilda with a built-in booking system, allowing guests to explore the property and schedule visits with ease.

The goal of this project is to build a booking platform for Casa de Matilda, allowing guests to schedule stays while providing admins with tools to manage bookings, events, and gallery content securely and efficiently.

Project Colors

The Palette

The brand theme of Casa de Matilda revolves around the same theme as Santoriniesque, so I wanted to make sure that it translates the feeling of minimalist, whites, cozy, intimate, and fresh

  • Alice Blue

    84D0FF

  • Rich Black

    00324F

  • Baby Powder

    EAFCFF

Project Journey

The Process

1

Creative Direction

First step that I did on this project was to propose 3 creative direction that Casa de Matilda can go. The lists of direction provided was 1. Minimalist /Santorini, Whites, Brief and Modern. 2. Tropical, Gen Z and millennial combined. 3. Luxurious, Fierce and does have brown accent colors. The first being the choice.

2

Marketing Page UI Design

Upon deciding what direction the brand would take, marketing page ui design is created.

3

Converting using NextJS and Material UI

Since Material UI is a popular UI framework, I think it would be better to create a project using this widely documented framework with NextJS to fully utilize its API Routes.

4

Development of Admin Side

Now that the project is in Minimum Viable Product (MVP) and marketing page sufficed its purpose, the booking system is now under

Project Shots

The Gallery

Hero Section
Hero Section
Gallery
Amenities
Reviews
Location