CODE Sports
Client
News Corp
Role
UX/UI + Research
Timeframe
Dec 2021 - Present
Overview
CODE Sports is a premium subscription publication focused on sports content. CODE is about the stories of sports, giving you perspectives that go beyond the game.
-
Originally launched in November 2021, it’s now the highest-rated News Corp app on the App Store.
-
As CODE was the first native app built on our new app platform, this allowed me to build up our App Design System alongside it.
-
I’ve also worked on the brand refresh for CODE, which was released in early 2023.
Design uplift
Using the existing style library and components, I worked with web and app teams to design new features. This work was completed between December 2021 to September 2022.
Podcasts
I repurposed and redesigned the existing podcast designs from The Daily Telegraph into CODE Sports. The old design had some issues that were addressed.
Use the slider to see the before and after.
Tablet - Homescreen
Created a new collection of story components for the tablet homescreen. These components would be responsive between portrait and landscape modes. Experimented with dozens of designs and layouts to maximise impact.
Tablet - Articles
Built a new article layout for tablet, making use of the additional space to emphasise the image-led journalism.
CODE Bet - UX Research
For the CODE Sports Wagering project, I worked alongside the UX Research team in creating the research deliverables and designed the high-fidelity prototype for usability testing. I also provided design and branding guidance to the NewsPerform team in developing the CODE Bet product.
App Design System
The existing Sketch libraries of the various News Corp brands were built for web. While these libraries are well-established and mature, there wasn’t anything created to support the designing of native apps.
I added 168+ symbols across mobile and tablet so that components were scalable and able to be reskinned for each brand.
The goal is for all future apps to follow a consistent design language and to minimise rework when components were updated.
- The Sky News App was built on the App Design System. See case study
- Other new apps that have been designed on this design system include the refreshed News.com.au app and The Australian app
App Template Library
Templates were also built for commonly used pages, so that any new native app designs could be spun up using pre-configured layouts and components.
An example of this is App Onboarding, where we reduced a 6 step process down to 3 steps, with a focus on personalisation for the user. Multiple iterations of usability testing led to a resuable and modular flow that would work on various brands.
Brand Refresh
A year after release, the CODE Sports brand needed a refresh.
We created a new emphasis on bolder colour choices and style elements to bring more energy to the CODE Sports brand.
Over a 6 month period, this change has driven significant traffic to the website:
Homepage
We needed to create a better first impression, so a drastic change was required.
Enter dark mode, vibrant colours and more contextual components.
Use the slider to see the before and after.
Scoreboard & Match Centre
I designed a new full-width global scoreboard for all sports, which is used across other mastheads like The Daily Telegraph and News.com.au.
Along with this global scoreboard, I standardised the design language of our match centres, including AFL, NRL, Football, Cricket and Motorsport.
This makes it easier for users to see how their team played and to compare stats.
The football match centre was rolled out before the 2023 FIFA Women’s World Cup and had 220,000 views over the tournament. This was a 250% increase compared to the 2022 FIFA Men’s World Cup.
Closing thoughts
CODE Sports has come a long way since its inception in 2021, but it’s still a work in progress. We’re building new features daily and I truly believe this can become the one-stop-shop for all things sports related.