Léo Parpeix

My Role

Year

Type

Léo

Profile

Hi, I’m a junior french art director with a keen interest in everything related to ui, ux, interactive and graphic design. I also find some happyness in web development using mainly javascript.

Today

I am looking for an apprenticeship contract as a junior art director in Paris from September 2019.

The brief

A publishing house is asking me to design an innovative, sensory and interactive online experience that complements the reading of a comic book.

My approach

In order to offer an innovative interactive experience, I decided to complete the web experience with a smartphone experience. Indeed, it allows to capture the attention of the reader and increase the immersion in the story.

The comic book

I discovered these comics at the International Comics Festival in Angoulême, France. Crépuscule attracted me with it’s colours, it’s incomparable pencil line and it’s original history. History has allowed me to project myself and design an interactive experience from this book.

Research and thinking

The first step of my reflection was based on a study of the reading interfaces offered by Google: editionsatplay.withgoogle.com. These study of these proposals allowed me to make choices about the interaction and relevance of using a smartphone. I also relied on the work of Étienne Mineur with his incredible work: volumique.com.

Research and thinking

The second step of reflection was chronology and respect for the narrative. Indeed, the author has chosen to represent the temporality of the chapters with colours:

Yellow: the very beginning, before the heroes appeared.
Red: the main mission, the most complete chapter.
Blue: the fall of history and the aftermath.

I found this concept very interesting, which is why I kept this concept in the realization of my reading experience.

UX and UI DESIGN

The interactive reading is intuitive, the user has quick access to the story with a horizontal navigation. Once the chapter is finished, the user is logically redirected to the reading of chapter two. It also has the possibility to navigate directly between the different chapters with the button at the top right that opens a menu.

Chapters design

In parallel with the web reading experience, the user can interact with his smartphone too move forward in the story.For example, in the chapter two, the hero use a map to get from one point to another. The user has access in real time to the position of the hero and the distance to his goal (according to his progress in the story). For some chapters, the user can interact with his smartphone, which allows him to engage and improve the immersion in the Crépuscule universe.I have decided not to make the use of smartphones mandatory, which can be annoying for a certain target, or inappropriate for people who do not have one.

Mobile Design

The mobile navigation experience is only available on certains chapters.

About the project

Expert in the subtle art of designing professional spaces, Camps Aménagement is a group specialized since 2015 in the company office design and layout particularized in high end.

Keywords

Professional - Top of the range - Performance - Comfort - Productivity

Homepage design

I decided to use pictures of paradisiac landscapes to allow the user to escape and dream for a few moments.
The photographs of the women are used to allow the target to identify himself at the interface.

Mobile application

I decided to design an application that would bring a different interactive experience to the website.
My main objectives were to have a pleasant time and to allow the user to travel.

Second page design

This page contains a complete description of the perfume.
I enlarged the photos to show the user that he is closer to the tropical universe and therefore to travel.

Homepage design

As part of a university project, I needed to create a responsive website in order to show the new collection of an agency : http://www.kazaconcrete.com.

Mobile First

I started to think about the user experience in mobile. The entire process contains 3 pages.

The first page is a small texte which present the activity of the brand and why they have made a new collection.I have placed the button 2 contact as soon as the first page of the site to allow customers who come to the site only to get in touch with the company to be able to make their request without having to do more than one click.
The second page is a list of all the products available on the website and the new collection.
The third page is the page that shows the product chosen. The user can find different information about the conception, the different sizes, the different colors and he can download some files about it.

The Website

The website is simple and pure with little textual information. I have put an imaginative slider to show some of the product’s stats in the collection.

The design is creative and is consistent with the fact that KAZA produces patterns that it uses to form a surface. In addition, I used pastel colors to stay in the world of luxury. The contrast between the round patterns on the background and the edges of the products offered for sale by KAZA makes it possible to add fantasy to a site where the user will be able to pay money.

Process of contact

I have also think about a modal in order to simplify the process of contact. With this element, the user can send a message ith all the elements without loading another page.