BBC - GEL Collider Desktop

Project summary

Collider is framework that can be used by developer and designers. The Collider desktop application that brings code to designers in an accessible way by letting designers use the reusable components from the Component Library to rapidly build prototypes with real data.

Methods

User personas, workshops, user journey mapping

Tools

Sketch, Invision, inDesign

Problem statement

All of BBC's product teams are creating designs from scratch which is time consuming and also doesn't encourange the act of being transparent. Therefore, HMW create a platform that allows designers to use existing code created components which can be used to create new designs?

Discovery

Consultation

Collider is an internal framework that was created by a BBC UX designer. Due to this it was important to consult with the creator to visualise how Collider is structured and what he wanted Collider to become for Designers. The consultation with the creator allowed me to learn what the core functions for the program would be and also helped him to question certain decisions that he made in the past which may need to be updated.


Competitor Analysis

Since the BBC's design framework has been built for responsive web there are no design patterns for desktop applications. Therefore, a competitor analysis was done to find out the common patterns that are generally used for desktops.

Define

User journey mapping

The developer and I mapped out how the features within the program will link together to form a smooth and reliable user Experience. We mapped out how the user will create edit and run their project.


Wireframe sketches

The developer and I mapped out how the features within the program will link together to form a smooth and reliable user Experience. We mapped out how the user will create edit and run their project.

Develop

High-fi Prototypes

From sketches to high-fi designs to similate the program in a real work enviornment, which waas used for user testing with other UX Designers existing in various product areas such as, iPlayer, News and more.

Deliver

Prototype Video Demo

A video demo of how users will interact with the prototype, as well as giving the developers a blueprint of how screens transitition from one to another.

Personal reflection

Personal Relection

During this project I was able to utilise research practices such as, competitor analysis and guerrilla testing. The interactive prototypes were both created in paper and high-fi, which gave me the opportunity to find different means to communicate ideas. A improvement that can be taken from this experience is that more user testing should of take place at multiple stages of development.