![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/1400/1df085144210647.62880004e1733.jpg)
As part of the launch of the 24i's new product, I was in charge of the visual identity, look and feel of the visual materials around this product.
In a nutshell, the company launched unique managed service that can be used with any video streaming platform. It harnesses the power of your data to take recommendations and personalization. The product combines AI-powered algorithms and human analysis to drive dynamic.
☝️Please, keep in mind that I only worked on the visuals for marketing purposes. All copy, product designs and development work have been done by other stakeholders of the project.
__________________________________________________
1. General look and feel of the marketing visuals
All the communication assets have been built on a linear gradient dark background combined with a orange-peach radial gradient behind the product image.
The dark theme has been chosen to make the new product stand out from the other products with a lighter visual identity. Therefore, the dark background perfectly fits the data and analytics theme. The peach colour is one of the primary colours of the brand.
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/d8811b144210647.62880004e0d1f.jpg)
Banners and social posts
Gradients spec
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/1400/64a8e7144210647.6295dd7c6a6bc.jpg)
__________________________________________________
2. Social media visual materials
Social media grid
All communication visuals for social media have been built following this grid.
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/098d91144210647.62880004e024f.jpg)
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/7d50bc144210647.62880004e335c.jpg)
Example of a social media post
__________________________________________________
3. Emails
All emails visuals have been built following the visual identity of the product.
The emails have been tested on desktop and mobiles and on a light and dark background.
The email has been created in collaboration with a business analyst.
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/be787d144210647.62880004e52a2.jpg)
__________________________________________________
4. Website
All website artboards have been done on Sketch. To make the work easier and quicker, a design system has been created and used.
The development work has been done on Webflow in collaboration with an in-house developer.
All website content and spec have been delivered in advanced to the developer in a development kit. This development kit was made up of a sketch file, extra indication regarding the spacing system and a folder with well-organised and names pictures and svg files.
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/d3c900144210647.62880004e1d72.jpg)
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/c9d18d144210647.62880004e4a37.jpg)
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/2f138a144210647.6295dd7c69ef2.jpg)
Example of extra guidelines for the developer and other designers
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/475700144210647.62880004e3afb.jpg)
Spacing indications for the developper
__________________________________________________
5. Print materials
Some tree-folds have been developed for trade shows.
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/b04b8c144210647.62880004e2b4d.jpg)
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/10f728144210647.6295dd7c695a0.jpg)
Anatomy of the new component for the threefold
__________________________________________________
![brand identity dark dashboard Data data visualisation gradient Recommendations Streaming ux visual design](https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/b86414144210647.62880004df9f7.jpg)