2026 / Property Platform
Pastirumah
A property platform experience shaped around clearer discovery, agent workflows, and responsive listing journeys.
- Role
- Product Design / Frontend Engineering
- Platform
- Responsive web / Agent workflow
- Timeline
- 2026
- Stack
- Next.js / React / Tailwind CSS / API Integration
Pastirumah explores how a property platform can help people move from browsing to inquiry with less friction. The dummy case study focuses on listing structure, responsive hierarchy, and agent-facing product moments.
Property discovery can feel scattered when listings, details, and actions are not organized around buyer intent. The interface needed to make dense property information easier to compare without losing momentum on mobile.
01 / Contribution
What I shaped.
- Mapped the product structure for discovery, detail, and inquiry flows.
- Defined a responsive visual hierarchy for listings, filters, and calls to action.
- Built frontend patterns that keep important actions visible across viewport sizes.
02 / Product decisions
Key decisions.
Decision 01
Put decision-making details closer to the first scan.
The homepage and listing surfaces prioritize price, location, property type, and inquiry actions before secondary details. This keeps browsing clear without flattening every listing into the same weight.
Decision 02
Design mobile flows around intent, not decoration.
The mobile layout keeps image, price, and action hierarchy direct so users can understand the offer and move toward inquiry quickly.
03 / Interface
Screens and states.
04 / System
Designed in systems.
The interface uses a restrained component system for property cards, search affordances, metadata rows, and inquiry states.
- Listing cards
- Filter controls
- Inquiry CTA
- Metadata rows
05 / Frontend
Built for responsive use.
The frontend direction focuses on responsive layout composition, reusable listing components, and predictable content states.
- Responsive grids that adapt from comparison-heavy desktop to focused mobile browsing.
- Reusable metadata patterns for price, location, and property attributes.
- Interaction states tuned for clarity instead of ornamental motion.
const listingGrid = "grid gap-4 md:grid-cols-2 xl:grid-cols-3";06 / Outcome
What this enables.
- A clearer path from property browsing to inquiry.
- A responsive structure prepared for real listing data.
- A product surface that balances buyer needs and agent workflow moments.
The strongest direction for this product is to keep reducing decision friction. The design should make comparison easier while the frontend keeps actions fast, responsive, and predictable.
Next project