DEV Community

Cover image for I built a romantic app to surprise my wife. See what I learned from it.
Jonatã Oliveira
Jonatã Oliveira

Posted on

I built a romantic app to surprise my wife. See what I learned from it.

A few months ago, I wanted to surprise my wife with something more meaningful than just a message, flowers, or a generic gift.

As a developer, I thought, "What if I build something?"

That idea turned into LoveMemo, a mobile app that lets you create a romantic public page filled with photos, music, a personal message, a relationship timer, and a QR code to reveal the surprise.

This post is not about "how to get rich with apps." It's about building a product from start to finish, from idea to App Store, and the technical choices I made.

The Original Idea (and the Pivot)

LoveMemo didn't start as a romantic app.

At first, it was a photo-sharing app for events like weddings and parties, where people could upload photos using QR codes. The technology worked, but something felt off:

  • There was low emotional attachment.
  • It was hard to stand out.
  • Storing many files is expensive.
  • Users had weak motivation to pay.

When I created a romantic page to surprise my wife using the same core idea of QR to public page, everything clicked.

The tech was the same, but the emotional value was completely different.

That's when I decided to change the product, not the tech stack.

High-Level Architecture

LoveMemo has two main parts:

Mobile App (React Native / Expo)

  • Guides users step-by-step.
  • Handles photos, messages, music, and payments.
  • Generates the "memo."

Public Romantic Page (lovememo.app)

  • A lightweight, cinematic page.
  • Loads by ID shared through a link or QR code.
  • Optimized for emotion, not interaction.

This separation was intentional:

  • The app focuses on creation.
  • The website focuses on experience.

Mobile App Stack

Core

  • React Native (Expo)
  • TypeScript
  • Expo Router for navigation
  • Zustand for state management
  • MMKV for fast local drafts
  • InstantDB for authentication and database.

I wanted:

  • Fast iteration
  • One codebase
  • Zero friction for publishing updates

Expo provided exactly that.

UI & Animations

  • NativeWind (Tailwind for RN)
  • React Native Reanimated
  • Soft shadows, rounded corners, and a pink-based color scheme.
  • Decorative 3D-like elements (visual only, no heavy meshes)
  • Liquid Glass (ah yes, that's beautiful)

The UI was very important. If it doesn't feel romantic, the product fails.

Media Handling

  • expo-image-picker
  • Local previews
  • Upload only after payment to prevent waste
  • Background music via YouTube link (managed on the web side)

Drafts are saved locally, so users can leave and come back later.

Payments

App payment screen

I kept the pricing model simple: One-time purchase for one romantic page, active for a month.

I also removed every possible friction point related to payments. No payment screen, credit card form or checkout flow. The user doesn't even need to create an account to publish their memo. LoveMemo uses In-App Purchases, so payment happens with a single tap using Apple Pay or Google Pay.

Public Romantic Website

The public page is built with:

  • Vite + React (with SSG to improve SEO)
  • TailwindCSS
  • Framer Motion for animations

Each page:

  • Displays the couple's names
  • Shows a relationship timer
  • Plays background music
  • Animates photos in a cinematic slideshow
  • Ends with a personal love message

It's intentionally simple from a technical standpoint but visually rich.

Performance matters because:

  • Users often access it by scanning a QR code.
  • The "wow moment" must be instant.

QR Code as a Product Feature

One of the best decisions was to make the QR card a key feature.

Instead of just saying "share this link," the app generates:

  • A printable and shareable card
  • A QR code
  • A short romantic message

This transforms a digital product into something physical, which greatly increases its perceived value.

Launch & Marketing

I didn't start with ads.

I focused on:

  • TikTok organic videos
  • Product-led storytelling
  • Showing the reaction, not the app

The typical flow in videos:

  1. Screen recording of the app
  2. Showing the QR card
  3. Scanning it
  4. Revealing the romantic page

People don't care about features, they care about outcomes.

App Store Optimization (ASO)

ASO turned out to be more important than I expected.

Key lessons:

  • A clear title is better than a clever one.
  • Keywords matter more than the description.
  • Emotional screenshots work better than feature screenshots.

I also localized the store description in:

  • English
  • Portuguese
  • Spanish

What I'd Do Differently

  • I would validate the emotional angle earlier.
  • I would avoid building features without a strong reason.
  • I would spend more time on the first 10 seconds of the experience.

The pivot taught me that distribution and emotion are as important as the code.

Final Thoughts

LoveMemo started as a personal surprise and evolved into a product.

The technology wasn't groundbreaking. The idea wasn't complex.

But combining:

  • A clear emotional goal
  • Simple architecture
  • Strong user experience
  • Focused marketing

…made all the difference.

If you're building something, ask yourself, "Why would someone care about this?" That answer is usually more crucial than the tech stack.

Thanks for reading.

Top comments (2)

Collapse
 
leob profile image
leob • Edited

But did she like it (or I should say "love it") ? :-)

Collapse
 
jess profile image
Jess Lee

^ this