PERSONAL PROJECT
PHR-5 — Designing a Plugin That Doesn’t Look Like Software
PHR-5 — Designing a Plugin That Doesn’t Look Like Software
PERSONAL PROJECT
PHR-5 — Designing a Plugin That Doesn’t Look Like Software
Solo project — engine, interface, brand, 3D, motion, and site — shipped with Claude Code as a build partner in under one week.
Solo project — engine, interface, brand, 3D, motion, and site — shipped with Claude Code as a build partner in under one week.
PROJECT OVERVIEW
A compact instrument with a complete world around it.
A compact instrument with a complete world around it.
THE PRODUCT
PHR-5 is a five-effect audio plugin for Ableton Live 12: Drive, Motion, Chop, Echo, and Space, chained downstream with five supporting controls and one main depth control per module.
THE INTENT
I wanted a tool for my own workflow, not another 200-parameter emulation. It needed to be immediately usable, tactile at a glance, and quiet enough that every control felt deliberate.
WHAT SHIPPED
A working VST3/AU plugin, the Timeless Sounds identity, a 3D asset pipeline, motion work, and a responsive marketing site — all sharing one hardware-first point of view.
MY ROLE
Concept, sound design, product design, visual identity, 3D art direction, motion direction, and the Framer site. Claude Code partnered on the JUCE implementation, Blender scenes, and build execution.
5
Effects in one fixed chain
Drive, Motion, Chop, Echo, Space — each feeds the next.
10
Factory presets
Factory presets
Two banks: Default and User. Ready immediately, still yours to tune and save.
Two banks: Default and User. Ready immediately, still yours to tune and save.
Live Visual readout
1
A CRT-style display that responds to the active module and incoming signal.
5
Modules / effects
Modules / effects
Each one is fully customizable allowing for endless sound design possibilities.
Each one is fully customizable allowing for endless sound design possibilities.
1
design system
design system
The device, website and product videos all share the same brand identity.
The device, website and product videos all share the same brand identity.
PROJECT OVERVIEW
A compact instrument with a complete world around it.
THE PRODUCT
PHR-5 is a five-effect audio plugin for Ableton Live 12: Drive, Motion, Chop, Echo, and Space, chained downstream with five supporting controls and one main depth control per module.
THE INTENT
I wanted a tool for my own workflow, not another 200-parameter emulation. It needed to be immediately usable, tactile at a glance, and quiet enough that every control felt deliberate.
WHAT SHIPPED
A working VST3/AU plugin, the Timeless Sounds identity, a 3D asset pipeline, motion work, and a responsive marketing site — all sharing one hardware-first point of view.
MY ROLE
Concept, sound design, product design, visual identity, 3D art direction, motion direction, and the Framer site. Claude Code partnered on the JUCE implementation, Blender scenes, and build execution.
5
Effects in one fixed chain
Drive, Motion, Chop, Echo, Space — each feeds the next.
10
Factory presets
Two banks: Default and User. Ready immediately, still yours to tune and save.
Live Visual readout
1
A CRT-style display that responds to the active module and incoming signal.
5
Modules / effects
Each one is fully customizable allowing for endless sound design possibilities.
1
design system
The device, website and product videos all share the same brand identity.
Where I started
Where I started
Where I started
I wanted a tool built for my own workflow, not another 200-parameter emulation. It had to be immediately usable, tactile at a glance, and quiet enough that every control felt deliberate.
The direction came quickly. I gathered visual references, sketched low-fidelity layouts on paper to test the physical logic of the device, then moved into Figma to design a high fidelity interactive prototype. A few iterations later, the final interface came together.
I wanted a tool for my own workflow, not another 200-parameter emulation. It needed to be immediately usable, tactile at a glance, and quiet enough that every control felt deliberate.
The interface is built like a physical instrument: one clear hierarchy, visible depth, and nothing that needs a tooltip.
The interface is built like a physical instrument: one clear hierarchy, visible depth, and nothing that needs a tooltip.
The interface is built like a physical instrument: one clear hierarchy, visible depth, and nothing that needs a tooltip.
1
2
3
4
5
6
7
8
9
10
1
2
3
4
5
6
7
8
9
10
1 CRT display
The live readout. Each module draws its own scene here.
2 Preset line
Bank, preset name, save, and arrows to step through the factory bank.
3 Tempo readout
Detected BPM. Chop and Echo lock to it.
4 Main control
The one parameter that defines the selected module’s depth or intensity.
5 Module keys
Drive, Motion, Chop, Echo, Space, and Dice — the fixed chain.
6 Secondary controls
Shape, speed, or time — the details that change how the main control behaves.
7 Module keys
DRIVE, MOTION, CHOP, ECHO, SPACE, and DICE.
8 Mode row
The selected module’s two voices; one lit.
9 ON switch
Engages the selected module. Off means bypassed.
10 Side rails
Grip; the device’s only soft-touch edges.
02 — from figma to juce
01 — from figma to juce
Building the MVP.
Building the MVP.
Building the MVP.
Once I had the final prototype of the device, it was time to build the MVP in JUCE with Claude Code handling the implementation work. This left me focused on what the plugin should sound like and how its parameters should feel. Once all five stages were clean, automatable, and chained correctly, the engine was done — and only then did design start.
Once I had the final prototype of the device, it was time to build the MVP in JUCE with Claude Code handling the implementation work. This left me focused on what the plugin should sound like and how its parameters should feel. Once all five stages were clean, automatable, and chained correctly, the engine was done — and only then did design start.
01 — The MVP
I created a project brief and gave it to Claude Code to start the implementation. This resulted in the creation of the first MVP with the 5 dedicated effects, each of them fully modulable with their respective knobs.
Drive · Motion · Chop · Echo · Space
The first few coding sessions where fully dedicated to building the engine, disregarding the design completely. Once all the functionalities where there, it was time to add the skeumorphism design.
02 — Adding Skeumorphism
The philosophy behind this plugin was simple: don’t make it look like software. In order for the plugin to look like hardware, a big emphasis was put on lighting, shadows, gradients and textures to replicate a real feel that will resonate with users.
A product that triggers an emotional reaction at first, is a product that will be remembered, and this is exactly what PHR-5 is trying to achieve.
Nothing and Teenage Engineering as references for restraint
02 — Adding Skeumorphism
The philosophy behind this plugin was simple: don’t make it look like software. In order for the plugin to look like hardware, a big emphasis was put on lighting, shadows, gradients and textures to replicate a real feel that will resonate with users.
A product that triggers an emotional reaction at first, is a product that will be remembered, and this is exactly what PHR-5 is trying to achieve.
Nothing and Teenage Engineering as references for restraint
04 — From a plugin to a brand
02 — From a plugin to a brand
From design pixels, to code fuelling the sound engine.
From design pixels, to code fuelling the sound engine.
From design pixels, to code fuelling the sound engine.
With a high-fidelity prototype locked and the JUCE implementation done, I moved on to creating the Timeless Brand. With this brand, I wanted to create a combination of Teenage Engineering and Nothing, keeping the negative space of teenage engineering, and the visual look of Nothing for the product mockups.
With a high-fidelity prototype locked and the JUCE implementation done, I moved on to creating the Timeless Brand. With this brand, I wanted to create a combination of Teenage Engineering and Nothing, keeping the negative space of teenage engineering, and the visual look of Nothing for the product mockups.
04 — Thinking about the materials
Programmatic materials keep the binary small: no texture files to ship, no filmstrips to load, just the same chassis drawn cleanly every time across hosts and DAWs.
Programmatic materials keep the binary small: no texture files to ship, no filmstrips to load, just the same chassis drawn cleanly every time across hosts and DAWs.
VST3 / AU · Native rendering · Automatable parameters
Screenshot, compare, adjust — until the build held up beside the Figma file.
05 — Brand system
The finished product became the foundation for a Timeless Sounds guide: tone of voice, color use, typography, and logo handling that future products can inherit.
View the brand-guide
06 — 3D and motion
To photograph a product that didn’t exist physically, I built an exact Blender replica. Those renders became the source for a product showcase and an internal component-explosion loop made with Veo 3.
Blender renders → Veo 3 motion → hardware-grade marketing assets
05 — Creating the product assets
03 — Creating the product assets
Designed to trigger an emotional reaction.
Designed to trigger an emotional reaction.
The plugin’s 3D replica gave me control of materials, studio lighting, and camera angle — the same levers a hardware photographer would have — rather than asking a flat screenshot to carry the entire launch.
This let me generate a set of high-fidelity mockups with precise control over camera aperture, shutter speed, focus blur, grain, lighting, and more. These visually rich renders are essential to triggering the emotional response the product is aiming for. Thanks to the aesthetic-usability effect, a product that looks good is instinctively perceived as easier to use, and PHR-5 leans deliberately into this cognitive bias.
This let me generate a set of high-fidelity mockups with precise control over camera aperture, shutter speed, focus blur, grain, lighting, and more. These visually rich renders are essential to triggering the emotional response the product is aiming for. Thanks to the aesthetic-usability effect, a product that looks good is instinctively perceived as easier to use, and PHR-5 leans deliberately into this cognitive bias.
06 — The site
04 — The site
Marketing website: product landing page
Marketing website: product landing page
Marketing website: product landing page
The Next step was to make a marketing website to showcase the product. I designed the website's UI in Figma, and then implemented it in on Framer. The website is fully responsive and live at:
The Next step was to make a marketing website to showcase the product. I designed the website's UI in Figma, and then implemented it in on Framer. The website is fully responsive and live at:
Website Link
06 — The site
05 — The Assets
The final expression of the instrument.
The final expression of the instrument.
The landing page treats PHR-5 like a physical product: a controlled visual field, carefully scaled product imagery, and copy written like documentation for an instrument rather than marketing for software.
The landing page treats PHR-5 like a physical product: a controlled visual field, carefully scaled product imagery, and copy written like documentation for an instrument rather than marketing for software.
Videos were generated using blender renders as references in Google Flow. Thanks to the Omni model, I was able to generate high end, professional product videos for the plugin .
Videos were generated using blender renders as references in Google Flow. Thanks to the Omni model, I was able to generate high end, professional product videos for the plugin .
07 — Outcome
06 — Outcome
A complete product system — and the one thing I’d change.
A complete product system — and the one thing I’d change.
PHR-5 shipped as a working five-effect audio plugin with a complete Timeless Sounds identity, a 3D-to-motion asset pipeline, and a responsive site built in under 48 hours.
PRODUCT
A fully skeuomorphic VST3/AU plugin running natively — not skinned, not built from baked textures.
A fully skeuomorphic VST3/AU plugin running natively — not skinned, not built from baked textures.
BRAND
A durable Timeless Sounds system for future instruments: voice, color, typography, and logo behavior.
A durable Timeless Sounds system for future instruments: voice, color, typography, and logo behavior.
ASSETS
A 3D and motion pipeline that produces hardware-grade marketing material for a product that never physically existed.
A 3D and motion pipeline that produces hardware-grade marketing material for a product that never physically existed.
What I’d do differently
What I’d do differently
Design the signature element first.
Design the signature element first.
The generative display became the product’s most distinctive feature, but it was designed after the engine and the rest of the interface were already locked.
Let it shape the technical decisions.
Let it shape the technical decisions.
Next time, the feature everyone notices first shapes the early architecture instead of being bolted on once everything else is settled.
Tools
Tools
JUCE 8 · Figma · Claude Code · Blender · Veo 3 (Google Flow) · Framer · Ableton Live 12
Matteo
Matteo
Favetta
Favetta
UX / Product Designer based in The Hague (NL), specialised in Applied Cognitive Psychology
Good design is when the artefact does all the talking.
Cognitive psychologist turned product designer, I remove assumptions before I remove pixels. That same discipline shapes how I use every tool in my stack, AI included: never for the shortcut, always for the outcome.
4+
Years of research and design
1
Published Scientific Paper
© 2026 Matteo Favetta. All rights reserved.
Next up: Personal Trading Advisor App
Full-stack trading platform combining news sentiment analysis, SEC 8-K/EDGAR monitoring, and LLM-driven signal generation. Encodes a personal trading strategy into a dashboard that visualizes entry points, stop-loss, and take-profit levels around catalyst events.
View project
Next up: Personal Trading Advisor App
Full-stack trading platform combining news sentiment analysis, SEC 8-K/EDGAR monitoring, and LLM-driven signal generation. Encodes a personal trading strategy into a dashboard that visualizes entry points, stop-loss, and take-profit levels around catalyst events.
View project
Next up: Personal Trading Advisor App
Full-stack trading platform combining news sentiment analysis, SEC 8-K/EDGAR monitoring, and LLM-driven signal generation. Encodes a personal trading strategy into a dashboard that visualizes entry points, stop-loss, and take-profit levels around catalyst events.
View project
Matteo Favetta
UX / Product Designer based in The Hague, Netherlands, speciliased in Applied Cognitive Psychology
4+
Years of Research & Design
1
Published Scientific Paper
5
Global Markets Optimized
Faceland Projects
Personal Projects
Cognitively Enhanced Designs. © 2026 Matteo Favetta. All rights reserved.
Matteo Favetta
UX / Product Designer based in The Hague, Netherlands, speciliased in Applied Cognitive Psychology
4+
Years of Research & Design
1
Published Scientific Paper
5
Global Markets Optimized
Faceland Projects
Personal Projects
Cognitively Enhanced Designs. © 2026 Matteo Favetta. All rights reserved.
Matteo Favetta
UX / Product Designer based in The Hague, Netherlands, speciliased in Applied Cognitive Psychology
4+
Years of Research & Design
1
Published Scientific Paper
5
Global Markets Optimized
Faceland Projects
Personal Projects
Cognitively Enhanced Designs. © 2026 Matteo Favetta. All rights reserved.
Next up: Personal Trading Advisor App
Full-stack trading platform combining news sentiment analysis, SEC 8-K/EDGAR monitoring, and LLM-driven signal generation. Encodes a personal trading strategy into a dashboard that visualizes entry points, stop-loss, and take-profit levels around catalyst events.
View project