Front End Engineer – Canvas & Media Rendering (2D WebGL, GSAP, WebCodecs)

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. Our mission is to make AI the default in advertising without replacing creative people. To achieve this, we need to make sure that our technology isn’t just in the hands of big brands - we need to try to help small businesses and creative individuals too.

Awareness of GenAI technology has exploded over the last 12 months - but true understanding of the technology, its best practice usage and its limitations has lagged behind, even amongst sophisticated enterprise organisations. At Pencil we are right on the cutting edge of this revolution and want to ensure we take a leadership position in helping brands and agencies understand and adopt GenAI.

We're building a high-performance rendering engine to power our next-generation Editor – a canvas-based environment for rendering and animating text, video, images, and SVGs with cinematic quality and real-time responsiveness. If you're passionate about creative technology, animation systems, and GPU-accelerated rendering, we want to hear from you.

We're looking for engineers to join our team and evolve our custom Frontend Library, built using 2D WebGL rendering, GSAP, and WebCodecs for media processing. Experience with PixiJS is a strong plus.

Job Requirements:

2D WebGL Rendering

• Hands-on experience building and optimizing 2D rendering engines or apps using WebGL.
• Deep understanding of render pipelines, textures, shaders, and GPU-based rendering.
• Performance profiling and optimization in GPU-accelerated environments.

GSAP

• Advanced use of gsap.timeline() and tweens (to, from, fromTo), with control over nested timelines, labels, and playback events.
• Experience managing animation states and interactivity.

Canvas / SVG / 2D Graphics

• Knowledge of HTML Canvas, SVG internals, and basic 2D vector math.

WebCodecs + WebAudio

• Experience using WebCodecs to encode/decode video frames.
• Understanding of frame buffering, encoder/decoder management, muxing, and memory usage.
• Familiarity with audio synchronization and WebAudio APIs.

Performance & Architecture

• Profiling and debugging media-heavy applications.
• Resource management, object pooling, offloading to Web Workers.
• Lifecycle and state management in animation-driven apps.

Text Rendering

• Deep understanding of text layout, kerning, metrics, baselines, and advanced styling.
• Experience with font rendering challenges in WebGL/Canvas contexts.

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.

Job Responsibilities:

• Develop, maintain, and optimize a 2D WebGL rendering engine for high-fidelity canvas rendering.
• Implement smooth, interactive animations using GSAP timelines, easing, and labels.
• Handle video and audio processing using WebCodecs and WebAudio APIs.
• Work with custom WebGL shaders and rendering pipelines.
• Build reusable graphics components and filters with support for animation and interactivity.
• Optimize performance, memory usage, and frame rendering under heavy media loads.
• Collaborate across teams to bring complex creative features to life with pixel precision.

Job 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