RentalHQ Mobile

02 / PRODUCT CONTEXT

One product architecture across desktop and mobile.

RentalHQ supports landlords managing the financial and operational reality of their properties: rent collection, tenant activity, maintenance, documents, and portfolio performance.

The desktop product acts as an operating environment for reviewing portfolio health, investigating issues, and managing work across properties.

The mobile product needed to preserve that same product model while prioritizing immediate financial awareness, exception handling, and task action.

PRODUCT PRINCIPLE
Everything happening in the property business should be understandable as one connected system — not a collection of disconnected tools.

03 / MOBILE REFRAMING

Desktop is a command center. Mobile is an action surface.

The mobile experience was not a reduced desktop interface. It was a reframing of the same product architecture around the decisions and actions that matter away from the desk.

Desktop supports broad review, comparison, investigation, and management across a portfolio. Mobile supports fast understanding, exception awareness, and focused follow-through.

The product model stays shared. The information hierarchy, interaction patterns, and screen composition adapt to the usage context.

REFRAME, DON’T SHRINK
Mobile is a different usage context — not a reduced desktop viewport.

04 / MY ROLE

Designing the system between product behavior and platform behavior.

The work extended beyond producing separate Android and iOS screens.

As Product Owner / UX Lead, I defined the connective layer between RentalHQ’s shared product model and the native interaction systems used to express it — preserving workflow, financial meaning, and task continuity while allowing each platform to behave like itself.

LEADERSHIP PRINCIPLE
Cross-platform consistency should be governed at the behavioral layer before it is expressed at the component layer.

05 / SHARED PRODUCT ARCHITECTURE

Shared Product Architecture

The product architecture stays shared across platforms while native navigation and interaction systems adapt to the patterns Android and iOS users already understand.

Home

Portfolio, cash flow, alerts

Rent

Collections, tenants, payments

Maintenance

Issues, expenses, vendors

More

Settings and support

Home ContentPortfolio, cash flow, alertsOverdue RentPayment alertMaintenance IssueOpen requestTenant DetailTenant / rent statusExpense ReviewReview / approve

Rent CollectionTenant list / payment statusTenant ListFilter / sortTenant DetailTenant / payment actionsPayment HistoryRecords / receiptsSend ReminderReminder / follow-upReminder ConfirmationReminder sentUpdated Follow-UpFollow-up recorded

Maintenance ListStatus / priority / vendorMaintenance DetailRequest statusExpense ReviewReview / approveExpense ApprovalApproveCash Flow ImpactFinancial impact

SettingsPreferences / notificationsReportsReports / exportsAccountProfile / sign out

Native Platform Expression

Android

Material Design 3

Bottom navigation — Primary destinationsTop app bar — Context & actionsBottom sheets — Temporary tasksDialogs — Feedback & confirmationSystem back navigation — Android back behavior

iOS

Apple Human Interface Guidelines

Tab bar — Primary destinationsNavigation bar — Context & actionsNative sheets — Temporary tasksAlerts — Feedback & confirmationSystem navigation — iOS navigation behavior

SHARED BUSINESS LOGICBusiness rules stay consistent; navigation and system behavior adapt by platform.

Shared Cross-Platform Principles

06 / FINANCIAL HOME

Financial health first. Exceptions before detail.

The financial home prioritizes the information that helps a landlord understand the health of the portfolio and decide what needs attention next.

The hierarchy is shared even when each platform expresses it through different native spacing, navigation, grouping, and controls.

01 / COLLECTION HEALTH

Collection health establishes the financial condition first.

Collected and outstanding rent provide the primary financial signal, giving the user a clear view of portfolio health before attention shifts to exceptions or broader context.

---

---

02 / EXCEPTIONS

Exceptions become actionable when financial state is already understood.

Overdue rent and pending maintenance costs rise immediately after collection health, carrying enough property, tenant, amount, and status context to support the next decision.

---

---

03 / PORTFOLIO CONTEXT

Broader context supports the decision without displacing priority.

Occupancy, property count, tenant context, and cash flow remain available after the immediate financial condition and urgent exceptions are understood.

---

---

FINANCIAL HOME PRINCIPLE
The product does not need identical screens to preserve identical financial meaning.

07 / RENT COLLECTION JOURNEY

One shared workflow from financial awareness to accurate follow-up.

Rent collection is more than a payment list. The mobile workflow has to help a landlord recognize an issue, identify the tenant, investigate the financial context, take action, confirm the result, and return to an updated state.

Android and iOS preserve that business sequence even when navigation, controls, temporary surfaces, and interaction patterns adapt to each platform.

01

UNDERSTAND

View the Home financial state and attention items to understand what requires action.

02

IDENTIFY

Open Rent Collection and identify the overdue tenant or payment exception.

03

INVESTIGATE

Open the tenant record and review balance, due date, overdue state, payment history, and relevant context before taking action.

04

ACT

Open Send Payment Reminder and review the recipient, amount, and consequence before committing the action.

05

CONFIRM

Send the reminder and receive clear confirmation that the action completed successfully.

06

FOLLOW UP

Return to the updated tenant state and preserve the follow-up as part of the ongoing record.

WORKFLOW PRINCIPLE
The platform can change how an interaction is expressed without changing where the user is in the business process.

The important cross-platform requirement is not pixel-level equivalence. It is preserving task order, financial meaning, state, and user context as the interface adapts to Android and iOS conventions.

08 / SHARED PRODUCT, NATIVE INTERACTION

The workflow stays shared. The interaction model adapts to the platform.

The same product decisions carry across Android and iOS, while navigation, temporary surfaces, selection, feedback, and return behavior follow the conventions users already know on each platform.

The shared layer defines task order, information meaning, state, and business rules. Android and iOS then express those requirements through the navigation, temporary surfaces, controls, feedback, and system behaviors users already understand on each platform.

01

PRIMARY NAVIGATION + HIERARCHY

Primary destinations and task hierarchy stay consistent while Android and iOS use their own native navigation structures and system behavior.

02

FILTER + SORT

Short-lived actions can use different native surfaces without changing the task itself — for example, platform-appropriate sheets, menus, or temporary panels.

03

REMINDER + CONFIRMATION

Success, warning, confirmation, and recovery states preserve the same meaning while their presentation follows each platform’s native interaction conventions.

04

NAVIGATION + RETURN

Navigation history, dismissal, and return behavior adapt to Android and iOS system expectations without breaking the user’s place in the workflow.

CROSS-PLATFORM RULE
Standardize the product decision first. Adapt the interaction pattern second.

09 / ADAPTIVE LAYOUTS

Adapt the layout without changing the task.

Responsive mobile design is not simply a larger or smaller version of the same screen.

As available space changes, information can move, expand, or become more visible — but priority, task state, and user context should remain intact.

ANDROID / WINDOW-SIZE CLASSES

COMPACTSingle-pane task flow

MEDIUMPersistent navigation + more visible content

EXPANDEDList + detail visible together

IOS / IPADOS — SIZE CLASSES + TRAITS

PORTRAITCompact width · focused single-pane flow

LANDSCAPESame task · more context side by side

REGULAR WIDTHPersistent list + detail relationship

ADAPTIVE PRINCIPLE
Change density and composition without changing the user’s understanding of the task.

10 / MAINTENANCE + FINANCIAL IMPACT

Operational work becomes a financial decision.

For an independent landlord, maintenance is not isolated from financial management.

A repair request can become an estimate, an approval decision, an expense, and ultimately a change to cash flow. The mobile experience needs to preserve that connection without forcing the user through disconnected tools.

01 / ISSUE

Maintenance Financial Alert

Understand the maintenance problem, property context, urgency, and current state.

02 / ESTIMATE

Expense Review

Review the expected cost and the information needed to evaluate the request.

03 / DECISION

Expense Approval

Approve, reject, or continue the workflow with enough context to understand the consequence.

04 / FINANCIAL IMPACT

Cash Flow Impact

Carry the expense back into the broader financial picture rather than treating maintenance as an isolated task.

PRODUCT PRINCIPLE
Operational decisions are clearer when their financial consequences remain visible.

11 / STATES + ACCESSIBILITY

Design the states, trust, and accessibility — not just the happy path.

A usable mobile product has to remain understandable when data is loading, unavailable, incomplete, successful, blocked, or requires attention.

Accessibility is part of the same system: hierarchy, status, controls, typography, and feedback need to remain understandable across device, platform, and user needs.

ACCESSIBILITY PRINCIPLE
Accessibility is not a separate mode. It is part of the product behavior that needs to survive every state.

12 / DESIGN + DEVELOPMENT

Define shared behavior before platform implementation.

Cross-platform design becomes easier to build when teams know which decisions are product rules and which decisions belong to the native platform.

The handoff therefore needs more than screens. It needs a clear behavioral contract: what must remain consistent, where Android and iOS should diverge, and how states and edge cases are expected to behave.

DELIVERY PRINCIPLE
Consistency is easier to implement when teams align on behavior before aligning on components.

13 / WHAT CHANGED

What I’d carry forward.

The most important outcome of the mobile work is a repeatable model for designing one financial product across multiple native platforms.

These are design and product takeaways from the current direction — not post-launch performance claims.

The work demonstrates a cross-platform approach in which consistency is governed by product intent, state, and user understanding — while interaction, accessibility, and system behavior remain native to Android and iOS.