COLAB31 - App

FixTrackr

Better Maintenance, Better Living

Problem Background  

Small-scale landlords, defined here as owners of small rental properties (1-4 units), play an important role in providing affordable housing. Managing properties can be challenging due to the lack of formal infrastructure and resources. These landlords typically balance property management with other personal and professional responsibilities, which can make it difficult to stay on top of crucial tasks like maintenance requests

Property maintenance encompasses everything from tracking maintenance requests and  scheduling repairs, to communicating with tenants and supervising contractors. Managing these elements reliably maintains tenant satisfaction, reduces turnover, and establishes well-run operations. That said, while property management tools and CRMs do exist, many are costly, geared towards large commercial portfolios, or needlessly complex, a common sentiment expressed among the 15 interview and survey participants during the discovery phase of our user research.

Research Insights

User Pain Points

All interviewees expressed a strong preference for property management tools that are simpler and more user-friendly than current solutions offer, with one participant in particular calling out, “it’s [all] too complicated–they’re complicating things.” Additionally, landlords communicated frustration with complex interfaces, with nearly all participants reporting reliance on manual processes or basic tools such as spreadsheets, WhatsApp, and Trello, none of which are tailored to their specific needs.

Feedback

Our research uncovered that the critical area of concern is maintenance tracking, where existing systems often fall short. Both interview and survey participants expressed struggling with keeping maintenance requests organized and addressing them adequately, leading some to rely on costly property management services temporarily. There is a clear demand for a comprehensive, but above all, simple, tool that offers maintenance tracking with communication features to both alleviate the landlord workload as well as maintain tenant satisfaction.

Solution Explanation

Solution was the development of a website for tenant requests and a mobile app that offers intuitive features for maintenance tracking. The app includes functionalities for logging and tracking maintenance requests, scheduling repairs, and automating communication between tenants and landlords. Goal was to create a comprehensive yet straightforward tool that integrates these aspects simply.

Lofi Mockups - App

Hifi Mockups - App

Lofi Mockups - Website

Hifi Mockups - Website

Iterative Design Learnings

We gained a lot of user feedback after showcasing our prototype. During usability testing, we discovered that the terminology we initially used for the task lists—“Ongoing,” “Later,” and “Done”—caused confusion among testers. They believed these labels (particularly “Later”) were not useful given that they would always start a request once read. They did, however, indicate that including task deadlines or priority status would be beneficial for them. 

To address this, we updated the list titles to “High Priority” and “Low Priority”. Additionally, users expressed the need to include a contractor’s contact information in a request, accessible to both the property manager and tenant. We responded by incorporating fields for contractor details within each request. 

Another pain point was the difficulty users faced in distinguishing between tenant-entered information and their own inputs, which we resolved by creating distinct sections for each within the request. Lastly, users highlighted the importance of keeping tenants informed about the status of their requests, prompting us to implement email notifications that alert tenants when a property manager has read their request as well as when they have kicked off managing the request.

Technical implementation

Where is it hosted? 
What is your tech stack?
  • Backend - Python, Django, Postgres, RESTful API, JWT Authentication Tokens, Github and Git for version control 
  • Frontend - React.js, JavaScript, HTML5, CSS3, React, Tailwind, Vite, JSON Web Tokens, React's Context API and Hooks, Github and Git for version control 

High-level journey of a request
  • Backendsome text
    • Python is my favorite language to code in. I chose to use Django & Postgres because I had never used either of them & I wanted to get experience with both of them to add to my resume.
    • Tenant Website - A tenant gets on to the website and all they need is their email address because it is connected to the property manager of the property they live at. The tenant fills out the maintenance request form & gets a confirmation request number and then the property manager is notified of the request that was sent. The tenant can check on the status of the request by using their request number on the website to see updates. 
  • Frontendsome text
    • React.js was chosen for its component-based architecture and efficient rendering with the virtual DOM it is also what I am most comfortable with, enabling a scalable and responsive user interface. Tailwind CSS was used for its utility-first design approach, allowing for rapid development and consistent styling across the app, additionally, this was a CSS that I had been wanting to try out coming from a Bootstrap background. These tools were selected to ensure a modern, fast, and maintainable front-end that can be easily extended with new features.
    • PWA for Property Managers - FixTrackr is a Progressive Web App (PWA) for property managers, streamlining unit and tenant management. Property managers can create new units via the 'Add Unit' page or during registration, inputting essential details like unit title, address, and tenant information. The 'Account' page lists all managed units, where managers can view, update, or delete unit and tenant data. The 'Task List' page allows managers to track maintenance requests, while the 'Sort & Filter' functionality helps in organizing tasks efficiently. The tenant side can also be updated through these interfaces, ensuring all relevant details are current for “progress checks” on maintenance requests including handyman information. 

Technical Challenges

What was the hardest part of development?
  • Backend - The hardest part for me was connecting the backend to the frontend for a PWA & getting it to function properly with a website also. I had never done that before and some of the errors we ran into I had never encountered. 
  • Frontend - The hardest part was pivoting from a React Native app to a PWA with only 1.5 weeks left before the deadline. Adapting the design and functionality from a mobile-first approach to a web-based PWA, while ensuring a seamless user experience across devices, was particularly challenging. Integrating the frontend with the backend to handle various CRUD operations for both property managers and tenants in a web environment added a new level of complexity, especially under such a tight timeframe and not having worked with another dev’s backend code before (used to using my own backend code)

Does your app have any scaling issues? 
  • Backend - To my knowledge, no. Should work fine. 
  • Frontend - At this stage, the frontend doesn't appear to have any scaling issues. However, as more users start to interact with the PWA, potential performance optimizations, particularly for handling large datasets in the 'Task List' and 'Sort & Filter' functionalities, may need to be explored.

What are some key takeaways?
  • Backend - Do not throw in the towel just because you have encountered 500+ errors. Always be ready for edits and be ready to pivot because a project is always evolving as you build it. 
  • Frontend - Adapting someone else’s UX/UI design into the application was a new experience for me, as I’m used to creating my own designs. It taught me the importance of closely aligning with the original vision while ensuring the functionality and user experience remain intact. The project also reinforced the need to stay flexible and ready to pivot when challenges arise, especially when working under tight deadlines.

Future Steps

Next steps look like maintaining post-launch support to address any immediate user issues. We’ll continue user testing, prioritizing user feedback and collecting data to identify areas of improvement and zero in on ensuring our users needs are met. The goal is to keep refining the product and expand its features in response to the data and any emerging market trends.

Learnings

Product Manager Learnings:

Isabela Andrade

I do appreciate the Just Do It approach of bringing together first-time or low-experience product managers, designers, and devs to build a product. If there’s anything else the experience further solidified, it was the importance of maintaining transparency and keeping the lines of communication clear and open.

Designer Learnings:

Serina Zepeda

Co.Lab was a very interesting experience for me as I was able to work on a cross-functional team that included an incredible product manager and really dedicated, hard-working developers within Agile design sprints. We taught each other a lot through this process.

Developer Learnings:

Kayla Ard

This was a very interesting experience for me as it was my first time working with a project manager & designer. I learned a lot, and although at times it was frustrating and challenging I know I am more prepared as a web developer from my time and experience with this team and project.

Developers Learnings:

Karen Campos

&

Working on the frontend of this project was a challenging yet rewarding experience. Having to pivot so late in the game reinforced the concept of staying flexible in development. Collaborating with a product manager and designer for the first time highlighted the significance of aligning on a shared vision. This experience has definitely made me more resilient and prepared for future projects.

Full Team Learning

Our collective experience was one of collaboration, transparency, and flexibility as we worked together for the first time in a cross-functional team. While the course was definitely challenging at times, each of us walked away having learned the value of adaptability and alignment on a shared vision. Overall, the project up-leveled each of our skills and prepared us for future challenges in our respective roles.