Freelancers in CheltenhamFreelancers in Cheltenham
ProjectsPeople
Finn Gedge Gibb's avatar
Finn Gedge Gibb
proStroud, UK
CRO & Growth expert for DTC E-com Brands | Shopify & Replo
$1k+
Earned
1x
Hired
5.0
Rating
95
Followers
REPLO_EXPERT

expert

CRO & Growth expert for DTC E-com Brands | Shopify & Replo
Cover image for 🎹 🎶 PadLab: an SP-404
🎹 🎶 PadLab: an SP-404 sampler that lives in your browser I used to make beats on a Roland SP-404. Chop a sample, lay down a drum loop, play melodies over the top, resample, repeat. It's one of the most fun ways to make music there is. The problem is you need the hardware in front of you, you need the space to set it up, and if an idea hits while you're away from your gear, it's gone by the time you get back. So I built the thing I wished existed: a browser-based SP-404 that captures that exact workflow, with nothing to buy and nothing to install. Open a tab and you're making beats. The problem it solves Hardware samplers are expensive and they tie you to a desk. Beginners can't justify the cost to find out if they even like sampling. Producers with ideas on the move have nowhere to put them. PadLab lowers the barrier to basically zero. If you want to learn the SP-404 workflow, capture a quick idea, or just mess around, you can do it from any laptop. What it does It's a faithful recreation of the SP-404 feel, not just the look. The core of it is built around two things the real hardware nails and most software forgets: Chop. Load a drum break or a sample, slice it on the waveform (tap in time or auto-detect the hits), and each slice lands on its own pad ready to play. This is the heart of sampling and it's the most satisfying part to use. Quantised recording. Hit record, get a one bar count-in, and your performance is captured locked to the beat. No mouse fumbling, no dead air at the start of your loop. Everything is keyboard driven so your hands stay on the pads the way they would on real hardware. Then you layer loops, resample them down, arrange them on a timeline, and export straight into your DAW. How I built it (this is the fun part) This project was as much about the workflow as the app. Here's the actual pipeline. I started in Claude with the Figma MCP connected, and used it to turn my rough idea into a proper project brief before touching Make. That's where the thinking happened: the visual direction, typography, colour system, the UI layout, how the SP-404 workflow should map to a screen. Doing this planning up front meant I got the structure right early and conserved my AI budget for the complex build later instead of burning it re-prompting from scratch. From there, using the Figma MCP, we built the design system straight into Figma, made a sample UI, and assembled a reference board packed with in-depth build specs. Then I spun up a new Figma Make project and imported that whole design board as context, so Make started with a fully briefed understanding of what it was building rather than a one-line prompt. Then came the real work: a prototype first, then feature by feature, wiring each one up, testing, debugging, repeating. Seventy-four versions in total. Make's Plan feature was key for working through the complex tasks and integrations (the audio engine, quantised recording, the chop tool), and I leaned on higher-power models like Opus inside Make to push through the gnarly debugging and problem areas. So the flow was: Claude + Figma MCP to plan and design, a spec-rich reference board to brief Make, then Make to build and iterate. Designing the hardware visually, briefing it thoroughly, and watching it become real playable software across 74 passes is a way of building that didn't exist a year ago. 🌐 Try it live: https://spill-size-79673265.figma.site/ (https://spill-size-79673265.figma.site/)🔗 Working file: https://www.figma.com/make/l5Izmvzog8il3W3IxUWyLS/PADLab--Sampler-Emulator---Digital-Audio-Workstation (https://www.figma.com/make/l5Izmvzog8il3W3IxUWyLS/PADLab--Sampler-Emulator---Digital-Audio-Workstation)🎨 Figma Community: https://www.figma.com/community/file/1649544820794263929/padlab-physical-sampler-emulator-audio-workstation Built for the Config Makeathon with Figma Make + MCP. #ConfigMakeathon @figma Have fun!
2
4
165
Cover image for Shopify Store Design & Development For Mad Fine
Shopify Store Design & Development For Mad Fine
2
63
Cover image for Replo CRO: Optimising The Supplement Buying Experience
Replo CRO: Optimising The Supplement Buying Experience
1
161
Cover image for Shopify Design: Creating A New E-Com Store for Fairymount Jerky
Shopify Design: Creating A New E-Com Store for Fairymount Jerky
0
43
Joseph I's avatar
Joseph I
proWorcester, UK
Full-stack developer - Next.js, Node.js, and AI Integration.
5.0
Rating
13
Followers
Full-stack developer - Next.js, Node.js, and AI Integration.
Cover image for If Coca-Cola reached out for
If Coca-Cola reached out for rebranding
2
1
76
Cover image for Addictive animated website for a
Addictive animated website for a car brand
1
69
Cover image for Addictive cinematic animated website
Addictive cinematic animated website
2
6
180
Cover image for Stunning Animated Website Design for Top Car Brand
Addictive animated website for a car brand 🔥
3
3
82
James Kearsey's avatar
James Kearsey
Worcester, UK
Motion Designer & Animator
9
Followers
Motion Designer & Animator
Cover image for One of a collection of
One of a collection of social post templates used to attract more attention for marketing copy. successfully started conversations on specific topics and drove engagement on social platforms.
2
43
Cover image for It was a pleasure to
It was a pleasure to work with the talented Janco Mouton (https://www.linkedin.com/in/janco-mouton-1a6b79180/) on this collab project, the sound design took me on a PlayStation 1 nostalgia trip, Jetmoto2 anyone? Shout out to Marc Lawrence (https://www.linkedin.com/in/marclawrence1/) & John Green (https://www.linkedin.com/in/john-green-a9b83849/) for once again managing to wrangle motion & sound designers together 👌 Animated in After Effects by me 🖱️ Sound design by Janco Mouton 🎵 Designed by Franco Grignani circa 1956 ✏️
11
13
228
Cover image for GCSE course launch for an
GCSE course launch for an Edtech company, a promo showcasing the key information for students looking to improve their maths skills before heading into their GCSE exams. This was part of a larger package, including; course videos, web micro interactions, and short social video content.
1
31
Cover image for Sometimes, I look at a
Sometimes, I look at a brand and think of ways in which I could add some spice, I had some spare time so produced a teeny, tiny spec project for DASH Water (https://www.linkedin.com/company/dash-water/)
1
35
Finn Elliott's avatar
Finn Elliott
Gloucester, UK
Beautiful websites to support your business goals
Beautiful websites to support your business goals
Cover image for Teaching 4 Business
Teaching 4 Business
0
2
Cover image for Carlo Delicatessen
Carlo Delicatessen
0
2
Cover image for Gaffney Zoppi
Gaffney Zoppi
0
1
Placeholder project card media
View more →
Blends Commerce| Creative Agency's avatar
Blends Commerce| Creative Agency
Stratford-upon-Avon CV37, UK
Shopify CRO Strategist | 10x Conversion for ECommerce Brands
Shopify CRO Strategist | 10x Conversion for ECommerce Brands
Cover image for Shopify Checkout Redesign for Blacktailor
Shopify Checkout Redesign for Blacktailor
0
15
Cover image for Optimized Chubbies store with CRO updates to product page
Optimized Chubbies store with CRO updates to product page
0
5
Cover image for Shopify CRO Optimization for Hunter Boots| 10x page conversion
Shopify CRO Optimization for Hunter Boots| 10x page conversion
1
6
Placeholder project card media
View more →
David Beesley's avatar
David Beesley
Cheltenham, UK
David Beesley is a Web Developer based in Cheltenham, UK
David Beesley is a Web Developer based in Cheltenham, UK
Cover image for Chariot Biosciences
Chariot Biosciences
0
8
Cover image for Emyr Evans
Emyr Evans
0
4
Cover image for Cognify 2018
Cognify 2018
0
6
Placeholder project card media
View more →