Get in touch

Get in touch

Get in touch

Designing a streamline

rent collection system

for landlords

Rentastic Pay

Role

Researcher

UI Designer

Team

Product Manager

Font-end Developer

Backend Developer

Deliverables

High Feudality Design

Product Documentation

Year

2024

Overview

Rentastic Pay is a new feature designed to enable landlords to collect rent from tenants directly through the Rentastic platform, providing a simple, secure, and flexible solution for both parties.


Core Objective: Allow landlords to activate payment collection, configure payout methods, create and manage invoices, and track payments with transparency and ease.

Landlords using Rentastic needed a seamless way to collect rent from tenants without relying on manual methods like bank transfers or cash. Existing processes lacked:


Automation


Visibility


Tenant reminders


Custom invoicing


Clear reporting on payment status

Problem Statement

Enable landlords to activate Rentastic Pay effortlessly.


Allow secure payout method configuration.


Provide a simple flow to create rent invoices.


Enable automated reminders for tenants.


Offer a preview of the invoice (PDF & Email).


Build a dashboard for landlords to manage payments.

Maintain clarity around Rentastic's fees and cuts.

Goals

48%

 Used manual

bank transfers or Venmo

60%

Reported confusion around

tracking late payments


85%

Wanted automated

reminders

100%

wanted tenants to

receive email invoices

User Research

We interviewed 8 landlords and 4 property managers

Competitor Analysis: Rentastic Pay vs. Others

Mind Map

Rentastic Pay – UX/UI Feature Architecture

We created the mind map to visualize the full scope of the Rentastic Pay experience—from setup to invoice management. It helped align teams, uncover edge cases, and ensure a smooth, user-centered flow before moving into wireframes and development.

Information Architecture

To keep the user experience clear and easy to follow, I mapped out the full structure of Rentastic Pay—from setup to invoice management. This helped organize screens, user flows, and actions in a way that supports smooth navigation and future scalability.

Wireframing

I started with low-fidelity wireframes to map out the structure and user flow before focusing on visuals. This helped me test ideas quickly, plan screen hierarchy, and make sure each step of the payment setup felt clear and easy to follow.

Final Outcome

  • Dashboard - Activate Rentastic Pay

    To make activating Rentastic Pay seamless, we introduced a dedicated section on the dashboard where landlords can easily enable it with just a few clicks. Additionally, we placed CTAs to activate Rentastic Pay across multiple sections of the app to ensure high visibility and encourage quick onboarding.

  • Rentastic Pay - Activation form

    We designed an intuitive activation form that collects all the required details to set up Rentastic Pay. To ensure compliance, we first reviewed Stripe’s onboarding requirements and then added additional fields specific to Rentastic — such as invoicing preferences and landlord information — to support our internal processes.

  • Payment method selection

    In this step, landlords can choose which payment methods their tenants can use to pay rent. We included all payment options currently supported by Stripe, allowing landlords the flexibility to select the methods that best suit their needs and their tenants’ convenience.

  • Create Payment

    Once Rentastic Pay is successfully activated, users are redirected to the new Rentastic Pay section of the app, where they can immediately set up their first rent collection. We also placed a shortcut CTA on the dashboard to streamline quick payment setup.

  • Payment Collection Setup

    This screen includes all the necessary elements landlords need to configure and automate rent collection. To enhance clarity, we added a preview section where users can instantly see how the invoice, payment email, and tenant payment page will appear from the tenant’s perspective.

  • Collection Setup confirmation

    After setting up a collection, landlords are presented with a confirmation screen summarizing the key details they entered. This helps them verify their setup and ensures all critical information is correct before going live.

  • Payment Page - Tenant View

    When a tenant receives a payment request via email, they’re directed to a customized payment page where they can securely complete their rent payment. The layout follows Stripe’s familiar flow but features Rentastic’s branding. Additionally, landlords can personalize the branding in the settings to better match their own business identity.

  • List of Payments

    The Payments section displays a comprehensive list of all transactions, along with their current statuses, actionable buttons, and filtering options. Since this serves as the primary control hub for landlords, we focused on providing all essential actions and insights directly within this view for maximum efficiency.

  • Review Collection

    When a landlord clicks on a specific payment, they’re taken to a detailed review page that includes the payment’s current status, transaction details, and quick actions like reminders or refunds. This page provides a clear and actionable overview of each rent collection.

  • Payment Section - Dashboard

    To give users a quick snapshot of their payment activity, we embedded a condensed Rentastic Pay widget directly on the main dashboard. It highlights upcoming payments and provides immediate access to essential actions, enabling landlords to manage collections without navigating away.

©️ 2025 Rafiul Karim

Let’s craft something together.

Next Project

Previous Project

Summary

Rentastic Pay was designed to simplify and streamline the rent collection process for landlords—bringing together payment setup, custom invoicing, reminders, and transparent tracking into one cohesive experience. By combining user research, thoughtful UX flow design, and seamless third-party integrations, we created a system that feels intuitive, trustworthy, and empowering.


Design Reflections

I led the UX/UI design for Rentastic Pay, turning a pretty complex rent collection process into something simple and clear for landlords. From mapping out user flows to designing each screen, I focused on making the experience feel smooth, trustworthy, and easy to use.


This project helped me learn a lot about designing for financial tools, working with third-party systems like Stripe and Plaid, and handling multi-step user journeys. More importantly, it taught me how to break down complicated problems and turn them into clean, usable solutions.