Credits
-
Pou Auaha / Creative Directors
Simon Vicars (CCO), Maria Devereux (CIO), Dan Wright (ECD), Beth O'Brien (Creative Director), Thomas Darlow (Creative Director)
-
Ngā Kaimahi / Team Members
Haylie Craig (Senior Art Director), Erin Mattingly (Copywriter), Lucy Grigg (General Manager), Ryan Butterfield (Senior Business Director), Jin Fellet (Business Manager), Elsi Gibbs (Business Manager), Rob Campbell (CSO), Lizzie McCollum (CX Strategist), Liam Norris (Social Planner), Elle Kiddie (Senior Digital Producer), Isabelle Hooper (UX Strategist), Jodie Heron (UI Designer), Kyle Wetton (Fullstack Engineer), Logan Maire (Head of Technology & Innovation), Hamish Steptoe (Senior Designer), Fern Holloway (Senior TV Producer), Zia Mandviwalla (Director, FINCH), Corey Esse (Managing Director, FINCH), Bex Kelly (Exec Producer, FINCH), Duncan Bernard (Producer, FINCH), Marty Williams (DOP), Julian Curran (Editor), Neville Stevenson (Production Designer), Pete Ritchie (Colourist), John Baxter (Projections & Online), Cam Ballentyne (Music Composition), Craig Matuschka (Sound Engineer), Tamara O'Neill (Producer, Liquid Studios), Billy Worthington (Copywriter), Anna Markova (Technical Lead) -
Kaitautoko / Contributors
Claire Black (General Manager, OutLine Aotearoa), James Malcolm (Communications CoOrdinator, OutLine Aotearoa), Aych McArdle (Co-Chair, OutLine Aotearoa)
-
Client
Caitlyn Hayes
Description:
Opportunity
When a form asks for gender data and it only has two options, trans and non-binary people are forced to lie. A daily hurt that makes them feel invisible and ignored.
Beyond Binary Code changes that. Co-created with rainbow mental health organisations (OutLine), trans and non-binary communities, it’s a single piece of a code that can be added to any website to make forms and fields gender inclusive.
It includes:
1. Code builder tool. Helping businesses understand whether they need to collect gender data, and if so, customising the code to suit their needs.
2. Downloadable HTML code. Updating forms to create inclusive data sets and flow on experiences. Written to work in HTML and Java, as well as Wix, SquareSpace, WordPress and other direct-to-market website building software.
3. Business resources. Encouraging buy-in, implementing the code, understanding data privacy obligations, and celebrating the positive gender datapoint ripple effect.
4. Non-binary design language. Welcoming and representing trans and non-binary experiences through film, imagery and stories.
Approach:
Although Beyond Binary Code is a tech solution, at its heart it’s about enabling businesses to help in building a future where people feel seen and accepted as themselves. It was critical the design language felt human, welcoming and a safe space for everyone.
Design process:
Co-creation with the non-binary and trans communities was integral to the development of a welcoming, inclusive non-binary design language that elicited an emotive response and drove businesses to take action. The co-design sessions included needs identification and tonal language sessions with non-binary and trans individuals, as well as OutLine, to formulate key aesthetic and language considerations for the digital experience.
Three key design elements:
1. Fluidity and movement
- The blending of colours in the form of background gradients that shift as users move throughout the site create a sense of fluidity, constant change, and a rejection of harsh lines, boxes, and aesthetic confinement.
- The scroll interaction similarly rejected preconceived expectations, instead taking users on a journey in ‘behind the internet’, as the code flew past their screens - reinforcing a sense of movement, progress, action, and new perspectives.
2. Euphoria in representation
- Non-binary co-creators discussed the feeling of euphoria when they were acknowledged and represented by a business. To visualise this feeling, images of our non-binary co-creators would transform as they loaded in, from blurred and distorted, to crisp, clear and confidently in focus.
3. Rewriting code cues
- Snippets of code, code-based visual cues and coding windows were used in order to play on the idea of ‘rewriting’ the binary code of computers and more broadly the internet.
Results:
In the first 2 weeks of launch, the website recorded over 10k unique views, 200+ code downloads and started meaningful conversations with 36 major businesses.
Beyond Binary Code is designed to be an enduring resource for businesses – an open source tool and education platform that will continue to drive change for years to come.