PROJECT SPOTLIGHT / CUSTOM WORDPRESS MARKETPLACE, COMING SOON

One pig. One listing. A clearer way to find the right match.

HogMatch is a focused digital marketplace for show pigs. It gives buyers a practical way to compare individual animals, ask informed questions, and connect with approved breeders without forcing every sale into an auction format. The site is built and in its final pre-launch stage; it is not yet open to the public.

CLIENT

HogMatch

STATUS

Coming soon, development stage

FOCUS

Custom marketplace system

DELIVERY

Strategy, UX, WordPress, custom plugin

THE PROBLEM

A marketplace idea buried under too much machinery.

HogMatch began with real industry knowledge and a strong central idea: help smaller breeders list one or a few quality show pigs without requiring the volume or expense of a major online auction. The first prototype had already gathered useful fields, filters and draft service ideas, but the underlying website was fighting the product. It carried 45 active plugins, duplicate listing models, and a public catalog that showed no available pigs even though demo listings existed behind the scenes.

This was not a cosmetic redesign. The project needed a simpler product model, a more credible buying journey, controlled seller tools, and a WordPress foundation the client could edit without being able to break the marketplace machinery. The interface could not become clear until the data model became clear.

MORE OF THE BUILD

Page by page.

Exact capture of the HogMatch home page on a 1440-pixel desktop.
Home page, 1440 pixels.
Exact capture of the HogMatch how it works page on a 1440-pixel desktop.
How it works page, 1440 pixels.
Exact capture of the HogMatch marketplace page on a 1440-pixel desktop.
Marketplace page, 1440 pixels.
Exact capture of the HogMatch pig detail page on a 1440-pixel desktop.
Pig detail page, 1440 pixels.
Exact capture of the HogMatch seller journey page on a 1440-pixel desktop.
Seller journey page, 1440 pixels.
Exact capture of the HogMatch home page on a 390-pixel phone.
Home on a 390-pixel phone.
Exact capture of the HogMatch marketplace page on a 390-pixel phone.
Marketplace on a 390-pixel phone.
Exact capture of the HogMatch pig detail page on a 390-pixel phone.
Pig detail on a 390-pixel phone.
THE VISUAL SYSTEM

Distressed magenta, kept and expanded.

HogMatch’s magenta and white identity stayed. Orbitron carries the show-ring energy in display type; Space Grotesk keeps forms, filters and account tools readable. Black and charcoal surfaces let livestock photography lead, the bright magenta is reserved for display type, borders, icons and focus states, and filled surfaces carrying white text use a darker, accessible magenta. The crest, a boar’s head with an H in each ear and an M in the snout, became the site icon so the tab, the phone home screen and every share thumbnail show a recognisable mark.

HogMatch wordmark, distressed magenta on transparent.
The HogMatch wordmark.
HogMatch crest: a boar's head with an H in each ear and an M in the snout, inside a shield.
The crest: H, H, M.
WHAT WE BUILT

The work, piece by piece.

01

One source of truth

One canonical record per pig. Every catalog card is one animal; every detail page brings breeder, location, price, media, facts, inquiry route and status together. Sold, reserved, withdrawn and expired states follow the same record.

02

Discovery that behaves like a marketplace

Search by pig, breeder, farm or town, then narrow by breed, sex, price and state. Filter counts respond to each other, active filters clear individually, and livestock-specific sorting replaces store defaults.

03

A real page for every animal

Photography leads. Name, breed, sex, age, weight, breeder, location and asking price are organised for fast comparison, with a listing-specific question route to the breeder.

04

Approval-first seller tools

Breeders apply, the administrator reviews, approved sellers get listing tools. The application went from 45 fields to 25. Sellers submit one animal at a time, upload photos and video, change price, withdraw and relist.

05

Built for the barn

Home, catalog, listing, seller tables, inquiries and account tools designed and tested as phone experiences, with seller tables checked at 320, 390, 414, 768, 900, 1024, 1280 and 1600 pixels.

06

Performance and search built in

A 21 MB hero screen recording rebuilt as a 1.1 MB MP4 and 534 KB WebM with poster and reduced-motion support. Self-hosted type, purpose-fitted image crops, long-lived cache headers, and one canonical Product schema block per animal.

DESKTOP, DETAIL, PHONE

Built for every screen it will meet.

Desktop, listing, and phone screens from the HogMatch marketplace.
Current desktop, detail and phone views from HogMatch.

45

Active plugins in the inherited prototype

25

Fields in the seller application, down from 45

95%

Reduction in hero-video delivery size

8

Viewport widths used to verify seller tables

THE RESULT

Built, and waiting on the gates that make a marketplace real.

HogMatch is a substantial product build in its final stage, not a public launch claim. The marketplace interface and core application foundation are built. Live payment architecture, final legal policies, production email, client acceptance testing and launch approval are the remaining gates before the public site opens and accepts real transactions.

A serious marketplace is not finished when the screens look complete. The money, permissions, policies, notifications, records, recovery plan and operational handoff all have to agree. When a website starts acting like a business system, design and engineering have to move together.

THE VIDEO SYSTEM

Video, from a phone in the barn to a locked-down player.

Listing video was added to the launch scope because a buyer needs to see a pig walk. That sounds simple and is not: sellers shoot vertical HEVC clips on phones with poor signal, browsers will not play HEVC, the reseller host had no way to transcode, and Cloudflare will not proxy video on the plan in use. The system had to work from the barn, not just from the office.

The build gives every listing one video field backed by a provider name and asset ID, a processing queue on the dedicated server that converts phone HEVC to fast-start H.264 MP4, a poll job that tracks each asset through processing, and a player with downloading, playback-speed changes, picture-in-picture and right-click saving all removed. The media hostname is kept DNS-only so video bypasses the Cloudflare proxy entirely.

HOW THE VIDEO PIPELINE WORKS

Six decisions that make barn video work.

01

One video per animal

A single listing-video upload of up to 90 seconds, alongside up to eight photos, with a guide page telling sellers how to shoot a pig from both sides, front and rear.

02

Phone HEVC to web H.264

Direct HEVC phone video to H.264 MP4 conversion tested end to end, encoded fast-start so playback begins before the file finishes downloading.

03

Queue and poll

A processing queue on the server works through uploads in batches, with a scheduled poll job that follows each asset until it is ready, and versioned filenames so an updated clip is never masked by a year-long cache.

04

Locked-down player

No download control, no playback-rate menu, no picture-in-picture, no remote playback, and a blocked context menu, so ring footage stays on the listing.

05

The hero film

The homepage hero is the client’s own show-ring footage, reframed and rebuilt from a 21 MB screen recording into a 1.1 MB MP4 and a 534 KB WebM with a poster image, and hidden for visitors who prefer reduced motion.

06

Around the proxy

Video is served from a DNS-only media hostname so Cloudflare’s video-proxy restriction never applies, while the rest of the site keeps edge caching and protection.

MESSAGING, MONEY AND TRUST

Neither side sees the other until a deposit is paid.

A marketplace lives or dies on whether people transact through it. The first notifier handed a seller the buyer’s name, email and phone on the first message and told them to reply directly, teaching both sides to leave the platform. It was rebuilt as a platform relay: buyers appear to sellers under a handle, contact details are masked, sellers reply through their inquiries page, and details are released to both sides only when a deposit is paid.

The money model was built the same way, in one place: a single function works out the deposit, the platform commission taken off the top, the amount credited to the breeder and the balance due at pickup, so the listing page, every email, the admin dashboard and any future checkout cannot disagree. A demo mode with a simulated gateway lets the whole flow be walked with the client without moving a dollar, and a reservation hold keeps a pig off the market while a deposit is in progress.

THE PLATFORM LAYER

What sits under the screens.

01

Masked relay

Buyer questions reach the breeder under a handle with email and phone masked; replies flow back through HogMatch; contact is released to both sides at deposit.

02

Fourteen branded emails

Seller approved and rejected, listing live, needs changes, ending soon and ended, inquiry receipt and nudge, inquiry relayed, breeder reply, contact released, deposit received for buyer and seller, all through one branded shell, with WooCommerce’s own emails restyled to match.

03

Authenticated sending

Transactional mail sends over the Brevo API with DKIM, SPF and DMARC all passing, without touching the client’s existing business email records.

04

One money function

Deposit percentage, minimum deposit, listing fee and commission are configuration, not code, and every screen and email reads from the same calculation.

05

Reserved, sold, expired

Real marketplace states on every product, with reserved shown in the brand pink because a buyer can still act on it, and sold and expired deliberately muted.

06

Demo mode and acceptance suite

A simulated gateway behind a single explicit guard, an amber demonstration bar on every page, and a 33-check acceptance suite that runs after every change.

LOUISVILLE, KENTUCKY + SOUTHERN INDIANA

Built in Louisville, for Louisville and Southern Indiana.

Shaun Wilson Designs is a one-person web design and WordPress development studio in Louisville, Kentucky, working with businesses across Louisville and Southern Indiana: custom WordPress websites, custom WordPress plugins, WooCommerce stores, website redesigns and WordPress recovery. See more of the work in the project portfolio.

YOUR PROJECT NEXT

Tell me what you are building.

One conversation, one builder, a clear next step. The person you brief is the person who does the work.

Similar Posts