Skip to main content

Project case study

Interactive Valentine's Website

A lightweight interactive microsite built with HTML, CSS, JavaScript, and PHP, using guided interactions and animations to reveal a personalized Valentine's message.

Engineering case study by Jonas Viray, Full Stack Developer & AI Automation Engineer

Interactive Valentine's Website | project by Jonas Viray

Overview

This project is a small interactive web experience focused on client-side behavior rather than application complexity. HTML and CSS provide the layout and visual presentation, JavaScript drives the guided prompts and reveal interactions, and PHP supports the site where server-side handling is needed. It demonstrates event handling, sequencing, animation, and simple stateful interaction in a compact project.

engineering summary

Problem → Architecture → Contribution → Result

Problem
A personalized message needed to feel more engaging than a static page while remaining lightweight and simple to deploy.
Architecture
HTML and CSS provide the presentation, JavaScript controls guided prompts, animation, reveal sequences, and client-side interaction, with PHP available for the small amount of server-side handling used by the project.
Contribution
Built the interactive experience and sequencing logic as an early web project focused on event handling, animation, and simple stateful behavior.
Result
The project demonstrates an early ability to turn a small content idea into an interactive browser experience without unnecessary application complexity.

Related service: Product Engineering & Business Systems

Public product-surface details below are included as scope context from the observed site or application. They are not presented as claims about business outcomes, revenue, approvals, health results, or other client marketing metrics.

Observed product surface

  • Username/password login posted to a PHP backend, redirecting to a success page
  • Show/hide password toggle
  • Validation popups for empty or incorrect credentials
  • Sound effects and background music tracks tied to interactions
  • Detects Facebook/Messenger in-app browser on Android and prompts opening in a real browser

Public product areas

  • LOVE IN! login screen
  • Warning / feedback popup
  • Success page (after login)

Intended audience · Personal/gift use (not stated explicitly)

Planning a system with similar complexity?

Send the requirements, current stack, and constraints. I'll outline how I would structure the system, where the main risks are, and what an implementation path could look like.

All work