Portfolio

Notable work

Xperidia

Team's UX & UI designer

Thinking immersive. As a video game.

One of the first thing I noticed while entering the Xperidia's Team was the inadapted UX on their website. Text took the whole screen width and text wasn't that easy to read. After needs studies, I find out that immersive content were needed, to make the site looks like video games menus, especially since some of the website pages were displayed in a video game addon spalshes.
That worked pretty well, and when the CEO saw how the page rendered in the game-addon spalshes, he told me that I'm the designer of the team.

some screens

Giving identity. For what matters.

My second task in Xperida was logo-designing. The original logo wasn't that bad but colors didn't match that well and scales wasn't that great. So, I took some interesting elements from the original logo : The rounded shape and the futuristic font. Putting them in my own icon shape already made a great logo, but I felt that something was missing : the originality and a little touch from the futur. Using nested geometrics shapes (like a circle and a triangle) gives a quick flat, geometric and futuristic touch to the logo, and it worked pretty well.
The final part was about shading the logo : Using 3 shades of cyan, I defined a bottom light, inverting some parts for a 3d effect.

logo of xperidia

Evolving according to the user. Because he's the focus point.

The first day I worked on their website, I took hours browsing the old website, trying it on many different ways. I looked the most viewed pages and how you could access to them. It was about 3+ clicks. Also, one part of the users came to the site to get external links.
That's how I got the idea : spliting the navbar in two sides at the left and right sides of the page, one for the externals links and another for the internal.

One of the side menus

The power of symbol. It's the heart.

The shape, colors, ... : It's not only the name that makes the brand. These elements are central part of the identity. I used them for each services that is linked to Xperidia : the shopping, the monitoring ... Because everytime you look at one of these logos, you know that's Xperidia.

One of the side menus

Eq Engine

UX Lead / UI designer / Artworks / Interface
Textures / Shading

Thinking user controls. Everything have to be utile.

One of the common problem I encounter in videos games is settings menu. A lot of "small" games have options ungrouped, so you'd easy to get lost among all the options.
I gathered every common settings by their respective cathegories, and I made the choice to have only a few basics settings, working with presets. Why ? Because I watched some peoples setting un games : Most of the time they don't even know what the option does and try to change until the screen stopped freezing.

One of the side menus

Making an unique design. For an unique game.

Try to be different but not that much, that the challenge I faced. I tried something I never done before : wireframe icons. Using the hexagon as base shape, I made icons with a new base. The geometry give a futuristic touch to icons, while wireframe borders make them look light and simple.

One of the side menus

Adapting identity. Because it's game-related.

After the game UI concept, I realized that every games have their own website, which was more or less close to the game UI. So I took the game guidelines and I tried to put them on a website.

One of the side menus

Working with non-flat elements. Gives realism.

On the video game world, you both have to be simple and neat. Players want a simple user interface - or at least an easy-usable one - and neat graphics (Neat graphics ain't necessarily realistic).
When I designed shaders and the logo, I tried to be as clean and neat as possible, while keeping everything simple. I quickly noticed that pure flat element doesn't match that well to the "neat" aspect that most players wants, so I tried slicing a bit the bottom part of the logo. Geronimo ! It worked pretty well.

3D view of the eq logo with layers

Compressing grid layout. Size matters.

I made a grid with different cell sizes: the biggest the cell is, the more important it is.
Also, I tried to make a balance between different cell according to their size. Biggest cells are on the extremities, while smaller ones are centered. It make the user focusing to the panel which contains the grid, and the most important options are quickly accessibles (you don't have to hover the whole panel to get the most used option)

A grid view

RKS

Logo designer / Infographist

Thinking the identity. Reflecting the activity.

RKS is a brand about comics and illustrations. Thinking of well-known cartoons and comics, I used a flashy red on a yellowish white. It remind us the comics paper and cartoon colors on the 80's TV shows.

A grid view

User-based interface. Give users what they need.

I splitted into two bloc the 'user profile' page, giving important information on the left, while the content remain on the right.
Indeed, most of us are right-handed. Putting the content users are looking for on the right and the details on the left give users a smoother navigation experience.

A grid view

Responsive. Reponsive everywhere.

Responsive make your page flexible and good-looking on every devices
When users access the page on their device, It should give the same content than a desktop webpage, in an adapted view.

A grid view

Icons design

Making happy little icons

The perfect base For -pixel- perfect icons.

I made a grid with different cell sizes: the biggest the cell is, the more important it is.
Also, I tried to make a balance between different cell according to their size. Biggest cells are on the extremities, while smaller ones are centered. It make the user focusing to the panel which contains the grid, and the most important options are quickly accessibles (you don't have to hover the whole panel to get the most used option)

A grid view

Browser support Because everyone loves my icon.

Except IE8 I guess :/

A grid view