Flag job

Report

Frontend Engineer – 2D WebGL GSAP, WebCodecs

Location

EMEA

JobType

full-time

About the job

Info This job is sourced from a job board

About the role

At Pencil, we are driving innovation in advertising technology through our state-of-the-art SaaS product, which harnesses Generative AI to redefine content creation. We're developing a next-generation Editor that enables users to compose rich media experiences on the web. The core of this system is a powerful, high-performance 2D WebGL renderer and an expressive GSAP-based animation engine.


We're looking for experienced Frontend Engineers to evolve our custom Front End library, extend our rendering pipeline, help design interactive animation systems, and ensure smooth, high-FPS performance on modern browsers.


🛠️ Responsibilities

Responsibilities will vary depending on your specific skills, but some of the things you might work on include:

  • Develop, maintain, and optimize a 2D WebGL rendering systems for dynamic composition of text, shapes, images, and vector elements.
  • Design reusable graphics components, layers, and rendering effects with GPU acceleration in mind.
  • Implement smooth, timeline-based animations using GSAP, with control over nested timelines, custom easings, labels, and playback logic.
  • Implement browser-based video processing pipelines using WebCodecs API.
  • Build and manage muxing and demuxing systems for handling media containers (e.g., MP4/WebM).
  • Integrate file read/write functionality using OPFS, allowing large media files to be saved and loaded persistently in the browser.


🔍 What We’re Looking For:

Whilst we don’t expect candidates to have all of these skills, some of the skills we’re looking for are:


2D WebGL Rendering

  • Strong hands-on experience with WebGL for 2D rendering (not just Three.js or 3D).
  • Understanding of rendering pipelines, shaders, buffers, blending modes, texture atlases, and batching.
  • Ability to manage frame lifecycle, layering, and GPU resource optimization.


GSAP

  • Expertise in using gsap.timeline() for orchestrating animations with to, from, fromTo tweens.
  • Skilled in working with labels, nested timelines, and custom easings.
  • Experience in handling playback control, animation state, and callbacks/events.


WebCodecs

  • Solid experience with WebCodecs API: managing encoders/decoders, configuring frame formats and codecs.
  • Familiarity with different video frame types (I/P/B frames), timestamp management, and latency handling.


Muxing / Demuxing

  • Hands-on experience building or integrating muxers and demuxers (e.g., MP4/WebM).
  • Understanding of container formats, segmenting, and stream metadata management.


OPFS (Origin Private File System)

  • Experience with loading and saving binary/video data using OPFS.
  • Handling persistent file storage and stream-based file writing in modern browsers.


Performance Optimization

  • Experience profiling frame rendering and GPU usage.
  • Familiarity with techniques like object pooling, offscreen rendering, and layer caching.


Interactivity & Composition

  • Building interactive, event-driven animation systems.
  • Working with user inputs, hit-testing, and real-time animation updates.


➕ Nice to Have

  • Experience with PixiJS (v8), including sprites, filters, and event handling.
  • Writing custom WebGL shaders for effects or text rendering.
  • Background in creative tools, motion design systems, or visual editors.


Benefits:

  • 25 days PTO plus public holidays, although we operate a Flexible Time Off scheme
  • Health insurance / private medical cover
  • Monthly stipend towards wellness, fitness, and learning and development
  • Remote - work from anywhere in your home country
  • Access to our Pencil office in The Shard, London
  • We Work all access
  • Flexible working hours

About the company

At Pencil, we are driving innovation in advertising technology through our state-of-the-art SaaS product, which harnesses Generative AI to redefine content creation. We're developing a next-generation Editor that enables users to compose rich media experiences on the web. The core of this system is a powerful, high-performance 2D WebGL renderer and an expressive GSAP-based animation engine.

Skills

webgl
gsap
webcodecs
muxing
demuxing
opfs
pixijs