PLABAID is a science-themed website designed to support medical students in navigating their PLAB journey with experienced guidance. The website seamlessly blends functionality with aesthetics, offering a highly responsive design that adapts effortlessly to all devices.

It features:

A complex yet captivating animated scroll page that brings the content to life.

Science-inspired intellectual design and compelling imagery to engage users.

A clean and concise user interface, ensuring an intuitive browsing experience.

Custom-designed icons crafted in Figma, adding a unique and personal touch.

Glassmorphism effects, offering a sleek, modern aesthetic.

Smooth scrollable animations, enhancing the flow of user interaction.

Custom loading animations, setting the tone with a creative introduction.

Intersection observer-based animations, ensuring elements animate precisely as they come into view.

I designed the Home Loading Page to match the color and font selection of the website

The Hero Section showcases an dynamic animated image, offering users a captivating preview of the webpage's overall design and aesthetic.

This is undoubtedly the most captivating aspect of the webpage. It was a challenging yet rewarding experience, as it marked my first attempt at creating this type of scroll animation. Built with GSAP, the animation reveals a new image and text with every scroll, all seamlessly unfolding within the same viewport.

The About Section designed with Glass-Morphism, features an array of bright, vibrant images paired with dynamic scroll animations. Its theme reflects the brand's scientific vision, creating a visually engaging and cohesive experience.

The Navigation Bar incorporates a sleek Glass-morphism design, enhanced with a hover effect and a smooth toggle animation, adding both functionality and visual appeal.

The Services page is thoughtfully crafted to clearly outline the brand's offerings. Designed with custom images and icons created in Figma, it features a simple, user-focused layout to ensure accessibility and ease of understanding.

The Contact section features striking full-width and full-height images that enhance the website's overarching glassmorphism aesthetic. Highly animated, this section includes the brand's contact details and a customizable form where users can provide their information to tailor their experience, adding a personal touch and a sense of individuality.

https://plabaid.netlify.app/