Skip to content

Repository files navigation

♟️ Puremate — Interactive Digital Experience

Puremate is a digital agency website that transforms complex ideas into immersive, interactive experiences. The project highlights advanced front-end development through rich animations, seamless section-to-section transitions, and layered interactivity. Built using tools like GSAP alongside scroll-based triggers and custom watchers, the experience delivers precise control over timing, state, and visual flow. Each interaction is carefully orchestrated to maintain performance while creating a smooth, engaging narrative across the entire site.


🖼 Preview

Puremate — Preview

🎯 Project Goals

  • ✅ Build a user-friendly and adaptive website with responsive design that reflects the company’s services
  • ✨ Add personality and liveliness to the site through pure JavaScript animations
  • ⚡ Ensure high loading speed and cross-browser compatibility (Google Chrome, Safari, Yandex Browser, Opera, Edge, Brave, etc.)
  • 🛠 Develop clean, valid, and maintainable code using only standard web technologies to guarantee stability and performance

🧩 Development Features

  • 📐 Semantic HTML5 markup for well-structured and accessible architecture
  • 🎨 CSS3 + SCSS (Sass) for styling with modularity and reusability
  • 🏷️ BEM methodology for organized class naming and scalability
  • 📱 Responsive layout with Flexbox and CSS Grid
  • ⚙️ JavaScript for interactive elements and dynamic behavior
  • 🔄 Gulp + Webpack for task automation:
    • SCSS compilation
    • Minification
    • Image optimization
    • Hot-reload during development

🛠️ Tech Stack

Technology Purpose
HTML5 Structure & semantics
CSS3 / SCSS Styling & maintainability
BEM Clean and scalable code
Flexbox & Grid Responsive design
JavaScript Dynamic functionality
Gulp & Webpack Build automation
GSAP Library Professionals animation

✨ The chosen technology stack ensures stable performance, ease of development, and long-term support.

Releases

Packages

Contributors

Languages