EmailOctopus • Flexum

Overview

EmailOctopus is a popular email marketing platform trusted by over 50,000 creators and businesses worldwide.

Its drag-and-drop campaign builder lets users design and automate professional newsletters — with the text editor powering every content block at the heart of that experience.

As the platform evolved, EmailOctopus needed a more flexible, maintainable, and extensible editor foundation that could scale with their roadmap.

To achieve that, the team partnered with Flexum to migrate from their legacy setup to a modern TipTap-based editor, ensuring pixel-perfect consistency across thousands of existing email templates.

The challenge

Replacing the editor meant touching one of the most sensitive layers of the product — an embedded component within a complex block-based email builder.

Flawless visual continuity – existing campaigns and templates had to render exactly as before.
Controlled transition – the new system needed to match every existing formatting capability.
Integrated experience – the editor had to fit seamlessly within the drag-and-drop builder’s block logic.
Improved personalization workflow – merge tags like {{first_name}} had to become easier and safer to use.

In short, EmailOctopus wanted to modernize without disruption — improving the foundation while preserving the familiar experience for their users.

The Flexum solution

Flexum led a full-cycle migration — from architectural design and front-end reimplementation to automated validation and UX refinement.

Migration to Tiptap

Flexum replaced the existing editor with a modern, schema-driven TipTap implementation, carefully matching all existing formatting, layout, and toolbar behaviors to maintain parity with the legacy experience.

Automated validation and normalization

To guarantee a safe transition, Flexum built a custom content-comparison tool that:

Captured pixel-based screenshots of both Froala and TipTap renders.
Detected visual differences automatically.
Informed iterative tuning until every element aligned perfectly.

This approach delivered confidence at scale — ensuring pixel-perfect migration across thousands of templates used in production.

Atomic inline placeholders

Flexum redesigned how personalization tags worked inside the editor.

What were previously plain text tokens ({{first_name}}) became atomic inline blocks — stable, selectable, and visually distinct.

This structural change improved editing safety, eliminated accidental deletions, and made personalization more intuitive.

UI enhancements

The text-editing interface was refreshed to align with EmailOctopus’s modern design language — keeping the experience familiar but cleaner, faster, and more accessible.

Results

Seamless migration

Thousands of templates transitioned without visual regressions

Enhanced user experience

Atomic placeholders simplified personalization and reduced errors

Future-proof foundation

The new TipTap stack enables faster iteration and new block types

Simplified maintenance

A single, consistent editor codebase supports ongoing evolution

Trusted partnership

EmailOctopus continues to rely on Flexum for ongoing editor improvements

“The new editor release went incredibly smoothly — and user feedback’s been great.”

Jonathan Bull

Co-founder & CEO, EmailOctopus

Conclusion

EmailOctopus’s editor migration demonstrates how careful engineering and product empathy can modernize critical systems without disrupting users.

Flexum delivered a precision migration that preserved every campaign, elevated the editing experience, and gave the product team a foundation built to last.

How EmailOctopus modernized its template editor without breaking a single campaign