Shiv Parvati Wedding Invitation

1. Introduction

The "Shiv Parvati Wedding Invitation" project aims to create an interactive and visually captivating wedding invitation website for the wedding of Himanshu and Shivani. The project will incorporate traditional elements with modern interactive features to provide an engaging experience for invitees.

2. System Overview

The wedding invitation website will feature an interactive journey starting with a vintage gate that opens to reveal a garden with Lord Ganesha, followed by a scenic view of Shiv and Parvati's varmala ceremony. The site will include event details, interactive elements like scratch-to-reveal information, and a countdown to the wedding day. The design will be updated to a minimalist style with clean, simple lines.

3. Functional Requirements

• As a User, I should be able to click on the vintage gate to open it and reveal the garden scene.
• As a User, I should see Lord Ganesha with the text "वक्रतुण्ड महाकाय सूर्यकोटि समप्रभ।निर्विघ्नं कुरु मे देव सर्वकार्येषु सर्वदा।।" above him.
• As a User, I should experience a camera transition from the garden to a sky and snow-fallen area with Shiv and Parvati's varmala ceremony.
• As a User, I should see rose petals showering in slow motion during the varmala ceremony.
• As a User, I should be able to click further to transition the camera to the sky, revealing the main invitation text with the blessings of Mr. Hari Singh Sankhla and Mrs. Kaushalya Devi.
• As a User, I should see the invitation text for Himanshu and Shivani, including family details and a fitting closing line.
• As a User, I should see the main invitation text with family blessings and details of the bride and groom.
• As a User, I should be able to view event details for Sangeet, Reception, and Wedding Day with interactive map links.
• As a User, I should be able to scratch to reveal important information like the wedding date.
• As a User, I should see a countdown timer designed beautifully for the wedding day.
• As a User, I should see a calendar marking all function dates.
• As a User, I should read minimalist lines inviting guests to join and bless the couple.
• As a User, I should be able to access an RSVP page.
• As a User, I should see rose petals and beautiful lines related to each event.

4. User Personas

• Guest: Individuals invited to the wedding who will interact with the invitation website to view details and RSVP.

5. Core User Flows

• Guest clicks on the vintage gate -> gate opens to reveal garden with Lord Ganesha -> camera transitions to varmala ceremony scene -> rose petals shower -> main invitation text appears -> guest views event details and map links -> guest scratches to reveal wedding date -> countdown timer and calendar are displayed -> guest reads invitation lines -> guest accesses RSVP page.

6. Event Details

• Sangeet: 27 November 2026, 6:00pm onwards at Gokulam garden View on map
• Reception: 2 December 2026, 6:00pm at Brahmgarh Palace View on map
• Wedding Day: 11 December 2026, 6:00 pm onwards at Radha Krishna vatika View on map

7. Additional Features

• Add the countdown of the wedding day beautifully designed. Add a calendar marking the dates - 27 Nov, 2 Dec, 11 Dec.

6. Visuals Colors and Theme

• primary: #8B0000 (Dark Red)
• primary_light: #CD5C5C (Indian Red)
• secondary: #4682B4 (Steel Blue)
• accent: #FFD700 (Gold)
• highlight: #FFA07A (Light Salmon)
• bg: #FFFFFF (White)
• surface: rgba(245, 245, 245, 0.8)
• text: #000000 (Black)
• text_muted: #696969 (Dim Gray)
• border: rgba(105, 105, 105, 0.2)

7. Signature Design Concept

The homepage will feature an interactive 3D scene using @react-three/fiber and @react-three/drei. Users will click on a beautifully rendered vintage gate that opens with a smooth animation to reveal a serene garden with Lord Ganesha. As users click through, the camera will transition seamlessly to a watercolor-textured mountain scene with Shiv and Parvati's varmala ceremony. Rose petals will shower in slow motion, created using gsap for animation. The minimalist design will focus on clean lines and subtle animations, providing an elegant and immersive experience.

8. Interaction Model & Motion Direction

The landing page will use a "parallax" interaction model, with layered depth and scroll-triggered animations. Decorative elements like rose petals and atmospheric textures will move at different speeds, creating a dynamic and engaging experience. Internal pages will maintain a "static" model for clarity and ease of reading.

9. Non-Functional Requirements

• The website should load quickly and be responsive across devices.
• The interactive elements should function smoothly without lag.
• The design should maintain a minimalist aesthetic with clean lines.

10. Tech Stack

• Frontend: React for Web
• Backend: Python, FastAPI
• Database: MySQL or MariaDB
• AI Models: Not applicable
• AI Tools: Not applicable
• Local Orchestration: Docker, docker-compose
• Server-side Orchestration: Kubernetes

11. Assumptions and Constraints

• The website will be accessed primarily by guests with varying levels of technical proficiency.
• The design must accommodate both desktop and mobile users.
• The interactive elements should not compromise the website's performance.

12. Glossary

• RSVP: Répondez s'il vous plaît, a request for guests to confirm attendance.
• Varmala Ceremony: A traditional Indian wedding ritual where the bride and groom exchange garlands.