Are you afraid of rejection? Do you have a crush but lack the self-esteem to handle a “No”?

Welcome to the future of romance.

This is a scientifically engineered, highly advanced, commitment-forcing web application. It guarantees a 100% success rate for your Valentine proposals. How? By simply removing free will from the equation.

“Do You Want To Be My Valentine?” is a playful, interactive web application designed to ask a special someone to be your Valentine. It uses a bit of clever JavaScript to ensure that No is never an option (literally).

You can view the source code on GitHub.

🚀 Features

• Personalized Greeting: Dynamically pulls the recipient’s name from the URL query parameter.
• The “Runaway” No Button: A cheeky interactive element that moves randomly whenever the cursor (or touch) gets close, effectively “forcing” a Yes.
• Celebration State: A Yes click triggers a redirect to a dedicated celebration page featuring a random festive GIFs.

🛠️ Technical Implementation

1. Dynamic Name Injection

The site allows for personalization by looking for a name parameter in the query string.

Example URL: https://alvarocleite.github.io/DoYouWantToBeMyValentine/index.html?name=Sarah

Logic:

const urlParams = new URLSearchParams(window.location.search);
const name = urlParams.get('name') || 'Sweetheart';
document.getElementById('question').innerText = `${name}, Do You Want to Be My Valentine?`;

2. The Unclickable No Button

To achieve the “unclickable” effect, the button uses absolute positioning. When the mouse event is triggered within a certain proximity, the button calculates a new random position within the viewport constraints.

3. Success State & Confetti

Upon clicking Yes, the browser redirects to celebration.html. This page utilizes an array of GIF URLs and select a random one from a list of GIF to ensure the user sees something different every time they (inevitably) accept.

📣 Building in Public

Sharing this project early was a fantastic experience. As soon as I had a functional version, I started sharing it with friends and the community. While the initial reaction was overwhelmingly positive, with many finding the concept hilarious, the real value came from the immediate feedback loop:

• Bug Discovery: Users quickly identified edge cases, particularly on mobile devices where the No button’s evasion logic behaved differently than on desktops.
• Feature Suggestions: Some of the current features, like the dynamic ?name= parameter and the creators page, were direct results of user suggestions.
• UX Refinement: The first version had the author name directly in the footer. Feedback highlighted that seeing the developer’s name on a personalized Valentine’s proposal felt “off” for the recipient. I pivoted by creating a dedicated “Creators” page, keeping the homepage clean and focused on the user’s special someone.
• The Power of Feedback: This project reinforced the importance of getting work in front of users as early as possible. Building in public allowed me to iterate rapidly, turning a simple joke into a more polished and interactive experience.