Yumigo — Find Your Tribe, Join Your Vibe

Yumigo is a lightweight, student-focused single-page website prototype built for college communities to discover and join interest-based groups (ChillFill, SkillHub, TripTribe, Custom Groups).
This repo contains HTML, CSS and JavaScript that together create a modern, animated, responsive landing site connected to Tally forms for group signups.

---

🚀 Project goals

• Help college students find like-minded peers and join curated campus groups.
• Make joining groups frictionless by redirecting users to pre-built Tally registration forms.
• Provide a beautiful, responsive, and accessible single-page UI that can be reused or extended.
• Keep everything free-to-use and easy to deploy.

---

🧩 Features

• Fully responsive single-page layout with sections: Home, About, Features, Groups, Contact, Footer.
• Animated hero with floating shapes, typing effect, particles, and custom cursor (desktop-only).
• Smooth page navigation (internal links + keyboard and swipe navigation).
• Mobile hamburger menu and scroll-aware navbar.
• Group cards linking to Tally forms (external signup flows).
• Modal windows for Terms, Privacy Policy, Community Guidelines.
• Notification system, lazy-loading images, counters, and accessibility considerations.
• Lots of small UX touches: loading states, form validation improvements, scroll progress bar.

---

📁 Repo structure

/ (project root)
├─ index.html       # Main single-page HTML
├─ styles.css       # All styles (responsive + animations)
├─ script.js        # All JS logic & UI interactions
├─ README.md        # This file
└─ assets/          # (optional) images/fonts/icons you might add

---

🛠️ Built with

• HTML5
• CSS3 (modern features, gradients, vars, animations)
• Vanilla JavaScript (no frameworks — keeps it lightweight)
• Google Fonts (Poppins) and Font Awesome icons
• Tally forms (external) for group registrations

---

✅ Getting started — run locally

1. Clone the repository:

git clone https://github.com/yourusername/yumigo.git
cd yumigo

2. Open index.html in your browser:

• Double-click index.html or

# using a simple http server (recommended for some features)
python3 -m http.server 8000
# then open http://localhost:8000

---

📦 How to customize

Update brand copy & links

• index.html — update site title, hero text, group descriptions, and social links.
• Replace the Tally form URLs in the group buttons (in HTML) or in script.js joinGroup() mapping.

Replace icons & images

• Add files to assets/ and reference them in index.html.
• For lazy-loading images, use data-src attributes (the script includes a lazy loader).

Tweak styles

• Edit styles.css variables (at the top) to quickly change colors, shadows, and other design tokens.

Remove heavy desktop effects for performance

• If you want to simplify for low-end devices, remove particles, custom cursor, or reduce animation complexity in script.js and styles.css.

---

⚙️ Deployment suggestions

• Netlify — drag & drop folder, or connect GitHub repo for CI.
• GitHub Pages — push to a repo and enable Pages on the main branch.
• Vercel — connect GitHub repo, automatic deployment.

Note: If you host on a domain and want the Tally forms to open in a modal rather than a new tab, you'll need to use Tally's embed snippet (their embed code) instead of the current window.open links.

---

🧾 Notes & Known details

• The project currently uses external Tally forms linked in the HTML. Replace them with your actual form URLs if you update forms.
• Some scripts (custom cursor, particles) run only on desktop (window.innerWidth > 768) to preserve mobile performance.
• Contact form HTML is present but commented out — integrate with your backend or an external form handler if you want submissions saved.
• Accessibility: basic keyboard support and ARIA-friendly behaviors are considered, but an audit and more semantic markup would improve compliance.

---

🔒 Privacy & Safety

• The modal content for Terms, Privacy Policy and Community Guidelines are included in index.html. Update the policies to suit your legal and operational requirements.
• Ensure you only collect data you need and that you comply with local data protection laws (e.g., India’s applicable rules, GDPR if you have EU users).

---

💡 Future improvements (TODO)

• ✅ Connect Tally form responses to a Google Sheet / server for live tracking.
• Integrate Razorpay/Payments for paid groups and verify payments via webhooks (user already planned Razorpay for Yumigo).
• Add user authentication and in-app group management (beyond static site).
• Progressive enhancement: add server-side rendering or a small backend to store signups and payment linkage.
• Replace confirm() flows with custom modal confirmation UI for consistent branding.

---

🧑‍💻 Contributing

1. Fork the repository.
2. Create a feature branch: git checkout -b feature/name.
3. Commit your changes and push: git push origin feature/name.
4. Open a Pull Request explaining the change.

Please keep changes small and focused. Include screenshots for UI changes.

---

📬 Contact

• Project / business email: yumigocontactus@gmail.com
• Collaboration email: yumigoconnect@gmail.com

---

⚖️ Credits

• Design & development: Team Yumigo
• Icons: Font Awesome
• Fonts: Google Fonts (Poppins)
• Forms: Tally.so