Designing and leading a multilingual, mobile-first wedding website
Ludmilla Ramos
|
UX/UI Design
Wedding Website
|
2023
Project Overview
At the time, no platform could truly meet the needs of an international, multicultural, multilingual guest list — most lacked proper language support, flexible registries, and automated RSVP flows.
I led and designed a mobile-first MVP website from scratch, collaborating with two volunteer developers and choosing a UI kit that cut their workload by at least 34%.
In collaboration with two developers, we launched a responsive, four-language website with streamlined RSVPs and a commission-free, multi-currency registry — all delivered on time, despite tight resources.
Impact
→ Responsive, accessible, culturally tailored UI
Designed a responsive, mobile-first interface prioritising the thumb zone, clear navigation, and manual translations for better cultural fit — improving adoption across diverse user groups.
→ Optimised guest journey
Mapped the end-to-end guest experience and built an information system using APIs for automated RSVPs and a commission-free, multi-currency cash registry.
→ Efficient cross-functional leadership and delivery
Built the site with a UI kit and reusable components, cutting developer workload by at least 34% and enabling on-time delivery despite only ~260–300 combined volunteer hours.
Problem-Solving
The wedding website that didn’t exist (but should have)
In a world where 88% of expats move for love, 57% of them are in intercultural relationships, and 22% are with someone from another country, I was shocked that I couldn’t find a single wedding website builder that ticked all the boxes for couples like us.
The problems were clear:
No real multi-language support — especially for less common languages like Polish.
Gift registries with high fees that ate into contributions.
No multi-currency support, making it harder for international guests to give gifts.
Poor customisation for destination weddings, leaving no easy way to share travel tips, hotel codes, or local attractions.
Goals
Strategic vision: A wedding hub guests would actually use
The goal was simple but critical: create a central, responsive platform where every guest — anywhere in the world — could access accurate, personalised information for the wedding and their trip. From RSVPs to hotel promo-codes and travel tips, it had to relieve the hosts from answering the same questions over and over as the big day got closer.
The website would be the key touchpoint, connected to a system that started with the digital invitation and ended with a friendly reminder email the day before the wedding.
Challenges & Constraints
No time to waste.
The clock was ticking — invites had to go out on time. We had six months, minimal resources, and a volunteer dev team of two (one senior, one junior), each committing roughly 5 hours a week. With different skill levels and availability, managing the build took flexibility, clear communication, and a lot of adapting on the fly.
Even though I hired someone to design the visual identity, I reworked the style for the website, creating desktop and mobile layouts that were not just responsive but adaptable to different screens.
The result?
A temporary website that still delivered a seamless experience — because anything less would mean the goal wasn’t met.
The Process
Finding the “perfect” wedding website builder — spoiler: it didn’t exist!
I started by looking for a platform that could keep the same URL and layout while serving content in Portuguese, Polish, and English. I signed up for several popular builders, tested their free plans, and quickly realised most came with frustrating trade-offs — from limited design control to taking a cut of your gift registry.
So, I ran a competitive comparison across 6 dimensions to see which (if any) could deliver:
Language – Can it support all the languages I need, and let me manually translate for a better cultural fit?
Registry – What’s the cost? Are gifts flexible or locked to fixed amounts?
Guest Management – Can it handle RSVPs with automated confirmations and mailing list integrations?
Travel Setup – Is there space to easily share travel tips, hotel codes, and other must-knows?
Communication – Can guests find and share info quickly, or connect with hosts easily?
Design & Customisation – Can I tailor the look, layout, and pages to match the wedding’s visual identity?
What have I got?
No platform scored high enough to meet all needs — so I decided to build my own.
Investigating the idea with real guests and cultural reality checks
Before jumping into design, I floated the idea of a digital invitation and website to a few guests.
The reactions:
Brazilians were all in — they’re used to online RSVPs and digital event hubs.
Polish guests, on the other hand, were less familiar with it, preferring paper invites and personal follow-ups. That insight pushed me to dig deeper into the cultural, language, and usability challenges ahead in secondary research.
Guests weren’t just a single audience — they came from different age groups and cultural backgrounds, each with unique pain points, needs, and motivations. So, I created separate personas to reflect these differences and mapped out their journeys more precisely. The result was a clearer picture of behaviours and expectations, making it easier to design an experience that truly fit each type of guest.
Here’s what stood out:
Product adoption – Online RSVPs are rare in Poland, and digital adoption scores are among the lowest in Europe. Some guests might need extra hand-holding to get on board.
Updates & reminders – Brazilians thrive on Instagram and WhatsApp, while Polish guests are more likely to use Facebook Messenger. Any communication plan had to reflect both habits.
Language options – Automatic translation wasn’t going to cut it. Brazilians needed Portuguese, and older Polish guests needed Polish, even if most spoke English.
Gift-giving – In a destination wedding, cash gifts make the most sense. Multi-currency, commission-free options were essential to make giving easy for guests and cost-free for the hosts.
These early conversations and research gave me the green light — and the roadmap — to design something culturally aware, guest-friendly, and genuinely useful.
Mapping the wedding guest experience
International guests don’t just need a simple wedding website. They need a smooth, culturally aware journey from the invite to “It was remarkable your wedding” by checking the pictures after the event. So, I mapped out every key touchpoint to see where extra care was needed. The result became the backbone of an information system that tied it all together — with the website as the central hub.
Designing the guest management system
To keep both guests and suppliers on the same page, I mapped out exactly who needed what — from guest details for vendors to travel info for attendees. This visual system became my blueprint for managing the entire end-to-end experience, making a long-distance wedding feel a lot closer and easier to plan.
With the big picture in place, I mapped out the site to prioritise what guests needed most — from RSVPs and travel tips to gift details — keeping it simple, clear, and easy to navigate.
Aligning design with development for a faster launch
Before diving into UI, I met with both developers — one senior, one junior — to map their skills, constraints, and availability against the project’s needs. This was a key leadership moment: setting realistic goals, removing roadblocks, and agreeing on a plan that would keep the build smooth despite limited hours and no budget.
We left the meeting aligned on 7 key decisions that made the project faster and easier to deliver:
Framework & hosting – Build in React for maintainability, deploy on Vercel for speed.
Structure – Modular component setup for easier maintenance and quicker iterations.
UI framework – Adapt MUI components to save time, customising only where needed.
Mobile-first approach – Prioritise 390px and 1024px breakpoints, skip tablet-specific layouts to focus on core devices.
Lightweight load – No skeleton screens needed; site loads quickly without them.
Simple, accessible assets – Use Google Fonts and Material Symbols for easy implementation.
Engagement boosts – Embed Google Maps, Weather Widget, and YouTube videos to make the site more useful and dynamic for guests.
This alignment meant fewer back-and-forths, clear ownership of tasks, and a development process that stayed lean without sacrificing the experience.
Bringing the brand to life
I teamed up with a graphic designer to craft a consistent visual identity — from the monogram to colours and typography that would work both online and offline. Later, I adapted the palette for better accessibility using Adobe Color, keeping contrast in check while allowing some flexibility for the audience’s needs.
Building with components in mind
Even for a temporary site, I started small — atoms, molecules, organisms — so developers could reuse core components and speed up implementation. Quick wireframes kept the layout consistent, responsive, and adaptable, guiding both the design and how it would be built.
I kept usability front and centre, designing with the thumb zone in mind for easy mobile navigation and using grids to keep screens tidy, clear, and effortless to browse.
Keeping it consistent — and code-friendly.
I leaned on outlined stacks — some interactive, some static, some in carousels — so developers could easily replicate the code and keep the style consistent.
[img: Components cards/stacks]
For content-heavy sections, I went with a blog-like layout, reusing the same text structure to speed up styling and make pages feel familiar.
[screen text]
And for info that didn’t need to be in-your-face, like FAQs, I used accordions at key points to keep things clean but still easy to find.
[accordion]
Making it developer-friendly (and 100% human-made)
With tight deadlines and a lot of manual multi-language work ahead — and this was pre “let’s just ask AI” days — everything had to be done the old-fashioned way.
I kept the design as easy as possible to implement: wireframes with comments, prototypes showing key interactions, and a detailed Google Doc with rules, extra info, and translations in Portuguese, Polish, English, and Spanish. All photos and illustrations were neatly stored in Google Drive, ready for devs to grab and go.
Curious to see it in action?
Go ahead, click through — no RSVP required!
When reality meets the MVP
Even with careful planning, a few bumps on the road kept things interesting — and taught us a lot.
Design dreams vs. dev reality
My idea for a playful slider with stop points turned out tricky to build and ate into our already limited hours. We swapped it for a simpler, familiar stack-and-modal setup to keep deadlines on track.
Forms that didn’t quite form
Using JotForm with LiteMessage streamlined guest management, but the styling was clunky, some users missed the submission feedback, and Safari users occasionally couldn’t see the “submit” button. A few post-launch fixes solved the worst of it.
When “clickable” isn’t clickable
Outlined stacks without interaction looked too much like those with interaction, causing dead clicks on mobile (no hover on mobile!). Not critical for a temporary site, so we left it as is.
Minor rage clicks & tech quirks
Some menu-closing issues and odd horizontal scrolling popped up in recordings. Logged and handed over to devs for fixes.
Lost in translation
“Q&A” became “FAQ” for Brazilian guests, and “RSVP” became “Confirm attendance” to boost understanding and engagement.
RSVP hiding in plain sight
Vertical menu scrolling buried the RSVP link. We tightened content spacing and tweaked link placement for better visibility.
Carousel fatigue
Dress code content was buried in the mobile carousel, so we bumped it to the second position and left less critical info for later. Desktop was also changed to its grid layout for better visibility on the viewport.
Wrapping it up:
happy guests and proud devs!
Guest feedback was glowing — the site looked great, was easy to use, and answered most questions before they were even asked.
Polish guests adopted it surprisingly well, Brazilians… skimmed a bit more (content strategy, we’ll talk later). International guests still had some travel queries, but design wasn’t the blocker.
For me, the real win was leading and collaborating with the devs. Staying empathetic, flexible, and ready to jump in when needed kept things moving — even when the senior dev had to cut hours near the end. We still launched on time, and the team finished proud of what we built together.
