The Brief

The project required adapting Jaybro’s new group branding into a comprehensive digital experience. The goal was to position Jaybro as the top infrastructure and solutions provider in the Australia-New Zealand region. The website was designed as a platform for enterprise audiences to understand and recognise Jaybro Group’s prominence in the industry.

The Design Process

Based on the scope, budget, and key requirements of the project this was the proccess we applied:

Discovery Phase

The discovery phase focused on gaining a deep understanding of Jaybro’s new brand identity, business objectives, and user needs. This phase included:

• A design questionnaire to gather initial insights into Jaybro’s vision, goals, and expectations.
• A discovery call with key stakeholders to discuss their priorities, target audiences, and the website’s role in positioning Jaybro as an industry leader.
• Identification of key challenges, such as how to effectively tell the Jaybro story and create a solution relevant to investors, potential talent, and internal teams.
• An in-depth understanding of their goals and how the new brand should be reflected in the digital experience.

Ideation Phase

The ideation phase focused on refining the strategy and presenting potential solutions:

• Refining the key challenges and mapping them out in a clear and concise manner.
• Proposing solutions and using a visual format to help stakeholders better envision the proposed direction.
• A workshop session to unpack UX thinking, explore different approaches, and collaborate on refining the approach.

Wireframes

Low-fidelity mockups were created to:

• Define the general layout focusing on navigation, and content structure.
• Provide an early sense of the user journey and flow.
• Allow for quick iteration and stakeholder feedback before moving into high-fidelity designs.

Hi-Fidelity Designs

Once the wireframes were validated, the high-fidelity design phase included:

• Setting up the design system to ensure consistency and scalability.
• Designing the full website with detailed visual elements, typography, and interactions.
• Multiple feedback rounds where designs were presented, explained, and refined based on input.
• Detailed presentations to ensure all aspects of the design were fully understood and that the UX thinking behind them was clearly communicated.

Below is a walk-through of some of the homepage elements in live action:

Figma Design System

To ensure scalability and adaptability for future builds, we implemented a structured Figma Design System. The approach was tailored to help Jaybro scale their digital presence efficiently while simplifying the design-to-development handover:

• All components were stored on a single page to streamline development and avoid inconsistencies.
• Variations and accompanying developer annotations were included to ensure clarity.
• Close collaboration with the development team was maintained throughout, ensuring accurate implementation.

This structured approach allows the design to be reused and adapted for future projects, creating a long-term, sustainable digital solution for Jaybro Group.

The Impact

The redesigned Jaybro Group website successfully integrates the new branding guidelines into a cohesive digital experience. It effectively communicates Jaybro’s story, showcases their work culture, and positions them as a leader in the infrastructure sector. The scalable nature of the Figma design system ensures the Jaybro Group website can scale with the company’s future needs, and enable them to reutlise the design and its components for future web projects with great efficiency