Sales
Representative
Transforming B2B Sales Through Strategic Leadership & Innovation
Loading Three.js Text...
Loading Three.js Text...
Loading Three.js Text...
Loading Three.js Text...
Why Choose Me?
I bring together design excellence and technical expertise to deliver solutions that drive real business results.
15 Years Combined Experience
A decade of design expertise merged with 5 years of full-stack development mastery.
Pixel-Perfect & Accessible
WCAG AA compliant designs that look flawless on every device and serve every user.
90+ Lighthouse Performance
Lightning-fast applications optimized for speed, SEO, and exceptional user experience.
End-to-End Solutions
From strategic planning to final deployment, I handle every aspect of your project.
Revenue Generated
for clients across Europe
Projects Completed
from startups to enterprises
Training Data Points
processed for AI models
Client Satisfaction
average project rating
Fast Data
Numbers that speak for themselves. Real results from real projects.
Revenue Generated
for clients across Europe
Projects Completed
from startups to enterprises
Training Data Points
processed for AI models
Client Satisfaction
average project rating
Skills & Expertise
Discover my professional skills through real-world projects and measurable results
Prompt for Layered Text Effect Component
Complete technical specifications for recreating the 3D layered text effect
Create a React component called LayeredTextEffect
that generates interactive 3D text with shadows using Three.js. Here are the exact specifications:
Component Requirements:
- Framework: React with TypeScript
- 3D Library: Three.js with three-stdlib
- Mouse Controls: Full OrbitControls (rotate, pan, zoom in all axes)
- Font: Helvetiker Bold (
/fonts/helvetiker_bold.json
)
Technical Implementation:
- Use
font.generateShapes()
method (not TextGeometry) - Create
ShapeGeometry
from font shapes - Handle holes in letters properly with
shape.holes
- Use
BufferGeometry.setFromPoints()
for outlines - Center text with
geometry.translate(xMid, 0, 0)
Visual Specifications:
- Outline Color:
#03295e
(dark blue) - Shadow Color:
#03295e
(same dark blue) - Shadow Opacity:
-0.1
(experimental negative value) - Background:
0xf0f0f0
(light gray) - Text Size: 200 for "Three.js", 150 for "Simple text."
Shadow Effect:
- Single shadow only (not multiple layers)
- Position: Far from text outline
- X Offset:
layerOffset * 150
- Y Offset:
-layerOffset * 150
- Z Offset:
-500
(far behind text)
Controls:
- Camera: PerspectiveCamera with FOV 45°
- Position:
(0, -400, 600)
- OrbitControls: Enable damping, zoom, rotate, pan
- Zoom Limits: min 100, max 2000
- Animation Loop: Continuous rendering with
requestAnimationFrame
Props Interface:
interface LayeredTextEffectProps {
text: string
size?: number
outlineColor?: string
shadowColor?: string
shadowOpacity?: number
layerOffset?: number
className?: string
}
Features:
- Real-time mouse interaction in all axes
- Smooth damped controls
- Responsive container sizing
- Proper cleanup on unmount
- Error handling for font loading
Use this prompt to create the component in any other file or project! 🚀