Philately Collection & Marketplace App

Fourteen modules designed end to end for a client who arrived with an idea.

Design file for a philately collection and marketplace appDesign file for a philately collection and marketplace app

A mobile-only philately app for the Brazilian market — stamp collection management plus a marketplace — spanning fourteen modules, designed end to end for a client who arrived with an idea and nothing else. I designed the whole product from a discovery board: the fourteen-module mobile UI, a wired prototype, and 194 components built across twenty-four authoring sessions with no bulk-paste session anywhere in the history. Designed and handed off; the build never completed, so nothing here says it shipped. The discovery and the logo were someone else's.

Role
Sole designer of the product
Timeframe
Apr 2025 – Jun 2025
Stack
Figma
Evidence
  • Design file

Open the design file

Mobile-only collectibles management and marketplace application for Brazilian philately (postage stamp collecting). Spans 14 modules (Authentication, Home, Collections, Issue Details, Collection Progress, My Collection, Auctions, Highlights, Popular, Order Summary, Profile, Monthly Ranking, Balance Top-Up, and Home Delivery), fusing completionist album-tracking with a transactional marketplace, powered by a two-tier 158-variable token system with zero broken aliases across Light and Dark modes.

Agency employment at Spaceapps, a no-code product studio. The engagement was commissioned by a private client named Rodrigo who arrived with an initial concept and no pre-existing brand, assets, or software. Thiago (tech lead) ran FigJam discovery and created the logo; I took the project from the discovery board onward as sole product designer. The build was scoped for Bubble/FlutterFlow across a 15-phase delivery process. Planned from April to June 2025.

Fusing philatelic collecting with a live marketplace

14
complete mobile modules spanning collecting and commerce
158
design variables across 5 collections with zero broken aliases
131
bespoke product components authored without vendor kits
3
integrated payment methods (Credit Card, Pix, Boleto)

The Brazilian philately hobby suffered from fragmented legacy ecosystems. Collectors relied on static catalog reference sites like FILABRAS that lacked purchasing capabilities, while buying and selling occurred in unverified generic marketplaces like Mercado Livre or WhatsApp groups without authenticity guarantees or structured condition grading.

Research-driven information architecture: two distinct personas

The 14-module architecture directly serves two contrasting collector profiles identified during discovery:

  • Carlos Antunes (58, retired history teacher) — The emotional collector who values historical heritage, collection completeness, and community prestige. Served by Coleções, Minha coleção, Progresso (album completion scores), and Detalhes Emissão.
  • Lucas Neves (32, investment analyst) — The commercial trader approaching philately as alternative collectibles with resale potential. Served by Leilão (live bidding auctions), Destaques, Populares, Recarga, and physical home fulfillment (Receber em casa).
  • Gamified Progression System — Tiered collector ranking (Ouro, Prata, Bronze) and monthly scoreboards driving recurring community engagement.
  • Visual Grading and Rarity Standards — Explanatory pop-up cards for stamp rarity and preservation condition, demystifying technical evaluation for newer collectors.

A two-tier token architecture: Light, Dark, and zero broken aliases

SuperSelos features the most rigorous token architecture in this portfolio: 158 variables organized into five distinct collections (0. Primitives, 1. Colors, 2. Semantic, 3. Typography, 4. Dimensions). The system operates on strict two-tier aliasing — semantic tokens (Background/primary, Text/secondary) resolve through variables to underlying primitive palettes with 0 resolution issues.

Theming is an active product feature rather than a cosmetic afterthought. While the primary product interface is dark mode, light mode resolves dynamically because all components bind to semantic variables rather than hardcoded hex values. Furthermore, brand tokens (Button/brand amber #FFC655) remain mode-invariant, while container backgrounds invert intelligently (#F6FEFB in Light, #461302 in Dark).

Typographic identity and bespoke component engineering

I defined the typographic system as bound variables: Merriweather for headings (conveying the historical prestige of postal heritage) paired with Outfit for high-legibility interface body copy, selected after testing against IBM Plex Serif, Lora, and DM Serif Display.

Unlike agency files that rely on pre-packaged vendor kits, all 131 product components on the Mobile page were authored specifically for SuperSelos across 24 authoring sessions, including versioned accordion items (contentAccordion v1 and v2), stamp cards, barcode readers, and rarity badge indicators.

Dark mode was the product decision; light mode comes free because every element is bound to semantic variables rather than raw hex values.

The developer handoff and the unbuilt reality

I assembled a complete developer handoff package (Passagem para os devs, 818 nodes) featuring social sharing assets, theme previews, and a 28-point handoff standard covering responsive states, contrast compliance, and interaction feedbacks. The checkout flow within Home models full Brazilian payment rails: credit card, dynamic Pix QR codes, and bank boleto slips.

The project plan clearly documents where execution broke down: Phases 1–7 were completed on schedule through late June 2025, but Phase 8 (handoff to dev) was left undated as the agency's Bubble engineering team failed to execute the build. This project stands as an uncompromised demonstration of mobile product design and design token engineering.

Evidence

Fully designed, tokenized, prototyped with click and hover interactions, and packaged into a formal 28-point developer handoff. However, the application was never built into production: the agency's Bubble engineering layer stalled at Fase 8 (Passagem para DEV), and superselos.com.br never went live. This project exemplifies high-fidelity mobile product design and complete tokenized theming that remained unbuilt due to no-code development limitations.