Arubial Wagyu

Arubial Wagyu needed more than a polished brand site. The work had to make top-tier wagyu breeding feel distinct and premium on the surface, while solving the harder problem underneath: turning complex bull data into a system people could actually use, even on slow rural connections and low battery.

Context

The brief was to build a site that could tell the Arubial story and separate the brand from clinical competitors. That meant balancing emotion with utility. The site had to present a large amount of technical data in a way that felt clear to visitors, while still reflecting the brand’s point of difference: science-backed breeding in a premium food category.

Role

I worked as the Creative Technologist and web developer. I interviewed stakeholders, defined the scope of work, created wireframes and a prototype, then built the front end, back end, and a custom admin system for bull data management.

Hurdles

The main challenge was density. The site needed to handle large volumes of complex data without making the experience heavy or confusing. It also had to work for a rural audience using phones with low network speeds and limited battery life. On top of that, the brand could not look like another clinical agriculture site. It had to feel emotionally strong and visually refined without losing functional clarity.

Solution

I shaped the information architecture first, so the content could be organized around what visitors needed to understand quickly. Then I built the experience around that structure with sort and filter options, accordions, and overflow scrolling to keep the data usable.

On the presentation side, I delivered a story-driven front end with GSAP animations and custom Gutenberg blocks in WordPress for an easily manageable WYSIWYG editor. Underneath that, I built a custom admin panel so the client could manage bull data cleanly without wrestling with the complexity themselves.

I also added performance concessions for the real conditions of the audience. A loading curtain handled slow network speeds, and thoughtful dark mode styles which used pure black where possible to reduce battery usage.

Process

The work started with stakeholder interviews to clarify the brand story, the audience, and the data requirements. From there, I defined the scope, mapped the information architecture, and translated that into wireframes and a prototype.

I then worked closely with the extremely talented and all-round best designer to collaborate with, Sian Bedford, to guide the high-fidelity design and animation direction.

Once the design was approved, I developed the front end and back end in parallel with the admin tooling. That let the site’s public-facing story and its internal data system evolve together instead of being bolted on separately.

Key decisions

The critical decision was to treat accessibility as part of the product, not an afterthought. Slow connections and low battery were real constraints for the audience, so the loading curtain and dark mode were deliberate design choices, not cosmetic features.

Another defining decision was to build a custom system rather than force the data management into a generic CMS workflow. The bull data needed its own admin logic and a management experience that could support it.

Outcome

The result was a premium brand website that combined storytelling, accessible data UX, and a custom CMS workflow in one system. Analytics rose quickly after launch, the bounce rate stayed low, and the client was extremely happy with the result. The analytics signalled that the accessibility features were having the right effect, which confirmed that the performance choices were doing real work for the audience.