CRAFTING HIGH-END INTERFACES
CRAFTING HIGH-END INTERFACES
CRAFTING HIGH-END INTERFACES
Designing Digital
Designing Digital
Designing Digital
Experiences
Experiences
Experiences
CORE EXPERTISE · 01
Design, development, and systemsworking as one.
Design, development, and systemsworking as one.
Design, development, and systemsworking as one.
I shape digital experiences from first idea to final interaction, keeping strategy, visual craft, and implementation closely connected.
I shape digital experiences from first idea to final interaction, keeping strategy, visual craft, and implementation closely connected.
01 / EXPERIENCE
Experience Design
Experience Design
Clear interfaces shaped around real user behavior, strong hierarchy, and responsive interaction.
UX DIRECTION · UI SYSTEMS · PROTOTYPING
02 / DEVELOPMENT
Framer Development
Framer Development
Production-ready Framer builds with flexible structure, precise responsiveness, and purposeful motion.
CMS · RESPONSIVE BUILD · INTERACTIONS
03 / IDENTITY
Digital Identity
Digital Identity
Distinct visual languages that stay coherent across landing pages, products, and interactive brand moments.
ART DIRECTION · TYPE · VISUAL SYSTEMS
ABOUT ME · 02
I believe that every pixel should tell a deliberate story.
I believe that every pixel should tell a deliberate story.
Built through years of hands-on craftsmanship and creative problem solving, I design digital experiences with precision, structure, and intent. Every detail matters — from typography and motion to the way a website feels when someone first lands on it.
Combining a background in construction, technology, and design, I create modern websites that balance aesthetics with functionality. Clean visuals, thoughtful interactions, and purposeful user experiences are at the core of every project I build.
INSPIRATION · 03
Designed to Be Experienced
Designed to Be Experienced
Designed to Be Experienced
Six principles that turn modern interfaces into clear, responsive, and memorable digital experiences.
Six principles that turn modern interfaces into clear, responsive, and memorable digital experiences.
01
Micro Interactions
Micro Interactions
Micro Interactions
Small responses create trust. Every hover, press, and cursor cue confirms intent without interrupting momentum.
Small responses create trust. Every hover, press, and cursor cue confirms intent without interrupting momentum.
DRAG / PRESS
HOVER TO LIFT
PRESS TO PULSE
DRAG / PRESS
HOVER TO LIFT
PRESS TO PULSE
02
Smooth Animation
Smooth Animation
Smooth Animation
Layered movement guides attention with restraint—depth, timing, and easing working together as one system.
Layered movement guides attention with restraint—depth, timing, and easing working together as one system.
03
Scroll Storytelling
A narrative unfolds in sequence. Content arrives only when it earns attention, creating rhythm instead of overload.
03
Scroll Storytelling
A narrative unfolds in sequence. Content arrives only when it earns attention, creating rhythm instead of overload.
03
Scroll Storytelling
A narrative unfolds in sequence. Content arrives only when it earns attention, creating rhythm instead of overload.
01 / Establish context
02 / Reveal the turning point
03 / Resolve with clarity
04
Responsive Design
Responsive Design
Responsive Design
One hierarchy, intelligently recomposed. The experience keeps its rhythm and clarity at every viewport.
One hierarchy, intelligently recomposed. The experience keeps its rhythm and clarity at every viewport.
0.8s
LOAD
60
FPS
100
SCORE
Optimized assets · minimal layout shift · instant feedback
05
Performance Optimized
Performance Optimized
Performance Optimized
Speed is part of the design. Lightweight decisions protect attention and keep every interaction immediate.
Speed is part of the design. Lightweight decisions protect attention and keep every interaction immediate.
06 / THE COMPLETE SYSTEM
Premium User Experience
Premium User Experience
Premium User Experience
Craft is the alignment of motion, performance, responsiveness, and clarity—felt as one effortless experience.
Craft is the alignment of motion, performance, responsiveness, and clarity—felt as one effortless experience.
INTENT
MOTION
CLARITY
SPEED
SCALE
CRAFT
SELECTED WORK · 04
Selected Work. make every interaction matter.
Selected Work. make every interaction matter.
Selected Work. make every interaction matter.
A selection of digital experiences shaped through strategy, visual systems, Framer development, and precise motion.
A selection of digital experiences shaped through strategy, visual systems, Framer development, and precise motion.
01 / INTERACTIVE HERO CONCEPT
Fluid Intelligence, Engineered.
Laurin Studio
Studio Concept
Interactive Hero
A cinematic hero experience exploring how motion, typography, and interaction can transform a first impression into an engaging digital narrative. Designed to showcase the impact of purposeful animation in modern web design.
CHALLENGE
Create an interactive hero that immediately captures attention while balancing visual impact, performance, and clarity without overwhelming the user.
MY SOLUTION
Designed a cinematic hero using refined motion, typography, and smooth interactions to create a memorable first impression.
TIMELINE
1 Week
MY ROLE
UI/UX Designer & Framer Developer
PLATFORM
Framer
SERVICES
UI Design • Motion Design • Interactive Hero
KEY DELIVERABLES
Interactive Hero
Motion System
Responsive Layout
Framer Prototype
STUDIO NOTE
Created to explore how cinematic motion and refined interactions can elevate a visitor's first impression while maintaining clarity and performance.
Laurin Güdel • Laurin Studio
01 / INTERACTIVE HERO CONCEPT
Fluid Intelligence, Engineered.
Laurin Studio
Studio Concept
Interactive Hero
A cinematic hero concept using motion, typography, and interaction to turn a first impression into a memorable digital experience.
CHALLENGE
Create an interactive hero that immediately captures attention while balancing visual impact, performance, and clarity without overwhelming the user.
MY SOLUTION
Designed a cinematic hero using refined motion, typography, and smooth interactions to create a memorable first impression.
TIMELINE
1 Week
MY ROLE
UI/UX Designer & Framer Developer
PLATFORM
Framer
KEY DELIVERABLES
Interactive Hero
Motion System
Responsive Layout
Framer Prototype
01 / INTERACTIVE HERO CONCEPT
Fluid Intelligence, Engineered.
Laurin Studio
Studio Concept
Interactive Hero
CHALLENGE
Create an interactive hero that immediately captures attention while balancing visual impact, performance, and clarity without overwhelming the user.
MY SOLUTION
Designed a cinematic hero using refined motion, typography, and smooth interactions to create a memorable first impression.
TIMELINE
1 Week
MY ROLE
UI/UX Designer & Framer Developer
PLATFORM
Framer
KEY DELIVERABLES
Interactive Hero
Motion System
Responsive Layout
Framer Prototype
02 / CLIENT WEBSITE
Adventure Starts at the Shore.
The Paleta Boards
Client Project
Paddle Board Rental
A premium booking website designed to showcase paddle board rentals through calm visuals, intuitive navigation, and a mobile-first experience. Built to increase trust, simplify reservations, and reflect the relaxed spirit of the brand.
CHALLENGE
Build a premium online presence that communicates trust, showcases the rental experience, and makes booking paddle boards simple across every device.
MY SOLUTION
Crafted a clean, mobile-first booking experience with intuitive navigation, immersive visuals, and thoughtful interactions that reflect the relaxed personality of the brand.
TIMELINE
2 Weeks
MY ROLE
Web Designer & Framer Developer
PLATFORM
Framer
SERVICES
Web Design • Responsive • Booking
KEY DELIVERABLES
Business Website
Booking Flow
Mobile Experience
Brand Showcase
CLIENT TESTIMONIAL
“Laurin truly understood our vision and transformed it into a beautiful, professional website. Excellent communication, attention to detail, and a fantastic result.”
Haruki Gohara • Founder • The Paleta Boards
02 / CLIENT WEBSITE
Adventure Starts at the Shore.
The Paleta Boards
Client Project
Paddle Board Rental
A premium booking website that makes paddle board rentals clear, intuitive, and easy to trust.
CHALLENGE
Build a premium online presence that communicates trust, showcases the rental experience, and makes booking paddle boards simple across every device.
MY SOLUTION
Crafted a clean, mobile-first booking experience with intuitive navigation, immersive visuals, and thoughtful interactions that reflect the relaxed personality of the brand.
TIMELINE
2 Weeks
MY ROLE
Web Designer & Framer Developer
PLATFORM
Framer
KEY DELIVERABLES
Business Website
Booking Flow
Mobile Experience
Brand Showcase
02 / CLIENT WEBSITE
Adventure Starts at the Shore.
The Paleta Boards
Client Project
Paddle Board Rental
CHALLENGE
Build a premium online presence that communicates trust, showcases the rental experience, and makes booking paddle boards simple across every device.
MY SOLUTION
Crafted a clean, mobile-first booking experience with intuitive navigation, immersive visuals, and thoughtful interactions that reflect the relaxed personality of the brand.
TIMELINE
2 Weeks
MY ROLE
Web Designer & Framer Developer
PLATFORM
Framer
KEY DELIVERABLES
Business Website
Booking Flow
Mobile Experience
Brand Showcase
03 / STUDIO EXPLORATION
Water, Reimagined Digitally.
Laurin Studio
Studio Exploration
Water Experience
A concept website inspired by the movement and clarity of water, using fluid animations and immersive storytelling to create a calm, memorable browsing experience. Built to explore motion as a core design language.
CHALLENGE
Translate the feeling of water into a digital experience that feels immersive, calm, and fluid while maintaining readability and intuitive navigation.
MY SOLUTION
Combined fluid animations, immersive layouts, and a restrained visual system to recreate the movement and tranquility of water through a modern web experience.
TIMELINE
1 Week
MY ROLE
UI/UX Designer & Framer Developer
PLATFORM
Framer
SERVICES
UI Design • Motion Design • Scroll Experience
KEY DELIVERABLES
Landing Page
Scroll Experience
Motion System
Responsive Design
STUDIO NOTE
A creative exploration focused on translating the movement and tranquility of water into a premium digital experience through animation and thoughtful interaction.
Laurin Güdel • Laurin Studio
03 / STUDIO EXPLORATION
Water, Reimagined Digitally.
Laurin Studio
Studio Exploration
Water Experience
A fluid digital experience translating the movement and clarity of water into calm, immersive storytelling.
CHALLENGE
Translate the feeling of water into a digital experience that feels immersive, calm, and fluid while maintaining readability and intuitive navigation.
MY SOLUTION
Combined fluid animations, immersive layouts, and a restrained visual system to recreate the movement and tranquility of water through a modern web experience.
TIMELINE
1 Week
MY ROLE
UI/UX Designer & Framer Developer
PLATFORM
Framer
KEY DELIVERABLES
Landing Page
Scroll Experience
Motion System
Responsive Design
03 / STUDIO EXPLORATION
Water, Reimagined Digitally.
Laurin Studio
Studio Exploration
Water Experience
CHALLENGE
Translate the feeling of water into a digital experience that feels immersive, calm, and fluid while maintaining readability and intuitive navigation.
MY SOLUTION
Combined fluid animations, immersive layouts, and a restrained visual system to recreate the movement and tranquility of water through a modern web experience.
TIMELINE
1 Week
MY ROLE
UI/UX Designer & Framer Developer
PLATFORM
Framer
KEY DELIVERABLES
Landing Page
Scroll Experience
Motion System
Responsive Design
04 / STUDIO WEBSITE
Crafting Digital Experiences.
Laurin Studio
Portfolio Website
Design Studio
The digital home of Laurin Studio, created to showcase projects through refined interactions, thoughtful storytelling, and a cohesive design system. Designed to communicate craftsmanship, precision, and premium web experiences.
CHALLENGE
Create a portfolio that reflects the quality of the work itself, communicates credibility quickly, and differentiates the studio in a highly competitive market.
MY SOLUTION
Built a cohesive portfolio around motion, storytelling, and editorial layouts to showcase each project with clarity while establishing a distinctive studio identity.
TIMELINE
Ongoing
MY ROLE
Creative Director, Designer & Developer
PLATFORM
Framer
SERVICES
Branding • Web Design • Framer
KEY DELIVERABLES
Portfolio Website
Brand Identity
Design System
Case Studies
STUDIO NOTE
An ongoing studio project that evolves alongside my skills, showcasing new ideas, refined interactions, and a growing collection of client work.
Laurin Güdel • Laurin Studio
04 / STUDIO WEBSITE
Crafting Digital Experiences.
Laurin Studio
Portfolio Website
Design Studio
Laurin Studio’s portfolio, shaped through refined interaction, editorial storytelling, and a cohesive design system.
CHALLENGE
Create a portfolio that reflects the quality of the work itself, communicates credibility quickly, and differentiates the studio in a highly competitive market.
MY SOLUTION
Built a cohesive portfolio around motion, storytelling, and editorial layouts to showcase each project with clarity while establishing a distinctive studio identity.
TIMELINE
Ongoing
MY ROLE
Creative Director, Designer & Developer
PLATFORM
Framer
KEY DELIVERABLES
Portfolio Website
Brand Identity
Design System
Case Studies
04 / STUDIO WEBSITE
Crafting Digital Experiences.
Laurin Studio
Portfolio Website
Design Studio
CHALLENGE
Create a portfolio that reflects the quality of the work itself, communicates credibility quickly, and differentiates the studio in a highly competitive market.
MY SOLUTION
Built a cohesive portfolio around motion, storytelling, and editorial layouts to showcase each project with clarity while establishing a distinctive studio identity.
TIMELINE
Ongoing
MY ROLE
Creative Director, Designer & Developer
PLATFORM
Framer
KEY DELIVERABLES
Portfolio Website
Brand Identity
Design System
Case Studies
CHAPTER ONE
This is only
the beginning.
Four Projects Built With Intention.
The Next One Could Be Yours.
CHAPTER ONE
This is only
the beginning.
Four Projects Built With Intention.
The Next One Could Be Yours.
CHAPTER ONE
This is only
the beginning.
Four Projects Built With Intention.
The Next One Could Be Yours.
CONTRA · 05
Work with Laurin through Contra
Work with Laurin through Contra
Work with Laurin through Contra
A premium booking path for sharp Framer builds, refined interaction systems, and product-minded web experiences — scoped clearly and ready to move.
A premium booking path for sharp Framer builds, refined interaction systems, and product-minded web experiences — scoped clearly and ready to move.
A premium booking path for sharp Framer builds, refined interaction systems, and product-minded web experiences — scoped clearly and ready to move.
Framer strategy
Framer strategy
Premium execution
Premium execution
Clear scopes
Clear scopes
CONTACT ME · 06
Let’s build something worth remembering.
Let’s build something worth remembering.
Have a project, product, or ambitious idea in mind? Let’s shape it into a clear, refined digital experience built to perform.
CONTACT ME · 06
Let’s build something worth remembering.
Have a project, product, or ambitious idea in mind? Let’s shape it into a clear, refined digital experience built to perform.
L
Laurin Guedel
Premium Framer design, development, and interaction systems — crafted with clarity, speed, and a sharp eye for motion.
© 2026 Laurin Studio. Built in Framer.
© 2026 Laurin Studio. Built in Framer.
Open for selected projects