Fiddle.Digital is a small agency with Ukrainian roots, currently based in Vilnius, Lithuania, at the time of writing this article. From the very beginning, we’ve followed one core principle — quality over quantity. We had a solid website built with popular technologies, and it worked well. However, as time passed, we kept adding more projects to our portfolio, our experience grew, and our perspectives and approaches evolved.
The search for identity never truly stops. At some point, we realized that our design philosophy had shifted—our views had crystallized and taken on a clearer character.
It was time for a change. It was time for evolution.
Design and Development (From the Agency’s Perspective)
The biggest challenge we faced was battling ourselves. We wanted to improve what we already had, but we understood that real improvement was impossible without change—without changing ourselves.
And it was a long journey. Not so much a creative path as a mental one—hard work on ourselves, shifting our beliefs and habits.
Then something happened in the black box, and suddenly, the right materials started to appear on ‘paper’—colors, typography, 3D media, the first drafts of copywriting, art direction for animations, and more. Naturally, the first to undergo innovation was our beloved mascot, Susuwatari. It learned to communicate with us through a display showing four symbols: FDDA — Fiddle.Digital Design Agency.
And that’s when development began…
The Most Elusive Detail
This small decorative element became one of the biggest triggers for rethinking our approach to development. We stopped allowing ourselves to do whatever we wanted, simply relying on modern hardware’s power. However, we couldn’t discard the idea either, because it served a purpose—it was part of the DNA of the new branding.
Technically:
- A WebGL context pool runs multiple canvases in parallel, optimizing resources for smooth animations.
- We generate an image where each pixel becomes a small square in a mosaic.
- A noise-based algorithm assigns colors, and a WebGL shader maps them to icons.
- Colors fade at different rates, creating a dynamic trail effect.
- Grouping pixels (e.g., 2×2) forms larger icons, adding structure.
Tech Challenges
Smooth scrolling is undeniably cool. Nowadays, several well-known solutions are super easy to implement. We chose one of the most popular ones and integrated it into our existing layout. And then—it happened. The page started glitching, lagging, and in power-saving mode, it lost all its sanctity.
And then we heard it:
“I did some research, and I think I know how to create smooth scrolling using basic browser scroll events while maintaining performance even in power-saving mode.”
These were the words of Vlad Penev, Lead Engineer. Little did we know, we were stepping into a new era in our team’s journey…
New Direction
And that’s how our product, which we initially named String (now known as StringTune), was born. This journey started with smooth scrolling and hooks for elements entering the viewport. Over time, it evolved into an entire suite of modules:
- StringTune
- StringLoading
- StringFPSTracker
- StringPositionTracker
- StringResponsive
- StringScrollbar
- StringLazy
- StringVideoAutoplay
- StringAnchor
- StringParallax
- StringProgress
- StringLerp
- StringLerpTracker
- StringDelayLerpTracker
- StringGlide
- StringCursor
- StringMagnetic
- StringSplit
I want to highlight FPSTracker, which embodies our new vision, values, and direction. This module helps track a website’s efficiency and performance during development:
- If you see 60 FPS—well done.
- If it drops to 50 or below—don’t rush to add more heavy animations.
Our foundation finally gained a third strong leg:
- We are addicted to great design.
- This design flourishes only with high-quality implementation in code.
- The best user experience is achieved when the product runs silky smooth—without glitches or performance drops.
That was the revolution.
A High-Speed Chase at 60 FPS
It has always been there, but we took it for granted. Every design decision that comes to life through code comes at a cost—parallax, blend modes, 3D, sounds, ultra-high-resolution images.
We, as creators, crave the perfect picture so much that we rarely stop to think about the consequences.
Our team didn’t want that anymore. We needed balance. Our interfaces should be visually appealing, animated, and technologically advanced, of course. But at the same time, interaction should feel as satisfying as petting a cat.
How Much is Enough?
We got what we wanted. The digital product’s performance skyrocketed. And in our new balance formula, a free space emerged.
By using a single approach and managing all calculations from one logistical center, we took the first steps toward building new design solutions.
Mouse Tail
The first was additional content that followed the mouse and reacted to DOM elements. The effect itself isn’t groundbreaking, but the real achievement was how effortlessly it was created—thanks to StringTune.
We’re Designers—We Use Grids
We loved the idea of controlling the cursor coordinates so much that we started exploring more ways to apply it. We’re designers. We added a grid to some pages, bringing it to life with cursor interaction. On mobile, the grid animates as you scroll.
Overcoming Adversaries
We dedicated ourselves to fighting glitches. And having achieved significant success, we arrived at an unexpected solution: making controlled glitches part of the branding.
It’s a unique combination of zero-transition animations and smooth movements, which we now boldly use in page transitions.
DJ-Coded
On the About page, we didn’t just share our values through text and visuals—we created an audio recording that tells a brief story about FDDA’s creation. The main feature? An improvised vinyl that can scratch the audio.
(The New) Tech Stack
And that’s it.
Conclusion
We set ourselves a challenging goal: to change. And despite everything, we succeeded just the way we wanted. We trusted our instincts, surrendered to an adventure, and embraced transformation.
This journey brought us to a new stage—the new Fiddle.Digital—and a new product, StringTune. Initially, we created it for ourselves, but we soon realized it could be useful for anyone.
Explore StringTune
Credits
Fiddle.Digital Design Agency
- Operations: Olga Skrypka
- Censorship & Proofreading: Olga Skrypka
- Copywriting: Olga Skrypka, Dmytro Troshchylo
- Design: Dmytro Troshchylo
- Lead Engineer: Vlad Penev
- Creative Director & Technical Contributor: Dmytro Troshchylo
