Arnau López selles

Product Designer & Dev. Building from Figma to App Store.

New to Contra

Arnau is ready for their next project!

Valencia, Spain

Work Posts Services About

Valencia, Spain

StackD — the website for my own dev & automation agency StackD builds the software businesses actually need: custom websites, native apps, SaaS platforms, and turning manual processes into automated flows. I designed and built its website end-to-end. The goal Position StackD as the lean, transparent alternative to traditional agencies — "real products in the hands of real users, not mockups." Fast demos, a fixed 3-person team, no hidden costs. The site had to feel modern, technical and trustworthy in seconds. What I built A fast, responsive marketing site with clear sections: Services, Process (4 steps), Projects, Team and FAQ Terminal-style touches ($ whoami) to give it a developer personality A portfolio section featuring real shipped products (SMASH, NOOK, Volea.io (http://Volea.io), Getflow) Copy and structure optimized to convert visitors into "no-commitment" discovery calls How I built it Next.js + HTML/CSS for a fast, SEO-friendly front end Deployed on Vercel (CI/CD, edge, instant previews) Built AI-assisted with Claude Code — pairing with an AI coding agent to design, iterate and ship faster than a solo dev normally could The takeaway This is how StackD works, proven on itself: idea → live product in days, not months. The agency site isn't a brochure — it's a demo of the exact speed and quality we deliver to clients.

🎾 I built and shipped a padel app. Solo. From idea to the App Store. This is SMASH — and here's the whole story, the stack, and who it's for. The problem I lived I play padel. And like everyone who plays, I was organizing matches across four different WhatsApp groups, arguing about who won, with no real ranking and no easy way to run a club league. Clubs were managing tournaments in Excel. The fastest-growing sport in the world had no home on your phone. So I built one. What SMASH is An iOS app that turns padel into a social, competitive experience: • Organize matches and track results • A real ELO ranking, by city and by level — win, you climb; lose, you drop • Leagues & tournaments where the app auto-generates the bracket and standings • Matchmaking ("I want to play") that fills your game with players nearby • A short-video feed for your best padel moments • Push notifications that bring you back ("you've been challenged", "you moved up to #3 in your city") How I built it (the stack) Frontend: • Flutter / Dart — one codebase, iOS-first • Riverpod for state management • Custom UI (Material + Cupertino, glass effects), fully localized (ES/EN) • Video pipeline: playback, caching, compression, thumbnails Backend — 100% serverless on Firebase: • Cloud Firestore — real-time database for users, matches, squads, leagues, tournaments • Cloud Functions (2nd gen, Node 24) — server-side ELO calculation, a push-notification fan-out system, and city-based matchmaking • Firebase Auth (Google + Apple Sign In) • Firebase Cloud Messaging for push (APNs) • Firebase Storage for media • Security rules + composite indexes Monetization: • RevenueCat + StoreKit 2 — subscriptions, freemium model (play for free, organize as Pro) Systems I built from scratch: • The ELO algorithm (K=32, team-average) for fair competitive ranking • A round-robin generator for tournaments • A viral invite loop (a padel match needs 4 players → every game created is an invitation) Who it's for Primary — padel players, from casual to competitive: people who play weekly and want to organize better, measure their real level, and compete. Starting in Spain, expanding to the padel hotspots: Italy, Sweden, Germany, the US (Miami, California), and Australia. Secondary (B2B) — padel clubs: run official leagues and tournaments with zero paperwork, and add a booking link so players find and book courts. Recurring, defensible revenue. What I actually learned Shipping alone means being the product manager, designer, Flutter dev, backend engineer, growth marketer and App Store submitter — often in the same afternoon. I learned that features don't make a startup; loops do — a retention loop (notifications), a growth loop (invites), and a business model that scales. I learned that "global from day one" is a trap: 500 real users in one city beats 0 scattered worldwide. And I learned that the last 10% — App Store review, push certificates, subscription approvals — is where most side projects quietly die. So I pushed through it. SMASH is live on the App Store now, and I'm building it in the open with the players who use it. If you play padel, run a club, or just like watching a product get built from zero — I'd love your feedback.

Volea — Product walkthrough. Adding players, booking a court, and onboarding a club — the dashboard in motion. A short walkthrough of Volea's dashboard: the side of the product club owners actually live in once they're past the landing page. The video covers three flows: adding and managing players inside a club, booking a court directly from the dashboard, and connecting a new club during onboarding. Design goals The dashboard needed to work for a very specific user: a club owner who is not a software person. Most have never used anything more complex than a WhatsApp group to manage bookings. So the priority wasn't density of features, it was clarity at a glance — today's bookings, today's revenue, which courts are empty, in that order. [Add 2–3 lines here about specific UI decisions — e.g. why you chose the layout for adding players, what the connect-a-club onboarding flow looks like step by step, any constraint you designed around. This is the part that needs your input.] The interface uses the same warm, editorial visual language as the landing page — same type, same restrained color palette — so the product doesn't feel like a different app once you log in.

Volea — Landing page design. A booking SaaS for padel clubs, designed to feel less like software and more like a court. Volea is the operating system for padel clubs: online bookings, automatic leagues, and real-time court occupancy — replacing the WhatsApp threads and spreadsheets most clubs still run on. The brief was self-set. Most booking tools for sports clubs look the same: generic SaaS blue, dashboard-first, zero personality. I wanted the landing page to feel closer to the sport itself — clay courts, clean lines, daylight — while still reading as a serious product a club owner would trust with their bookings. Design direction I moved away from the typical "tech startup" palette early. Warm, sun-bleached tones instead of cold blues; generous whitespace instead of dense feature grids. The hero leads with a single court photo, not an illustration — the product should feel tactile, not abstract. Each feature block (bookings, leagues, occupancy) is shown as a small live UI fragment rather than an icon + paragraph. A club owner doesn't want to read "real-time occupancy" — they want to see the 78% and the empty 11am slot that's costing them money. [Add 2–3 lines here about your specific references / inspiration — e.g. editorial sports brands, specific Scandinavian or sports-tech sites you looked at. This is the part that needs your input.] Micro-interactions Small movement was used sparingly: the occupancy bar fills on scroll, the league standings count up rather than appear instantly, and the booking time slots have a subtle hover state that mimics tapping through them on a phone. Nothing flashy — the goal was rhythm, not spectacle. Outcome The result is a one-page site that sells the product without a single stock photo of someone "playing padel and smiling at the camera." It's live at volea.io (http://volea.io).

SMASH Landing Page — UI Design (Figma) A landing page concept for SMASH, a short-video social app for padel players, designed in Figma. Visually inspired by Apple's product pages — clean grids, generous whitespace, large confident typography — but pushed toward a more editorial direction: oversized headline type, full-bleed product photography and app mockups carrying most of the visual weight, and minimal interface chrome around them. The page uses a white and near-black base with a single lime accent color reserved for key moments (CTAs, highlights), keeping the same restrained color discipline as the app itself so the brand feels consistent end to end. Tools: Figma.

I wanted to build the fastest MVP studio on the internet. So I built Stackd. Live site: stackd.codes (http://stackd.codes) · GitHub: github.com/lopezsellesarnau-cmd/stackd Stackd is a product studio that builds MVPs for founders in 4 weeks — design, development, and deployment under one roof. No agencies, no handoffs, no delays. It started as a personal brand problem. I had shipped 4 products solo in 12 months but no single place that communicated what I do and how fast I do it. Most agency websites look the same — generic grids, stock photos, vague copy. I wanted something that felt like a product, not a brochure. The site is built around a black editorial aesthetic — pure black background, DM Sans typography, #98D516 green accent, and a layout inspired by Linear and Stripe. Every section has a purpose: the hero communicates the value proposition in one sentence, the process timeline shows exactly how it works, the code and dashboard mockups prove it's real, and the selected work section lets the products speak for themselves. The mockup section was the most interesting design challenge — four live code windows showing a real Next.js API route, Flutter feed screen, a Gateflow dashboard, and two mobile phones side by side. Built entirely in HTML and CSS, no screenshots. The design went from Figma to live in one session. Deployed on Vercel, connected to the stackd.codes (http://stackd.codes) domain via Hostinger DNS. My process: Content strategy → Figma design → HTML/CSS build → Vercel deployment → DNS configuration → Live Stack: HTML · CSS · JavaScript · Figma · Vercel · DM Sans · DM Mono

Louvr Performance — Meta Ads Creative Intelligence Louvr Performance — Meta Ads Creative Intelligence Live: louvrlabs.com (http://louvrlabs.com) I got tired of opening Ads Manager every Monday without knowing what to do. So I built a system to fix that. Louvr Performance connects to your Meta Ads account via the official API, pulls creative-level performance data — spend, ROAS, CTR, frequency — ranks every active ad from best to worst, and delivers a weekly AI-generated report with three specific actions every Monday at 9am. Fully automated. It works for any Meta Ads account and uses Claude Sonnet by Anthropic to analyze performance patterns, explain why your best ad is working and why your worst is losing money, and generate a structured action plan based on real data — not templates. The dashboard has an editorial minimal look — white background, Lato typography, sharp borders, and a clean information hierarchy that makes complex ad data readable at a glance. This makes it easy for brands and agencies to know exactly what to scale, what to pause, and what to refresh — without spending an hour in Ads Manager every week. The system handles the full pipeline — Meta API authentication, creative data ingestion, Claude AI analysis, JSON parsing, email delivery via Brevo, and Stripe subscription billing. Weekly reports are scheduled via Make.com (http://Make.com) and arrive before the week starts. With Louvr Performance, any brand running Meta Ads gets a senior analyst in their inbox every Monday for €99/month. My process: Product concept → HTML/CSS/JS frontend → Python/Flask backend → Meta Ads API integration → Claude AI analysis → Make.com (http://Make.com) automation → Stripe billing → Supabase auth → Railway deployment → Live Stack: Python · Flask · Meta Ads API · Claude Sonnet (Anthropic) · Stripe · Supabase · Make.com (http://Make.com) · Brevo · Railway · Hostinger

I wanted to build an Airbnb for storage. So I built NOOK. Live app: TestFlight GitHub: github.com/lopezsellesarnau-cmd/nook-app NOOK is a two-sided marketplace where hosts rent out spare space — basements, garages, spare rooms — and tenants reserve it by the month. It works on iOS and uses Firebase for real-time data, Stripe Connect for host payouts, and Cloud Functions to process payments securely. The app has a clean editorial look — white background, Inter typography, 47px card radius, and a minimal black/white design language that makes listings feel premium instead of classified-ad cheap. This makes it easy for hosts to list their space in minutes and for tenants to browse, reserve, and pay without leaving the app. The app handles both sides of the marketplace — host identity verification via Stripe onboarding, reservation approval flow, real-time chat between host and tenant, and a full payment pipeline with service fees. It uses Firebase Cloud Functions as the backend so the whole thing runs serverless with no infra to manage. With NOOK, anyone with spare space can start earning in under 10 minutes. My process: Figma wireframes → Design system → Flutter screens → Firebase backend → Stripe Connect integration → Cloud Functions → TestFlight Stack Flutter · Firebase · Stripe Connect · Cloud Functions · Figma · Xcode

120

Gateflow — Client Onboarding SaaS for Agencies. Most agencies lose hours before a project even starts. Contracts in email. Briefs half-filled. Assets sent over WhatsApp. Ad account access requested days after kickoff. I built Gateflow to fix that. One link per client. They sign the contract, fill the project brief, upload brand assets, and connect their ad accounts — all from their phone. You track every step in real time from your dashboard and get notified the moment something is completed. No chasing. No follow-ups. No chaos. Built in 48 hours with Next.js, Supabase, Stripe, and Resend. Deployed on Vercel. → usegateflow.io (http://usegateflow.io)

101

SMASH — Padel Videos & Squads Built a short-video platform for the padel community from scratch. Solo — design, development, and deployment. What it does Players upload match highlights, discover other players, organise squads, and chat with teammates. Pro subscribers get advanced analytics, unlimited uploads, and a verified badge. How it was built Flutter for cross-platform iOS/Android. Firebase for auth, database, and storage. RevenueCat for subscriptions. Figma for the full design system — editorial black/white aesthetic, Inter typography, 3px border language throughout. The hard parts Navigating Apple's App Store review process solo — multiple rejection cycles covering UGC compliance, Sign in with Apple, in-app purchase configuration, and banking setup. Every rejection was a lesson in reading guidelines carefully and communicating precisely with reviewers. Stack Flutter · Firebase · RevenueCat · Figma · Codemagic · App Store Connect Status Currently in App Store review. TestFlight live.

181