<div class="blur-container">
  <div class="blur-layer layer1"></div>
  <div class="blur-layer layer2"></div>
  <div class="blur-layer layer3"></div>
  <div class="blur-layer layer4"></div>
</div>

.blur-container {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 80px;
  pointer-events: none;
  z-index: 4;
  overflow: hidden;
}

.blur-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.blur-layer.layer1 {
  backdrop-filter: blur(1px);
  -webkit-backdrop-filter: blur(1px);
  mask-image: linear-gradient(to bottom, transparent 0%, black 100%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 100%);
}

.blur-layer.layer2 {
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  mask-image: linear-gradient(to bottom, transparent 10%, black 100%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 10%, black 100%);
}

.blur-layer.layer3 {
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  mask-image: linear-gradient(to bottom, transparent 20%, black 100%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 20%, black 100%);
}

.blur-layer.layer4 {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  mask-image: linear-gradient(to bottom, transparent 30%, black 100%);
  -webkit-mask-image: linear-gradient(to bottom, transparent 30%, black 100%);
}

ImmiSchool Online

/ Gold Coast, Australia
Authentic learning without language barriers.
  • UX & UI Design
  • Digital Strategy
  • Animation and Interaction
  • Custom Development

Project overview

We teamed up with Yulia Moiseeva to build an international education platform designed for both English and Russian-speaking students. Instead of relying on automated translations, we created fully independent content versions to ensure a professional and authentic experience for everyone.
The result is a smooth, dual-language site where users can access high-quality immigration courses with total confidence.

The challenge

The main task was integrating a functional learning environment within a complex bilingual framework. We had to ensure that the educational content—lessons, courses, and resources—remained perfectly organised and easy to navigate in two different languages simultaneously.
The goal was to keep the learning experience simple while managing a heavy technical backend.

What we did
(and what we avoided)

  • Custom education portal

  • Independent bilingual architecture

  • Dual-language SEO

  • Responsive course layouts

  • Lazy translation hacks
  • Clunky navigation between course modules
  • Confusing student dashboards
  • Overwhelming interfaces

Our focus lies in delivering tangible bottom line outcomes that make a real impact.

  • LMS Framework Integration
    Setting up the technical structure to deliver courses and lessons seamlessly.
  • Bilingual Content Syncing
    Organising independent English and Russian versions of every educational resource.
  • Global SEO Optimisation
    Ensuring the platform is discoverable in both English and Russian search results.
  • UI/UX Refinement
    Crafting a clean, distraction-free environment for international students.

Awards

  • Best Innovation
    CSSDA / July 2023
  • Best UI Design
    CSSDA / July 2023
  • Best UX Design
    CSSDA / July 2023
  • Innovation Excellence

    CSSDA / March 2025

  • UI Design

    CSSDA / March 2025

  • UX Design

    CSSDA / March 2025

    • We were recommended to Studio Quatro and we would certainly recommend them to others. The team were super helpful, efficient and knowledgeable. We look forward to working with David and the team for future digital projects! Thanks again guys.
    Yulia / Director of Yulia Moiseeva and Associates

    Keep exploring