// StreakField — signal simulation
const GRID = 128;                     // flow potential lattice
let phase = 0;                        // A→B morph, ~14s per epoch
const curl = (x, y) => {
  const dx = sample(x + h, y) - sample(x - h, y);
  const dy = sample(x, y + h) - sample(x, y - h);
  return [dy * FLOW, -dx * FLOW];     // divergence-free: pure swirl
};
for (let i = 0; i < P; i++) {
  const [u, v] = curl(px[i], py[i]);
  px[i] += (u + vortex.x + scatter.x) * dt * rush;
  py[i] += (v + vortex.y + scatter.y) * dt * rush;
  // cursor crush: flash teal, kick outward, spring home
  if (d2(ptr, i) < R && ptr.speed > MIN) {
    flash[i] = 1;
    kick(i, ptr, (1 - d2 / R) * ptr.speed * IMPULSE);
  }
  charge[i] = Math.max(flash[i] *= COOL, trailGlow(px[i], py[i]));
}
// trails: fade pass 4.5% → filaments persist ~25 frames
fade(fbo, 0.045); draw(points, ADDITIVE); composite(fbo, screen);

// StreakField — signal simulation
const GRID = 128;                     // flow potential lattice
let phase = 0;                        // A→B morph, ~14s per epoch
const curl = (x, y) => {
  const dx = sample(x + h, y) - sample(x - h, y);
  const dy = sample(x, y + h) - sample(x, y - h);
  return [dy * FLOW, -dx * FLOW];     // divergence-free: pure swirl
};
for (let i = 0; i < P; i++) {
  const [u, v] = curl(px[i], py[i]);
  px[i] += (u + vortex.x + scatter.x) * dt * rush;
  py[i] += (v + vortex.y + scatter.y) * dt * rush;
  // cursor crush: flash teal, kick outward, spring home
  if (d2(ptr, i) < R && ptr.speed > MIN) {
    flash[i] = 1;
    kick(i, ptr, (1 - d2 / R) * ptr.speed * IMPULSE);
  }
  charge[i] = Math.max(flash[i] *= COOL, trailGlow(px[i], py[i]));
}
// trails: fade pass 4.5% → filaments persist ~25 frames
fade(fbo, 0.045); draw(points, ADDITIVE); composite(fbo, screen);

// StreakField — signal simulation
const GRID = 128;                     // flow potential lattice
let phase = 0;                        // A→B morph, ~14s per epoch
const curl = (x, y) => {
  const dx = sample(x + h, y) - sample(x - h, y);
  const dy = sample(x, y + h) - sample(x, y - h);
  return [dy * FLOW, -dx * FLOW];     // divergence-free: pure swirl
};
for (let i = 0; i < P; i++) {
  const [u, v] = curl(px[i], py[i]);
  px[i] += (u + vortex.x + scatter.x) * dt * rush;
  py[i] += (v + vortex.y + scatter.y) * dt * rush;
  // cursor crush: flash teal, kick outward, spring home
  if (d2(ptr, i) < R && ptr.speed > MIN) {
    flash[i] = 1;
    kick(i, ptr, (1 - d2 / R) * ptr.speed * IMPULSE);
  }
  charge[i] = Math.max(flash[i] *= COOL, trailGlow(px[i], py[i]));
}
// trails: fade pass 4.5% → filaments persist ~25 frames
fade(fbo, 0.045); draw(points, ADDITIVE); composite(fbo, screen);

// StreakField — signal simulation
const GRID = 128;                     // flow potential lattice
let phase = 0;                        // A→B morph, ~14s per epoch
const curl = (x, y) => {
  const dx = sample(x + h, y) - sample(x - h, y);
  const dy = sample(x, y + h) - sample(x, y - h);
  return [dy * FLOW, -dx * FLOW];     // divergence-free: pure swirl
};
for (let i = 0; i < P; i++) {
  const [u, v] = curl(px[i], py[i]);
  px[i] += (u + vortex.x + scatter.x) * dt * rush;
  py[i] += (v + vortex.y + scatter.y) * dt * rush;
  // cursor crush: flash teal, kick outward, spring home
  if (d2(ptr, i) < R && ptr.speed > MIN) {
    flash[i] = 1;
    kick(i, ptr, (1 - d2 / R) * ptr.speed * IMPULSE);
  }
  charge[i] = Math.max(flash[i] *= COOL, trailGlow(px[i], py[i]));
}
// trails: fade pass 4.5% → filaments persist ~25 frames
fade(fbo, 0.045); draw(points, ADDITIVE); composite(fbo, screen);

// StreakField — signal simulation
const GRID = 128;                     // flow potential lattice
let phase = 0;                        // A→B morph, ~14s per epoch
const curl = (x, y) => {
  const dx = sample(x + h, y) - sample(x - h, y);
  const dy = sample(x, y + h) - sample(x, y - h);
  return [dy * FLOW, -dx * FLOW];     // divergence-free: pure swirl
};
for (let i = 0; i < P; i++) {
  const [u, v] = curl(px[i], py[i]);
  px[i] += (u + vortex.x + scatter.x) * dt * rush;
  py[i] += (v + vortex.y + scatter.y) * dt * rush;
  // cursor crush: flash teal, kick outward, spring home
  if (d2(ptr, i) < R && ptr.speed > MIN) {
    flash[i] = 1;
    kick(i, ptr, (1 - d2 / R) * ptr.speed * IMPULSE);
  }
  charge[i] = Math.max(flash[i] *= COOL, trailGlow(px[i], py[i]));
}
// trails: fade pass 4.5% → filaments persist ~25 frames
fade(fbo, 0.045); draw(points, ADDITIVE); composite(fbo, screen);

// StreakField — signal simulation
const GRID = 128;                     // flow potential lattice
let phase = 0;                        // A→B morph, ~14s per epoch
const curl = (x, y) => {
  const dx = sample(x + h, y) - sample(x - h, y);
  const dy = sample(x, y + h) - sample(x, y - h);
  return [dy * FLOW, -dx * FLOW];     // divergence-free: pure swirl
};
for (let i = 0; i < P; i++) {
  const [u, v] = curl(px[i], py[i]);
  px[i] += (u + vortex.x + scatter.x) * dt * rush;
  py[i] += (v + vortex.y + scatter.y) * dt * rush;
  // cursor crush: flash teal, kick outward, spring home
  if (d2(ptr, i) < R && ptr.speed > MIN) {
    flash[i] = 1;
    kick(i, ptr, (1 - d2 / R) * ptr.speed * IMPULSE);
  }
  charge[i] = Math.max(flash[i] *= COOL, trailGlow(px[i], py[i]));
}
// trails: fade pass 4.5% → filaments persist ~25 frames
fade(fbo, 0.045); draw(points, ADDITIVE); composite(fbo, screen);

// StreakField — signal simulation
const GRID = 128;                     // flow potential lattice
let phase = 0;                        // A→B morph, ~14s per epoch
const curl = (x, y) => {
  const dx = sample(x + h, y) - sample(x - h, y);
  const dy = sample(x, y + h) - sample(x, y - h);
  return [dy * FLOW, -dx * FLOW];     // divergence-free: pure swirl
};
for (let i = 0; i < P; i++) {
  const [u, v] = curl(px[i], py[i]);
  px[i] += (u + vortex.x + scatter.x) * dt * rush;
  py[i] += (v + vortex.y + scatter.y) * dt * rush;
  // cursor crush: flash teal, kick outward, spring home
  if (d2(ptr, i) < R && ptr.speed > MIN) {
    flash[i] = 1;
    kick(i, ptr, (1 - d2 / R) * ptr.speed * IMPULSE);
  }
  charge[i] = Math.max(flash[i] *= COOL, trailGlow(px[i], py[i]));
}
// trails: fade pass 4.5% → filaments persist ~25 frames
fade(fbo, 0.045); draw(points, ADDITIVE); composite(fbo, screen);

// StreakField — signal simulation
const GRID = 128;                     // flow potential lattice
let phase = 0;                        // A→B morph, ~14s per epoch
const curl = (x, y) => {
  const dx = sample(x + h, y) - sample(x - h, y);
  const dy = sample(x, y + h) - sample(x, y - h);
  return [dy * FLOW, -dx * FLOW];     // divergence-free: pure swirl
};
for (let i = 0; i < P; i++) {
  const [u, v] = curl(px[i], py[i]);
  px[i] += (u + vortex.x + scatter.x) * dt * rush;
  py[i] += (v + vortex.y + scatter.y) * dt * rush;
  // cursor crush: flash teal, kick outward, spring home
  if (d2(ptr, i) < R && ptr.speed > MIN) {
    flash[i] = 1;
    kick(i, ptr, (1 - d2 / R) * ptr.speed * IMPULSE);
  }
  charge[i] = Math.max(flash[i] *= COOL, trailGlow(px[i], py[i]));
}
// trails: fade pass 4.5% → filaments persist ~25 frames
fade(fbo, 0.045); draw(points, ADDITIVE); composite(fbo, screen);

// StreakField — signal simulation
const GRID = 128;                     // flow potential lattice
let phase = 0;                        // A→B morph, ~14s per epoch
const curl = (x, y) => {
  const dx = sample(x + h, y) - sample(x - h, y);
  const dy = sample(x, y + h) - sample(x, y - h);
  return [dy * FLOW, -dx * FLOW];     // divergence-free: pure swirl
};
for (let i = 0; i < P; i++) {
  const [u, v] = curl(px[i], py[i]);
  px[i] += (u + vortex.x + scatter.x) * dt * rush;
  py[i] += (v + vortex.y + scatter.y) * dt * rush;
  // cursor crush: flash teal, kick outward, spring home
  if (d2(ptr, i) < R && ptr.speed > MIN) {
    flash[i] = 1;
    kick(i, ptr, (1 - d2 / R) * ptr.speed * IMPULSE);
  }
  charge[i] = Math.max(flash[i] *= COOL, trailGlow(px[i], py[i]));
}
// trails: fade pass 4.5% → filaments persist ~25 frames
fade(fbo, 0.045); draw(points, ADDITIVE); composite(fbo, screen);

/

Index / 04

GitHub Instagram

Dostupan

/

O meni

Vanja
Modrinjak

Dizajniram i gradim sučelja i sustave. Full stack kad je potrebno, frontend iz preferencije. Stalo mi je do detalja koje većina preskače — easing krivulja, stanje učitavanja, ono što se dogodi kad naiđete na rubni slučaj.

Baziran u Hrvatskoj. Radim s timovima i klijentima diljem Europe. Trenutno otvoren za nove projekte.

Vještine / 05

01

Frontend Engineering

React / Next.jsTypeScriptGSAP / MotionThree.js / WebGLTailwind CSS

02

Systems & Rust

Rust — Axum, TokioGPU-accelerated toolsBroadcast QC (EBU R128)Zero-alloc streamingTerminal-native apps

03

Backend & Data

Node.jsPostgreSQL / ConvexSQLite / Redis StreamsREST / GraphQL / AxumSanity CMS

04

Media & Cinema

FFmpeg pipelinesLoudness analysisHLS / video playoutCinematographyColor & framing

05

Design & Direction

UI/UX DesignMotion designDesign systemsEditorial layoutCreative direction

Iskustvo

2023 —

Freelance Design Engineer

Independent — Remote

Designing and building web products, interactive experiences, and design systems for clients across Europe. Full ownership from concept to deployment.

2021 — 23

Frontend Developer

Agency Work — Croatia

Built production web applications, component libraries, and client-facing interfaces. Collaborated closely with design and backend teams on tight deadlines.

2019 — 21

Cinematographer & Editor

Film & Commercial — Croatia

Shot and edited commercial and narrative projects. Learned composition, pacing, and visual storytelling — skills that carry directly into interface design.