Case Study
Ask Astrologers
Industry: Professional Services / Astrology & Spiritual Guidance | Type: Premium Astrology Consultation Showcase
Volmier designed and engineered a luxury frontend consultation showcase, integrating 3D perspective animations, responsive vector layouts, Zod contact forms, and client-side WhatsApp lead routing.
Project Facts
| Project Type | Custom Web Application / Astrology Consultation Showcase |
| Industry | Professional Services / Astrology and Spiritual Guidance |
| Volmier Role | Frontend Design & Development (Lightweight React architecture, responsive grids, custom scroll-reveal handlers, 3D perspective animations, simulated localStorage admin CMS) |
| Frontend Stack | React 18.3.1, TypeScript, Vite, Tailwind CSS 3.4.17, shadcn-ui, React Router DOM, React Hook Form, Zod |
| Backend Stack | Not verified from the available project analysis. |
| Database | Not verified from the available project analysis. |
| Authentication | Simulated client-side admin login checks inside React state |
| Infrastructure | Lovable.dev hosting template configuration; others not verified. |
Project Overview
Ask Astrologers is a single-page web application designed as a professional online presence and consultation showcase for Mr. Subhash Darve and Mrs. Vandana Darve, two astrology consultants.
The platform introduces the practitioners' bios, outlines qualifications and certifications, displays a sacred services catalogue, and directs leads to WhatsApp, phone calls, or email to schedule and coordinate consultations.
Project Purpose
Certified astrology consultants require a digital presence that establishes professional credibility, displays certificates, details consultation services, and routes prospective clients without the server overhead of hosting relational databases.
To meet this goal, Volmier focused on a premium frontend presentation, creating immersive animations and custom layouts, while offloading scheduling and payment collections to WhatsApp workflows.
What Volmier Implemented
Astrology UI Design
Created a custom-styled visual theme utilizing deep purple and gold classes. Built responsive headers, footers, and floating WhatsApp anchors matching the luxury aesthetics.
Immersive Animations
Implemented a 3D perspective zodiac palm animation in `ZodiacPalmAnimation.tsx` that tilts and floats dynamically, alongside a vector crescent moon illustration with orbiting star particles.
Dynamic WhatsApp Routing
Programmed client-side link builders that compile package details and redirect users to `wa.me/919765557046` with custom pre-filled message text.
LocalStorage CMS Prototype
Built a simulated admin dashboard `/admin` that enables local testing of CMS features, saving service and blog configurations client-side in browser `localStorage`.
Key Features
3D Zodiac Palm Animation
A 3D perspective illustration of orbiting rings and zodiac signs revolving around a central palm image.
Custom SVG Lunar component
A vector crescent moon styled with custom gradients, gaussian blurs, and star orbits.
WhatsApp Lead Redirection
Consultation cards dynamically generate pre-filled text payloads to open WhatsApp sessions.
LocalStorage Admin CMS
A simulated admin screen to add/delete services and posts, saved locally to the browser.
Zod Form Validations
Contact forms enforce format criteria, including 10-digit Indian phone checks.
Custom Scroll Reveal
A reusable React hook (`useScrollReveal`) that monitors screen elements using the Intersection Observer API.
Technical Implementation
Volmier implemented a React frontend Single Page Application (SPA) in TypeScript using Vite.
The user interface uses Tailwind CSS responsive utility breakpoints alongside shadcn-ui components. The layout animations utilize keyframe styling rules and a custom Intersection Observer hook to trigger smooth transitions.
Because no database backend was required, all dynamic behaviors (such as administrative panel updates, blog posts, and contact message lookups) are managed directly on the client side using state variables persisted in `localStorage`.
Verified Project Outcomes
Volmier successfully delivered the custom astrology showcase featuring:
- An immersive frontend client styled with modern dark purple/gold design variables.
- 3D perspective CSS orbits and custom crescent moon SVG elements.
- Direct client-side WhatsApp redirection hooks for simplified lead generation.
- A mock admin CMS workspace to test dashboard features locally.
No verified business/performance metrics found.
Frequently Asked Questions
What did Volmier develop for the Ask Astrologers project?
Volmier designed and built the frontend single-page application client. This includes custom React components, a responsive layout using Tailwind CSS and shadcn-ui, scroll reveal animations, a 3D zodiac palm illustration, custom SVG lunar shapes, and a simulated admin panel utilizing local storage APIs.
Does the website feature a backend database or scheduling engine?
No, backend databases, scheduling engines, and automated calendar systems are not verified in the project. Volmier implemented booking flows client-side by formatting dynamic WhatsApp business URLs that launch chats with pre-populated package choices.
Is there an admin dashboard to update content?
Yes, Volmier implemented a simulated admin panel layout. Because there is no backend database, all updates (such as adding/deleting services or blog articles) are persisted client-side in browser local storage for prototype testing.
Have a similar software project in mind?
Talk to Volmier about your custom web development or interactive frontend needs. We focus on clear technical communication and building user-centric interfaces.