Motion Design

B2B SaaS & EventTech

2025

Ongoing Retainer

Check-in Pax — Event SaaS Motion Suite

Check-in Pax — Event SaaS Motion Suite

Check-in Pax — Event SaaS Motion Suite

A suite of lightweight, auto-looping product UI animations built for web integration - compressed down to 2.6MB.

A suite of lightweight, auto-looping product UI animations built for web integration - compressed down to 2.6MB.

2.6MB

Web-Optimized File Size

2.6MB

Web-Optimized File Size

0s Audio

0s Audio

Frictionless Web Autoplay

100%

100%

100%

Figma & PWA Accuracy

Check-in Pax customer support workflow showing chat messages about resending a confirmation email

Check-in Pax — Event SaaS Motion Suite

SCOPE OF WORK

What was built

SCOPE OF WORK

What was built

Web Integration

Silent Auto-Loop Engineering

Engineered soundless, seamless looping MP4 animations optimized for inline HTML web embeds, bypassing browser autoplay restrictions.

UI Animation for SaaS

UI Motion Design

RSVP & Guest Management

Animated real-time guest lookup, timeline history navigation, and one-tap invitation re-sending inside responsive tablet and phone frames.

Hardware Workflow

On-Site Badge Printing Setup

Visualized physical event check-in scenarios: wireless iOS connections alongside ultra-stable wired USB-C Surface Go printer setups.

Asset Compression

High-Bitrate Compression

Reduced 45MB master renders down to a razor-sharp 2.6MB payload, maintaining crisp 60 FPS UI text without dragging down page load speed.

APPROACH

How the work was done

APPROACH

How the work was done

01

PWA Workflow Mapping

Logged into the live Check-in Pax web app to analyze actual event staff journeys - from scanning QR codes to instant walk-in registration.

02

Device & Context Curation

Sourced event venue footage and composited responsive iPad mockups, designing custom tap feedback and animated confirmation badges.

03

Color & Theme Calibration

Iterated background shades across dark, neutral, and pure white palettes to ensure the video canvas blended invisibly into the live website.

04

Payload Optimization

Benchmarked three export profiles (17MB, 10MB, and 2.6MB), fine-tuning codec parameters to deliver maximum visual fidelity at minimal bandwidth.

Embedding video directly into a SaaS homepage requires solving technical performance hurdles: browser autoplay blocking, background color mismatches, and page speed penalties.

For Check-in Pax, we designed silent, self-explanatory UI loops that communicate complex event tech in under 15 seconds.

By color-matching video backgrounds directly to the website CSS and crushing the payload down to 2.6MB, the animations feel like native, interactive web components rather than heavy video embeds.

RESULTS

How it landed

RESULTS

How it landed

Instant Concept Clarity

Achieved immediate universal clarity - the founder confirmed that non-technical viewers and event planners instantly grasped the app's value.

Sub-3MB Web Master

Successfully compressed raw 45MB renders to 2.6MB, enabling instant autoplay on mobile and desktop without slowing Core Web Vitals.

End-to-End Asset Extension

Expanded from an initial feature loop into a multi-asset suite covering RSVP flows, QR check-in demos, and on-site hardware setup graphics.

"

The animation looks great and showed it to others and they all like it! Also my wife who is not into events understood the concept right away. Bulat Visual did a great job on the video and motion design for our B2B SaaS product, Check-in Pax. He really understands the B2B space, works fast, and delivers great quality. Highly recommend!

Boris Barreck

Founder / Product Lead — Check-in Pax

2.6MB

Ultra-Light Payload

60fps

Silent Web Playback

100%

Founder & Team Acclaim