Rugby Au — Eastwood

This project spans over different parts of the Australian Rugby network: the governing body, state sites and team sites. The original brief focused solely on redesigning the governing body site but with the success of this work we were able to further grow the design system to overhaul state and team sites as well. The design task involved great consideration into a modular design system to overcome the challenges of designing many different sites, all under the same umbrella.

Role

UX + UI Design

Agency

Eastwood

My Role

In collaboration with Melbourne agency Eastwood I worked closely with the Creative Director over the entire project. For the initial stages of the project I created low fidelity wireframes based on prior client workshops and business needs. I built a wireframe component library to assess the scope of the site and determine where modules could be repurposed for the many flows and variations needed for production. With this library of components I crafted this into a visual design system to be used at scale and to insure consistency.

Phase One

The first release delivers the sport's national governing body in Australia, Rugby Australia. It’s the umbrella site that brings all elements of the game and it’s diverse audiences together. I crafted the majority of the UI design framework during this phase.

Phase Two

With the design system in place I was able to accelerate the design workflow with the ready-to-use interface elements for Rugby Australia's state and team sites. It also meant that when adding additional modules I could easily maintain consistency with the base UI elements.

Well crafted Sketch file

The success of this project relied on the efficiency of the design system. This was made possible with a well crafted Sketch file. Nested symbols and shared styles were the foundation of this system. Base elements included a type system, icon system and a themed colour system. It made it incredibly easy for me to then combine symbols to create a unified design language and an auto-updating style guide.