Apartment booking website case study

This online apartment booking system case study demonstrates Onix’s ability to create visually appealing and user-friendly web applications for the travel industry.

Travel
Industry
7 specialists
Team size
Indonesia
Location
7 months
Project duration

[ Business goals and context ]

Kozystay is an Indonesian property management start-up that facilitates short- and long-term rentals.

The service targets primarily middle- to upper-income tourists or business travelers and offers premium apartments and houses in the best locations of Jakarta and Bali. Kozystay aims to redefine the guests’ experience of Indonesia by ensuring exceptional comfort and a feeling of home.

Looking to decrease reliance on third-party platforms like Airbnb and Booking.com, Kozystay began to consider its own online apartment booking system development. The objectives were: ﹂To enable guests to book directly on the Kozystay website, ensuring an efficient, seamless process.

﹂To integrate the website with Kozystay’s existing channel management software for the management of reservations, availability, and pricing.﹂To design a platform that can accommodate an expanding property portfolio and geography without compromising the ease of management.

Kozystay’s management started looking for a creative web design and development team capable of building the minimum viable product (MVP) for them. When they approached Onix, they already had a vision of the future website’s look and functionality. They also had some web page wireframes prepared but still wanted recommendations on improving the wireframes and their branding.

[ Product scope ]

The Onix team was tasked with:

Creating the user experience (UX) and user interface (UI) for streamlined accommodations booking using preliminary wireframes provided by the client.

Developing a unique brand identity for the online accommodation booking service.

Building a scalable platform and integrating it with the client’s chosen channel manager.

Are you interested in apartment booking
website development?

[ Website flow and users ]

Kozystay’s guest profile comprises business travelers, staycation, and long-term guests, with 70% being foreigners.

Once on the Kozystay website, travelers can search for accommodations based on location, check-in and check-out dates, and the number of guests.

After exploring property details, they can proceed with booking. A personal account is created using their email. After a booking is completed, they receive a confirmation email.

The phases of the apartment booking website development:

Research and competitor analysis

First, the Onix team studied all the materials about Kozystay’s property management and online booking service and reviewed the provided wireframes to understand the future website’s structure and user journey.

Kozystay’s CEO showed Onix’s designers a reference site, wishing the new platform to be “like that but better.” The designers explored it and several other rivals in the niche to identify their strengths, unique features, and areas for improvement. It was determined that innovation and personalization should become Kozystay’s competitive advantages.

Simultaneously, Onix’s designers analyzed major booking platforms like Airbnb, Booking, and Sonder, looking for the latest trends and patterns that would be familiar to users worldwide: their use would ensure the Kozystay platform is intuitive and convenient.

Web app UX/UI design

Since the client provided wireframes for several web pages, Onix’s designers only drew the concept of the home page, enhanced the provided wireframes, and used them to design pages that were missing, such as the personal account and booking pages.

The designers employed an iterative approach to creating the Kozystay website UX/UI, working closely with software developers to ensure the feasibility of design solutions. Regular feedback from the client facilitated quick adjustments.

Booking service branding development

Simultaneously with the booking web app UX/UI design, Onix’s designer created a brand identity for Kozystay, including the logo, color palette, typography, and iconography to use for the website, mobile apps, marketing materials, etc.

The development of Kozystay’s logo went through three stages: concept mood board, logo and symbol creation, and visualization.

Prototyping

The designers developed interactive prototypes incorporating the platform’s key functionalities, transitions, and user interactions. They used these prototypes to gather feedback on usability, intuitiveness, and overall UX quality. Onix’s experts followed the best usability and accessibility practices to ensure the web app is easy to navigate and delightful to use.

The designers refined the prototypes through several iterations based on the client's feedback, hallway usability testing, and team discussions. The final approved version of the website design was adjusted for different screen sizes to ensure a consistent user experience across all devices.

Platform development

After the client approved the final design, Onix’s developers programmed the accommodations booking platform. The development team included:

front-end developer
back-end developer
DevOps engineer
quality assurance (QA) engineer
project manager

The apartment booking site development process comprised the following steps:

The coding of features and functionalities for travelers
Development of the administrator’s dashboard
Integration of third-party services for property booking, digital concierge, payments, and live chat
Pre-production release and testing
Production release

Do you need assistance with online apartment booking system development?

[ Product scope ]

Some of the design highlights:

A homepage to impress

Kozystay’s homepage offers an intuitive search function for travelers to enter the desired check-in and check-out dates, guests, and preferred location.

It also features professional photos of recommended apartments, enticing travelers to explore the best options. Testimonials help build trust.

Enticing listing pages

Kozystay provides travelers with detailed information about each property so they can explore, evaluate, and reserve accommodations hassle-free.

Each listing page offers a comprehensive overview, including detailed descriptions, prices, photos, reviews, a map, and booking date selection. It took some time to select ready-made icons to visualize all possible amenities that can be available at apartments and houses or, for example, the distance to specific locations.

User account

This personalized dashboard was designed to enhance travelers’ control and flexibility in managing their accommodation preferences.

On this page, travelers can:

easily update their personal information
customize notification preferences
review details of past reservations for reference
access a list of favorite properties for future stays

Trust-building pages

We developed several pages to instill trust and confidence in travelers and enhance the overall customer experience:

About Us: This section informs visitors about the platform’s background, values, and unwavering commitment to providing exceptional accommodation experiences.

Articles and News: Offering engaging content, such as travel tips, destination guides, and industry insights, this section assists with travel planning and enriches guests’ stays.

Contact Us: Providing multiple communication channels, this page ensures customers can easily access support or information.

Color coding & typography

Onix’s designers suggested yellow as the primary color because it evokes the sun’s comforting warmth, the sweetness of honey, and a sense of cozy tranquility. They skillfully used shades of yellow and blue against soft beige backgrounds to highlight the website’s brand and functional elements, such as buttons. Blue, reminiscent of the sea surrounding Indonesia, complements and balances yellow, creating visual harmony.

The website’s font needed to look perfect on all screens and warmly welcome every visitor, capturing Kozystay’s essence. Onix’s designers selected Rota, a font with pleasantly rounded shapes and sharp corners, achieving a seamless blend of sophistication and comfort – a professional look infused with inviting warmth.

Logo and brand identity design

The client had envisioned a logotype that would encapsulate their service’s simplicity and invite guests to “Unlock Comfort” and discover cozy apartments.

Our designers experimented with various symbols until the client approved a minimalistic design combining three elements:

Location Pin: Familiar to all who have searched locations on digital maps, its shape also references the domes of mosques.
Door: Representing the essence of accommodation, hospitality, and discovery.
Digit 1: Created by the opening door, it represents the commitment to providing first-rate apartments as a market leader.

This logo blends the notions of hospitality and excellence, promising exceptionally comfortable accommodations and exemplary customer experiences.

Software development phases

User functionalities coding

Onix’s web developers programmed the following features and functionalities for the website users:

search function
search result pages
booking system
payments
data collection
live chat

Admin dashboard

For Kozystay’s administrators, Onix’s software developers implemented the abilities to:

manage the finances, occupancy, customer profiles, etc.
add promo codes
manage blogs and other content
chat with users
manage automatic emails sent to customers, e.g., immediately after a successful booking, before check-in, etc.

Third-party integrations

Listings were created outside the admin dashboard, in a vacation rental software and management system, and then synchronized with Kozystay.

Onix’s programmers integrated the platform with several other third-party services:

a channel management system
a digital concierge
a payment system
live chat

Core technology stack we used

Booking platform

Python,

Django,

Vue.js

Designers’ instruments

Figma,

Adobe Illustrator,

Adobe Photoshop

[ Results and prospects ]

Here are the key results we achieved while working on the project:

Onix’s web designers created a user-centric app experience and interfaces that balanced aesthetics and functionality on desktop and mobile screens alike

Onix’s brand designer developed a brand style guide and unique logo for Kozystay

Onix’s web developers built a scalable online booking platform that is easy to maintain and manage and integrated it with the client’s preferred channel manager software

[ Future plans ]

The MVP was launched in 2021, allowing the client to focus completely on growing his business.

The platform was working stably and required no bug-fixing or further development until Onix handed over the project documentation and code to Kozystay’s in-house IT team in 2024.

Kozystay plans further apartment booking site development to accommodate business growth. For instance, when Onix was building the booking website, all properties were supplied from a single source. Now, external property owners or managers can also offer apartments or houses for booking. Kozystay also has plans to expand to neighboring regions: Malaysia, Thailand, or Vietnam.