Christophe TESSIER

Direction Artistique : Christophe TESSIER

J'ai changé le concept précédent par celui-ci, car la structure du site, ses couleurs et le design me correspondent plus. j'ai souhaité rendre quelque chose de plus lisible, de plus agréable à l'oeil et surtout de pouvoir toucher un plus grand nombre d'internautes.


Les fonds d'images utilisés pour la charte graphique sont sensés interpeller aux visiteurs le monde professionnel dans lequel j'évolue sans en en dévoiler trop pour le pousser à ouvrir la porte.

Les 2 couleurs dominantes sont le blanc et le bleu.

Quelques autres couleurs apparaissent, mais restent dans le ton de l'ambiance imposée.

Version Desktop

Page de bienvenue sur mon site. Un petit message s'affiche en référence à une citation de Marc Zuckenberg. Ensuite pour entrer sur le site il faudra cliquer sur la porte. L'icône par défaut sera la porte fermée et lorsque l'on passera le pointeur de la souris dessus, on affichera la porte ouverte pour convier la personne à entrer dans le site.

Certaines écritures proviennent du site datafonts.

On arrive sur un écran qui ressemble énormément au premier et qui sera quasiment le même sur l'ensemble des pages. Mon nom est inscrit en bas de page a gauche  en écriture Orange Juice (48 - #676CFB). La personne pourra cliquer sur l'icône de son choix. Il y en a 4, plus les icônes des réseaux sociaux. Mon Parcours  qui énumérera mon parcours professionnel et scolaire. L'icône Centres d'intérêt regroupera mes loisirs, mes sports, voyages...  Le 3ième icône téléchargera mon cv au fichier .Pdf. Le dernier icône Quizz sera un petit jeu de questions portant sur la lecture de mon site et de questions qui tourneront autour de mon profil.

L'idée générale de cette page est de cliquer sur un icône représentant une étape de ma vie et d'en afficher le contenu dans la fenêtre du milieu avec un scroll vertical. Le texte sous les icônes est en "through the night" (12 - #676CFB).Lorsque l'utilisateur passera la souris sur une icône, apparaitra un cercle autour pour montrer a l'utilisateur qu'il y a une action à faire. Le bouton Retour revient sur le menu.

Cette page fonctionnera pour le moment comme la page "mon parcours". Par la suite elle devrait changer pour ouvrir une nouvelle page pour certaines activités et ou centres d'interêt.

La page Quizz qui sera un petit jeu de connaissances sur ma personne pour l'utilisateur et un petit test pour moi pour voir ce que l'on peut faire en code. Au delà de 5 bonnes réponses sur dix, ma photo apparaitra avec un petit message" Bravo" , dans le cas contraire je ferai apparaitre un pouce vers le bas avec un petit message sympathique demandant à la personne de recommencer.

Version Tablette

La version Tablette est un mixe des deux version.

Version Mobile

Pour la version mobile, j'ai décidé de m'orienter vers un au autre design que la version desktop, tout en respectant les couleurs et les images.

 C'est une version plus light, ainsi qu'au niveau du contenu. J'ai opté pour un design plus orienté application mobile. Pour entrer sur le site on clic sur le bouton Entrée
 

On trouvera tout au long de la navigation le même arrière plan. On retrouvera aussi les mêmes icônes que la version desktop. lorsque l'on passera son doigt sur un icône on réduira la taille de l'icône pour indiquer qu'une action est possible. Le texte sous les icônes est en "Trough the night" (11- #4A86E8)

3 icônes apparaissent sur la gauche. Il suffira de cliquer dessus pour faire apparaitre le contenu dans la fenêtre de droite qui utilisera un scroll vertical. Même principe que précédemment pour le "Touch" sur les icônes. Texte sous les icônes Robotto (8 - #4A86E8) et pour le texte en fenêtre ( Robotto (11- Bold - #676CFB). Le bouton retour revient au Menu.

Remarques

Create a presentation like this one
Share it on social medias
Share it on your own
Share it on social medias
Share it on your own

How to export your presentation

Please use Google Chrome to obtain the best export results.


How to export your presentation

New presentation

by ctessier

6 views

Public - 5/3/16, 2:36 PM