Trojan Bungalows | Web Design for Property Management

Los Angeles Student Living Made Easy

Overview (Client Work)

The website for Trojan Bungalows, a student apartment complex located less than a mile from the University of Southern California, is an effective and elegant digital solution designed to meet the needs of the property’s prospective and current tenants, as well as its management team. The platform methodically presents detailed information about the property to help users make informed decisions quickly and offers a range of practical tools to simplify tasks commonly associated with renting an apartment.

Role

Product Designer

Team

Researcher

Timeline

September 2024

Tools

Figma, FigJam, Framer

The Client

Trojan Bungalows is a privately owned apartment complex that caters exclusively to tenants enrolled at USC. Prior to this project, the property operated solely through in-person interactions, phone calls, and emails. While these methods are inherent to any property for basic functions, they could not adequately address the challenges faced by prospective tenants, current tenants, and management at the time.

During our initial client meeting, the property owner shared their vision:

"We want to bring the apartment into the 21st century with a website that'll make lives easier for the property management team as well as current and future tenants. It feels like we've been doing things the old-fashioned way for too long."

To better understand the specifics of the property's operations, we also spoke with the property manager. We learned that Trojan Bungalows relied on word-of-mouth marketing and physical advertisements to attract tenants. Prospective tenants had no way to access even basic property information without calling management or visiting in person. Current tenants faced similar inefficiencies, submitting rent payments via physical checks each month and making work order requests through phone calls or emails. These outdated, manual systems limited convenience for users and created excess work for the management team.

Research

To ensure that our web design would effectively address user needs, we began the project with generative research to thoroughly understand the goals and pain points of both prospective and current tenants. This process included conducting six user interviews and performing a competitive and comparative analysis of real estate rental platforms. Although I was not the primary researcher for this project, I coordinated three of the user interviews and contributed to the competitive and comparative analysis.

User Research

A total of six user interviews were conducted with apartment renters to gain insights into their experiences searching for and renting apartments. One of these interviews took place with a USC alumnus to examine the unique aspects of student life at USC.

From the perspective of prospective tenants, we discovered the following:

  • Quality and availability of content are critical. Since housing is often a user’s largest financial expense and apartment leases typically last a year, prospective tenants require accurate and comprehensive information to make informed decisions quickly. This is essential for committing to a long-term arrangement with significant financial implications.

  • Users value intuitive web functionality. When searching for apartments, users often compare multiple options simultaneously. Features such as interactive maps, virtual tours, and physical tour scheduling tools improve speed and convenience.

  • Trustworthiness is essential. Due to the prevalence of fraudulent or outdated housing listings online, users prioritize reliable websites to avoid deception and wasted time.

From the perspective of current tenants, we discovered the following:

  • Streamlined online functionality reduces friction. Tenants benefit from features that simplify routine tasks, such as communicating with property management, paying rent, and submitting work orders.

Competitive and Comparative Analysis

We assessed Zillow and Airbnb for competitive and comparative analysis.

Strengths

  • Offers detailed information on properties, including pricing trends and neighborhood data.

  • Access to historical property data helps users make informed decisions.

  • Map-based search and virtual tours improve navigation and visualization.

  • Reliable and verified listings reduce concerns about fraud.

  • Efficient tools for saving and comparing multiple listings.

Weaknesses

  • Property images and virtual tours vary in quality depending on the landlord or agent.

  • The interface can feel cluttered and complex for users seeking simplicity.

  • Users must often contact third-party agents to verify details or arrange tours, creating extra steps.

Features

  • Interactive Map Search: View listings geographically.

  • Virtual Tours and 3D Walkthroughs: Available for some properties.

  • Saved Searches and Alerts: Notifications for new listings that meet specific criteria.

  • Comparative Tools: Side-by-side comparison of multiple listings.

  • Neighborhood Information: Insights into schools, crime rates, and local amenities.

Strengths

  • Professional photos and detailed property descriptions elevate the user experience.

  • Reviews help prospective tenants assess property reliability.

  • Seamless, user-friendly interface simplifies experience.

  • Secure transactions and a transparent review system foster user trust.

Weaknesses

  • Primarily designed for short-term stays, limiting its usefulness for long-term renters.

  • Lacks comprehensive information on long-term lease agreements, utilities, and maintenance responsibilities.

  • Quality and accuracy can vary significantly across properties.

Features

  • Interactive Map Search: View listings geographically.

  • Booking and Payment Integration: Secure online booking with a protected payment system.

  • Calendar Availability: Real-time availability updates.

  • Host Messaging: Direct communication with property owners.

Research Synthesis

Based on our research findings, we determined that the web design for Trojan Bungalows needs to present detailed information in an efficient manner to help prospective tenants confidently make quick and informed decisions. To better serve the target audience, the content should incorporate resources tailored specifically to support the needs of USC students. Additionally, the website should feature convenient tools to streamline tasks for both prospective and current tenants.

At this stage in the process, we held another meeting with the client to present our research findings and discuss the project's direction. We clarified that while web design was within our scope of work as designers, we recommended that they consider adopting an external property management software to handle functions such as scheduling tours, rent collection, and other real estate-related tasks in consideration of user needs and design limitations. We also suggested the idea of hiring the appropriate contractors to obtain professional property photos, floor plan diagrams, and virtual tours for the overall practicality and quality of the website.

Design

About Trojan Bungalows

The website for Trojan Bungalows, a student apartment complex located less than a mile from the University of Southern California, is an effective and elegant digital solution designed to meet the needs of the property’s prospective and current tenants, as well as its management team. The platform methodically presents detailed information about the property to help users make informed decisions quickly and offers a range of practical tools to simplify tasks commonly associated with renting an apartment.

Information Architecture and Navigation

Information architecture and navigation for the Trojan Bungalows website follow the sitemap below. The sitemap outlines content structure for pages and primary functions managed through an external property management software.

Sitemap

The top navigation menu consists of a left-aligned logotype and five right-aligned labels; "Living," "Schedule a Tour," "Apply," "Residents," and "Contact."

  • "Living" and "Contact" offer users quick and intuitive access to essential property information.

  • "Schedule a Tour," "Apply," and "Residents" redirect users to an external property management software to complete more complex tasks.

  • "Schedule a Tour" and "Apply" serve as fixed call-to-action prompts, encouraging prospective tenants to proceed with the rental process.

  • "Residents" provides current tenants streamlined access to the tenant portal with minimal effort.

Top navigation menu on home page

Content

Content on the Trojan Bungalows website highlights key details about the property and is organized intuitively for easy consumption with minimal friction. Since the apartments are exclusive to USC students, the content goes beyond standard property information to emphasize resources specifically available to students.

General information is divided into content sections based on subject. Each section contains text and an image, with alternating placements of these elements to create visual balance and separate the sections. The section header and image help users quickly identify the type of information available. Additionally, some content sections may include a call-to-action button or links to external resources.

Content sections

The content sections below contain links to student resources such as the USC Lyft Rides Program, USC Village, and USC's Department of Public Safety, UPC Patrol Area. By incorporating these links into the relevant content sections, the website highlights additional benefits of renting at Trojan Bungalows that users may not have been aware of, providing a convenient and direct way to access more information.

Links to external student resources within content sections

Specific information about the floor plans offered at Trojan Bungalows can be accessed by clicking the "View Details" button in the cards located at the top of the "Living" page.

Floor plan cards

The floor plan pages feature an image carousel, a description card, and a details section.

  • The image carousel presents key visual content in a way that is engaging without being overwhelming.

  • The description card spotlights essential information about the floor plan, including the number of bedrooms and bathrooms, square footage, monthly rent, and availability. It also includes two call-to-action buttons to guide prospective tenants toward the next step in the rental process. To maintain these critical elements as the page's primary focus, the card incorporates a subtle drop shadow and fixed positioning, ensuring it remains visible as users scroll.

  • The details section keeps secondary information organized with the help of iconography and concise copy, making it easy for users to scan and understand.

1 Bedroom | 1 Bathroom page

All necessary contact details for Trojan Bungalows are conveniently available on the "Contact" page, presented in a clear and intuitive layout.

Contact details

Functionality

Primary functions of the Trojan Bungalows website are managed by an external property management software. The website seamlessly guides users to the relevant tools within the system, allowing them to complete tasks easily and at their convenience. This design, combined with the integration of a real estate administration platform, not only empowers users but also streamlines the work of the property management team by consolidating important tenant records into a single digital database and automating routine tasks.

The external property management software allows prospective tenants to schedule in-person apartment tours and apply for a lease. Current tenants can use the resident portal within the program to communicate with property management, make rent payments, and submit work order requests.

Outside of the primary functions provided by the external property management software, the Trojan Bungalows website features an interactive map and a contact form for the user's convenience.

The interactive map, powered by Google's Maps Embed API, is featured in the "Location & Safety" section on both the homepage and the "Living" page. This tool provides potential tenants with an engaging and intuitive way to explore the property and its surroundings. Offering dynamic visual insights directly on the website saves users time by allowing them to gather key information without leaving the page or visiting in person. Additionally, the map fosters transparency and trust by providing a clear and accurate view of the neighborhood.

Interactive map

The contact form, located at the bottom of the "Contact" page, enables users to quickly and easily send inquiries without needing to open an email client or make a phone call. The form allows users to contact the business at their convenience, even outside of regular business hours.

Contact form

Final Thoughts

Accepting and Navigating Limitations

One of the biggest challenges of working on the Trojan Bungalows website was accepting and navigating the limitations inherent to a small team of two designers. As we delved deeper into research and ideation, we quickly realized that web design alone could not properly address every user and business need. Essential functions—such as scheduling in-person tours, submitting rental applications, making rent payments, and requesting work orders—required the integration of an external property management software. Additionally, implementing practical media components like professional property photos, floor plan diagrams, and virtual tours would have necessitated contracting specialists to create new content. While our research highlighted the significant value these elements could bring to the website, they fell outside the scope of our responsibilities as designers.

Acknowledging these limitations, we focused on using our research findings as actionable data to support a user experience consult for the client. Our goal was to provide informed recommendations that would encourage the client to adopt the software and resources necessary to effectively meet both user and business needs.

Growing as a Designer

Building a digital solution for a small business has been an incredibly rewarding experience. Knowing that I've been able to make a direct and positive impact on an organization through my design work is a fulfilling and exciting thought.

Through this process, I developed a greater understanding of the importance of empathizing with both the user and the business to effectively bridge the gap between them. Maintaining regular and open communication with the client played a crucial part in understanding their business needs and delivering a successful outcome, just as engaging with users through research is vital for creating user-centered designs.

Thank You For Reading!

© 2024 Yoon Han

© 2024 Yoon Han

© 2024 Yoon Han