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.

0.0M

Revenue Generated

for clients across Europe

0+

Projects Completed

from startups to enterprises

0K

Training Data Points

processed for AI models

0%

Client Satisfaction

average project rating

Fast Data

Numbers that speak for themselves. Real results from real projects.

0.0M

Revenue Generated

for clients across Europe

0+

Projects Completed

from startups to enterprises

0K

Training Data Points

processed for AI models

0%

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! 🚀