Blackmagicdesign

YEAR

2019

SKILL

UI/UX DESIGN

Blackmagic Design is one of the world's leading innovators and manufacturers of creative video technology. A company dedicated to quality, stability and focusing on where it's needed most; The company has created some of the most talked about products in the industry. World famous for their unbeatable codecs, Blackmagic envisioned truly affordable high-end quality editing workstations built upon Blackmagic software and hardware.

Blackmagic_Cover

Overview

In 2019, the audiovisual industry generated a margin of 22 billion dollars worldwide. In addition, the number of audiovisual production companies have been constantly rising since 2000. The main reason for the fast development of this industry has its roots in the multiplication and expansion of new electronic devices (TV, computer, tablet, smartphone, etc.), that allow an easier access to content on the internet. Therefore, it became possible for almost everyone at any time to watch films, series or videos on social networks, which led to the very strong and fast rising demands for video entertainment. In order to keep up with the increasing demands, the video/film sector is dependent on technological developments and consequently on the companies that provide, build and develop these needed tools and devices, to enable the creation of visual content. These actors are working to create or improve the technologies of tomorrow.

My role

Blackmagic Design decided, in order to redesign their interface, to form a team of designers dedicated to this particular challenge. So over 10 weeks, a design thinking method was put in place. My roles within this team were to take care of the wireframing part, in collaboration with an UX Designer. However, most importantly I was in charge of  the creation of the design system and the finalized mock-ups of the website in collaboration with 2 company based graphic designers. The team that was involved was composed of a Product Manager, UX Researcher, UX Designer, Lead developer, an engineer, the Marketing Director and me as a UI Designer. At first, I participated in various workshops (such as affinity diagram, personas and ideation). After that, I took over the responsibility for the guidelines regarding the graphic creations and ergonomic choices. This was always done in perfect harmony and cooperation with the UX Designer, team members and the different stakeholders.

Blackmagic_Logotype

Challenge

While reworking the overall structure of the website and hierarchy of key pages, we focused on applying good ergonomic and UX Design practices, with the aim of further conversion. Thereby, particular attention was paid to redesigning the forum section for two reasons. First, to satisfy the users expectations to solve their problems faster and easier and secondly to reduce the calls to the customer service team (with topics and questions that have already been discussed and solved in the forum). Additionally, the improvement of the performance on mobile devices.

Another challenging task was to increase Blackmagicdesign's influence among the actors of the audiovisual industry such as production companies, directors and producers but also to reach new targets such as streamers, bloggers or youtubers. Finally, we ambition to grow the community, in order to undertake co-creation process on new tools.

Blackmagic_Website_Interface_Homepage

A double-diamond design thinking method ( developed by the Design Council), allowing a user-centred approach, has been adopted to this project in order to redesign the Blackmagic Design website. By alternating phases of divergence and convergence we were abled to respond to existing design and usage problems. Moreover, we were able to gain a better understanding of the needs and use from the users. This was possible, thanks to various workshops, which helped to create the right solutions for the existing problems. It also made it possible to engage the whole team transparently during all stages of the process.

Blackmagic_Method_Design_Thinking

Based on the first phase of research and analysis, carried out by the UX Designers (on technologies, discrepancies, applications and conventions) the whole team was able to detect, define and classify a number of important insights. The following are the three main ones:

- More transparency and accessibility to products
- Clear and quick assistance for the customers 
- A satisfying and surprising mobile experience 

Based on this research, several ideation workshops were set up, allowing us to find the maximum of solutions to each problems. Followed up by this, we were able to create the first wireframes

Blackmagic_Wirefrime_Website_Lowfi
Blackmagic_wireframe_Website_Highfi1
Blackmagic_wireframe_Website_Highfi2

A design system was conceived to give more consistency on the website. It aimed to be useful to all the teams by being more efficient on the workflow, faster to prototype new features, to lighten the process and improve the experience. 

The system wants to be flexible enough to support the implementation of new components by the teams, finding the right balance to always be identifiable as Blackmagic Design, and give the users the best experience.

Relying on feedback collected during interviews with users, we were able to gain the knowledge that it was important for the users to find the content they want on the Blackmagic Design website quickly and easily. To do so, a new search feature had to be implemented even though the new designed structure was already intended to be more intuitive than before. 

Blackmagic_Website_Search_Feature

The entire tunnel, leading to finding a reseller (resulting in an acquisition) was reworked. Now the product page is featured by a gallery showcasing all items sold by Blackmagic Design. It provides an overview of the available items and therefore makes them more accessible. Furthermore, the new design is allowing us to focus more on the product sheets and to highlight the quality of the goods in order to gain new potential costumers.

Blackmagic_Product_Page
Blackmagic_Product_Page_Focus

The forum was undoubtedly the most important issue to be revised, due to the fact that it was a request not only from the Blackmagic Design teams but also from their customers.

Firstly, to boost the engagement, it was necessary to improve the structure of the page, resulting in more simplicity and clarity for the presentation of the content. Secondly, the profile section had to be accessible quickly, easily and from everywhere. It should be visible at the first level of the browsing, allowing the user to be notified, find or archive topics and comments. 

The reasons behind it are, firstly to develop the community and secondly to provide an essential contact and help option for costumers with problems or requires related to the products of Blackmagic Design. 

Blackmagic_Forum_Category
Blackmagic_Forum_Sections
Blackmagic_Forum_Topic
Blackmagic_Design_Website_Pages
Blackmagic_Website_Profil_Dashboard

In order to meet the user requirements, the mobile experience had to be equal to the one on desktop. We therefore spent a lot of time optimising the content on this channel to make the immersion pleasant. 

Blackmagic_Wireframe_Mobile_Lowfi
Blackmagic_Wireframe_Mobile_Highfi
Blackmagic_Mobile_Interface_Homepage1
Blackmagic_Mobile_Interface_Homepage2
Blackmagic_Mobile_Interface_Pages
Blackmagic_Mobile_Interface_Products_Page
Blackmagic_Mobile_Interface_Product_Focus

Let's work together, get in touch!

© Thibaut Benon 2021

Projects [8]

Thanks!

Thanks!

Thanks!

Thanks!