← All Work

Case Study

Affiliate Ad Builder for Resona Health

A custom WordPress and React-based frontend tool that helps affiliates create branded marketing assets with their own tracking link, QR code, and downloadable media.

Client
Resona Health

Project Type
Affiliate Marketing Tool

Role
Planning, development, integration, debugging

Stack
WordPress, React, REST API, JavaScript, PHP, AWS Media Workflow

Project overview

Resona Health needed a frontend ad builder for its affiliate team. The goal was to let affiliates create promotional assets without depending on the internal team for every image, PDF, or video variation.

The tool needed to be simple enough for non-technical affiliates, but powerful enough to handle real marketing workflows. Affiliates should be able to enter their affiliate ID, choose a template, generate a tracking link, show that link as a QR code, and download the final creative asset.

This was not just a visual builder. It required frontend UX, WordPress integration, affiliate tracking logic, media generation, export handling, and a video processing workflow.

The problem

Affiliate marketing only works well when affiliates can promote quickly. But if every creative asset has to be manually created by the business team, the process becomes slow and hard to scale.

Resona Health needed a better way to support affiliates with ready-to-use branded assets. The main problem was not only creating designs. The real problem was connecting each asset with the correct affiliate tracking information.

Affiliates needed personalized tracking links.
Promotional assets needed to include a QR code.
Some affiliates needed image and PDF downloads.
Some templates required video export support.
The builder needed to work from the frontend.
The experience had to be simple, even for affiliates who were not comfortable with complex dashboards.
Guest affiliates also needed access without login friction.

The challenge was to make the system feel simple on the surface while handling several technical steps behind the scenes.

The goal

The goal was to build a self-serve affiliate ad builder inside WordPress.

An affiliate should be able to visit the builder, enter an affiliate ID, select a creative template, preview the final asset, and download it without needing help from the internal team.

The final tool needed to support three important things:

A simple step-by-step frontend experience
Affiliate-specific tracking link and QR code generation
Downloadable promotional assets in image, PDF, and video formats

The solution

I built a custom frontend ad builder using WordPress, React, PHP, JavaScript, and custom REST API endpoints.

The builder follows a guided flow. Instead of giving affiliates a complicated dashboard, the interface breaks the process into clear steps.

Enter affiliate ID
Choose a creative template
Preview and customize the asset
Download the final image, PDF, or video

Each generated asset includes the affiliate’s tracking information, so the creative is not just a static marketing file. It becomes a personalized promotional asset.

Key features I built

1. Frontend affiliate ID flow

The first step of the builder allows the affiliate to enter an affiliate ID. That ID is then used to generate the correct tracking link for the promotional asset.

This made the workflow much easier because affiliates did not need to manually build or edit URLs. The system handles the tracking link logic automatically.

2. Template selection system

The builder includes a template selection step where affiliates can choose from available creative formats. Templates can include images, PDFs, or video-based creatives.

This allows the business team to prepare reusable marketing templates while affiliates personalize and download them from the frontend.

3. QR code generation

Each asset can include a QR code generated from the affiliate tracking link. This is useful for offline promotions, printed materials, screenshots, and social sharing.

I also worked on making the QR caption clearer by showing a readable short link below the QR code, so mobile users are not forced to scan a QR code from the same phone they are using.

4. Image and PDF export

The tool supports exporting final creative assets as images and PDFs. This gives affiliates flexible formats they can use across social media, print, email, or direct sharing.

The export workflow was built to preserve the correct layout, tracking information, QR code, and caption text inside the final file.

5. Video export workflow

Video export required a more advanced workflow. I worked on a video processing system where the frontend sends the export request, WordPress handles the job creation, and the media processing flow prepares the final downloadable video.

This added a more scalable foundation for handling video creatives instead of trying to process everything directly inside the browser or WordPress request cycle.

6. Saved assets for logged-in users

For logged-in affiliates, generated assets can be saved and accessed later. This gives users a simple media library experience where they can return to previously created assets.

For guest users, the builder still works, but the assets are not permanently saved to a user account. This keeps the experience open while still giving extra value to logged-in users.

7. Guest-friendly access

One important improvement was reducing login friction. Some affiliates may forget their affiliate login details, so the builder needed to work without blocking them at the first step.

The updated workflow allows affiliates to use the builder by entering their affiliate ID directly. If they are logged in, the system can treat them as a logged-in user. If they are not logged in, they can still create and download assets.

My role in the project

I handled the technical planning, frontend development, WordPress integration, API structure, export handling, and debugging.

The project required both product thinking and engineering. The tool had to be easy for affiliates, but it also had to connect correctly with WordPress, affiliate tracking, media templates, and export logic.

Planned the frontend builder flow
Built the React-based interface
Connected the frontend with WordPress
Created custom REST API communication
Handled affiliate ID and tracking link logic
Added QR code and short link output
Worked on image, PDF, and video export behavior
Improved guest access and logged-in user handling
Debugged export and media processing issues
Improved mobile usability for affiliate sharing

Technical decisions

The builder was designed as a custom WordPress system instead of forcing the workflow through a generic page builder or plugin stack.

React was used for the frontend experience because the builder needed dynamic state, live preview behavior, template selection, export actions, and a smoother step-based interface.

WordPress handled the backend structure, REST API endpoints, user state, affiliate data, and job creation. This kept the tool connected to the existing website while still allowing a modern frontend experience.

React for the interactive builder interface
WordPress for backend integration and user handling
PHP for server-side logic and REST API endpoints
JavaScript for preview and export interactions
QR generation for affiliate tracking links
AWS media workflow for video processing support

Main challenges

Making a complex tool feel simple

The system had several moving parts: affiliate ID, templates, tracking links, QR codes, previews, downloads, and video processing. The interface needed to hide that complexity and guide the user step by step.

Supporting both logged-in and guest users

The builder needed to work even when the affiliate was not logged in. At the same time, logged-in users needed extra functionality such as saved assets. This required careful handling of user state and asset storage behavior.

Making QR codes useful on mobile

A QR code is useful when someone can scan it from another device or printed material. But if an affiliate is viewing the asset on a phone, scanning the QR code from the same phone becomes awkward. Adding a readable short link under the QR code made the asset more practical for mobile users.

Handling video exports reliably

Video export is heavier than image or PDF export. The workflow needed to avoid fragile browser-only processing and move toward a more reliable media processing pipeline. This made the project more complex, but also more scalable.

The result

The final builder gives affiliates a self-serve way to create branded promotional assets. Instead of asking the team to prepare each variation manually, affiliates can generate assets with their own tracking information from the frontend.

The workflow became simpler for affiliates and easier to scale for the business.

Affiliates can create assets without manual team support
Tracking links are generated from the affiliate ID
QR codes and readable links are included in the creative
Images and PDFs can be downloaded from the frontend
Video export support was added through a media processing workflow
Logged-in users can access saved assets
Guest users can still use the builder without login friction

A good custom tool does more than add features. It removes repeated manual work from the business.

What this project shows

This project shows the kind of WordPress work I enjoy most: building custom systems around a real business workflow.

It was not a simple brochure website or a plugin installation. It involved product thinking, frontend UX, backend logic, media processing, affiliate tracking, and long-term usability.

That is where custom WordPress development becomes valuable. When the website is not just a page, but a tool that helps the business operate better.

Need a custom WordPress tool like this?

If your business needs a custom WordPress plugin, WooCommerce workflow, frontend builder, dashboard, automation, or internal tool, I can help you plan and build it properly.

I focus on systems that are practical, maintainable, and built around how the business actually works.

Discuss your project