Studioluw | Hét Marketing Bureau voor het Westland
Studioluw
We Create
Brands.
Manifesto
In een wereld vol ruis, zoeken wij de stilte op. De luwte. Niet om ons te verstoppen, maar om te focussen. Bij Studioluw, het toonaangevende marketing bureau in het Westland, strippen we merken tot de essentie. Geen opsmuk, geen afleiding. Alleen puur karakter en strategisch design.
Expertise
- Concept Development
- Brand Storytelling
- Digital World Building
- Content & Motion
- Growth Strategy
TheSamuraiTrader.com
Cameraak.nl
Bodyjob.nl
// — 2. CURSOR TRACKING EN HOVER LOGICA —
const cursorDot = document.querySelector(‘.cursor-dot’);
const cursorOutline = document.querySelector(‘.cursor-outline’);
if (cursorDot && cursorOutline) {
window.addEventListener(‘mousemove’, (e) => {
const posX = e.clientX;
const posY = e.clientY;
cursorDot.style.left = `${posX}px`;
cursorDot.style.top = `${posY}px`;
cursorOutline.animate({
left: `${posX}px`,
top: `${posY}px`
}, { duration: 500, fill: “forwards” });
});
}
const textElements = document.querySelectorAll(‘.interactive-text, .cta-link, .service-item’);
const imageElements = document.querySelectorAll(‘.gallery-item’);
textElements.forEach(el => {
el.addEventListener(‘mouseenter’, () => document.body.classList.add(‘hover-text’));
el.addEventListener(‘mouseleave’, () => document.body.classList.remove(‘hover-text’));
});
imageElements.forEach(el => {
el.addEventListener(‘mouseenter’, () => document.body.classList.add(‘hover-image’));
el.addEventListener(‘mouseleave’, () => document.body.classList.remove(‘hover-image’));
});
// — 3. TEXT SPLITTER LOGICA —
const textTarget = document.getElementById(’textTarget’);
if(textTarget) {
const words = textTarget.innerText.split(‘ ‘);
textTarget.innerHTML = ”;
words.forEach(word => {
const span = document.createElement(‘span’);
span.innerText = word + ‘ ‘;
textTarget.appendChild(span);
});
}
// — 4. LOGO ANIMATIE LOGICA (EXTREME PHYSICS UPGRADE) —
const logo = document.getElementById(‘studioluw-logo’);
const path = document.getElementById(‘wind-line’);
const finalPath = ‘M 10 50 H 80 C 85 50, 90 55, 85 60’;
function applyLuwteCurl() {
if (path) {
path.style.transition = ‘d 1s ease-out’;
path.setAttribute(‘d’, finalPath);
}
}
// FUNCTIE VOOR DYNAMISCHE STORM BEWEGING (NUCLEAIR)
function startStormAnimation(startTime) {
const duration = 3000; // 3 seconden storm
const elapsed = Date.now() – startTime;
if (elapsed < duration) {
// NIEUW: Veel agressievere waarden voor rotatie en positie
const rotation = Math.sin(elapsed * 0.05) * 10 + (Math.random() * 60 - 30); // Tot +/- 30 graden
const translateX = Math.random() * 30 - 15; // Tot +/- 15px
const translateY = Math.random() * 30 - 15; // Tot +/- 15px
// Pas de willekeurige, heftige beweging toe
logo.style.transform = `rotate(${rotation.toFixed(2)}deg) translate(${translateX.toFixed(2)}px, ${translateY.toFixed(2)}px)`;
requestAnimationFrame(() => startStormAnimation(startTime));
} else {
// Einde van de storm: laat de lijn rustig terugvallen
logo.style.transform = ‘rotate(0deg) translate(0px, 0px)’;
// Wacht tot de rotatie is uitgedempt en pas dan de krul toe
setTimeout(applyLuwteCurl, 1500);
return;
}
}
// START EXECUTIE
if (logo && path) {
startStormAnimation(Date.now());
}
// [ … de rest van het script… ]
// START EXECUTIE
if (logo && path) {
startStormAnimation(Date.now());
}
// [ … de rest van het script … ]
// — 5. JAVASCRIPT GARANTIE: FORCEER VERWIJDERING ADMIN BAR —
window.addEventListener(‘load’, function() {
const adminBar = document.getElementById(‘wpadminbar’);
if (adminBar) {
adminBar.remove();
}
document.documentElement.style.cssText = ‘margin-top: 0 !important;’;
});