Live Demo: operly.org
Operly is a high-end, responsive agency website built for a Canada-based Virtual Assistant firm. It focuses on clean aesthetics, professional operational systems, and a seamless user experience for solo founders and growing businesses.
- Modern Tech Stack: Built with React 18 and Tailwind CSS.
- Responsive Design: Elegant mobile-first UI with a custom-built navigation system.
- Interactive UX: Custom scroll-reveal animations and a state-managed mobile menu.
- Operational Logic: A functional lead-capture form integrated with a PHP backend for secure email delivery.
- Brand Identity: Sophisticated typography (Playfair Display & Plus Jakarta Sans) and a minimalist "Sand & Emerald" color palette.
- Single Page Application (SPA): Optimized routing using
.htaccessfor professional cPanel deployment. - Clean State Management: Utilizes React Hooks (
useState,useEffect) for UI interactions. - CSS-in-JS Architecture: Leverages Tailwind's utility-first approach combined with internal CSS for brand-specific components like the "Glass Card" and "Animated Status Badge."
├── public/ # Static assets (Favicon, index.html)
├── src/ # React source code
│ ├── App.js # Main logic and UI components
│ ├── style.css # Tailwind & Brand styling
│ └── index.js # Entry point
├── api/ # Backend PHP mailer
└── package.json # Dependency management