Context
Rayaska is a venture I co-founded. The team needed a public-facing site to introduce the company and showcase the work we've shipped for clients. I picked up two pieces of that site: the Navbar and the Client showcase section.
Most of my time on Rayaska goes into the business side, so the engineering scope here is intentionally focused. This case study only covers the parts of the site I authored. The rest of the codebase belongs to the team.
Navbar
The Navbar is the first thing every visitor hits, so it had to handle three jobs at once:
- Brand presence at every breakpoint. Logo always visible, nav links collapsing into a sheet on small screens.
- Section-aware highlighting. When the user scrolls to a section, the corresponding nav link picks up the active state. This is wired through an
IntersectionObserverrather than scroll position math, which keeps the highlight smooth across resize and zoom changes. - Sticky behavior with a soft backdrop. Translucent blur on scroll, sharper border once the user has moved past the hero. Tailwind handles the visual variants; the trigger is a single scroll listener.
The mobile menu is a slide-down sheet rather than a fullscreen takeover. Faster to dismiss, easier to one-hand on a phone.
Client section
The Client section showcases the companies Rayaska has worked with. The design constraint was simple to state and tricky to execute: a logo grid that has to look intentional at any count, from three logos to fifteen, without manual layout work per breakpoint.
The solution was a responsive auto-fit grid sized by logo aspect rather than fixed columns, so adding a new client doesn't break the layout. Logos are loaded as inline SVG where possible (the brand is mostly grayscale at this scale) so they pick up the surrounding theme color via currentColor rather than needing two image assets per brand.
A thin overlay of motion on initial reveal: each logo fades and lifts with a 60ms stagger. Subtle enough to not distract, present enough that the section doesn't feel static.
Why SvelteKit
The team made the SvelteKit call before I joined the engineering side. Working in it, the tradeoff matched well for a marketing site: less ceremony than Next.js for static content, and the reactive model maps cleanly to the small bits of interactivity these two sections needed (scroll-based active states, viewport-driven motion).
For a more application-shaped product surface I'd reach for Next.js by reflex. For a brand site with light interactivity, SvelteKit was a fine fit.
What I'd do differently
The Navbar's section-active logic ended up duplicating a small amount of state between the Navbar component and the page-level scroll handler. If I were rebuilding it, I'd lift that state into a single store and subscribe both pieces to it. Works correctly today, just slightly more wiring than it needs.