Menu

MKS Graphisme
Création d'un One Page en Parallax

Création d’un One Page en Parallax

Méta

MKS Graphisme

Méta

26 janvier 2015

C’est avec joie et fierté qu’après de nombreuses semaines de travail… des milliers de lignes de code, des centaines de tasses de cafés, des moments de rires, de larmes, de joie et parfois d’intense désespoir… nous vous annonçons la sortie de notre nouvelle réalisation web, la création d’un One page en Parallax sur le thème du Retro Gaming – mksgraphisme.com

 

 

 

Le parallax quésako ?!

 

Le parallax, c’est une tendance très à la mode actuellement dans le webdesign qui consiste à animer sur plusieurs axes des éléments, défilant à des vitesses différentes à mesure que l’utilisateur scrolle ou évolue dans le site web.
Cette tendance est désormais régulièrement utilisée par de très grandes marques, pour présenter de façon dynamique et originale un nouveau produit ou un futur événement.

 

Elle a beaucoup de succès, car elle est très prisée du fait qu’elle est dure à maîtriser, et aussi parce qu’elle correspond aux évolutions du webdesign et aux besoins de la communication digitale actuelle des grandes marques qui cherchent de plus en plus à impliquer l’internaute dans la navigation en lui proposant des expériences interactives et élaborées.

 

voici quelques exemples de sites internet parallax :

 

Oakley Moto : http://moto.oakley.com/

Burger King : http://mcwhopper.com/

Lexus : http://www.lexusls.asia/

Porsche : http://porschevolution.com/

Restaurant Le Mug : http://le-mugs.com/

Hôtel L’enclos des lauriers roses : http://www.hotel-lauriersroses.com/

 

 

Pourquoi faire un tel site internet ?

 

Nous aimerions vous répondre : « Le goût du défi ». Déjà parce que ça sonne bien… et ensuite parce que ça nous donnerait un côté aventurier du web 2.0… une souris en guise de couteau suisse, un clavier en lieu et place de lasso, de vieilles sneakers en guise de santiags et un jean usé en remplacement du pantalon en peau de crocodile.
Mais, pour vous dire la stricte vérité… tout est parti d’une blague… d’un défi lancé à la machine à café après être tombé lors de notre veille matinale sur le travail d’un webdesigner américain créant des personnages de Simpson uniquement en code CSS (langage informatique qui permet de décrire la présentation des documents web)

One page parallax

 

Challenge accepted !!

 

Voilà ce qui a subitement résonné pendant que coulait l’arabica. Challenge accepted !! À partir de là, ça serait à celui qui arriverait le premier à créer un élément graphique sans la moindre image et en utilisant que du code.
Voilà donc, comment est né la Game Boy utilisée dans notre animation et comment nous est venue l’idée de ce site internet One Page en Parallax sur le thème du Retro Gaming.

 

 

Un défi entre amis devenu un véritable site internet

 

Une fois celle-ci réalisée, nous avons voulu pousser le concept plus loin en créant d’autres éléments graphiques uniquement à l’aide du code CSS… nous avons décidé de rester sur la thématique du Retro Gaming et nous avons ajouté une borne d’arcade, une simulation du Tétris de Nintendo, du Space Invaders d’Atari, quelques éléments en Pixel Art, une vieille télévision, et la fameuse neige ou bruit blanc, qui si souvent les décoraient, et que les moins de 20 ans ne peuvent pas connaître… le tout, sans utiliser la moindre image, uniquement du code HTML, CSS et Javascript.

 

Une idée en amenant une autre, nous avons fini par nous dire qu’il serait intéressant d’essayer de pousser encore plus loin le concept et de voir si nous pouvions tout assembler de façon harmonieuse au sein d’un site internet et de les animer en parallax… et voilà donc comment est né notre site web one page en parallax sur le thème du Retro Gaming.
Et même si tout cela est parti d’une blague et que nous nous sommes énormément amusés à le faire, ça nous a demandé beaucoup de travail pour y parvenir et structurer le tout au sein d’un ensemble cohérent, à la navigation originale et innovante.

 

 

Des retombées bénéfiques pour les créations web de nos clients

 

Ce défi nous a par la même occasion permis d’apprendre de nouvelles choses que nous nous réjouissons par avance de pouvoir proposer à nos clients, et ainsi mettre à profit notre apprentissage au bénéfice de votre marque, de vos activités et de votre communication digitale.
Car, souvent, nous sommes sollicités pour la création de visuels vidéos ou de motion design… éléments incontournables d’une communication réussie… mais, le parallax, faute d’être très développée et encore bien connue, peu de clients viennent de prime abord nous demander la création d’un site internet utilisant cette technique, alors qu’elle offre de larges possibilités de création et qu’elle permet de combiner au sein d’un même site web un aspect ludique et informatif se mariant parfaitement avec les impératifs de la communication digitale actuelle.

 

 

Une création récompensée par de nombreux awards du webdesign

 

Notre site web One Page en Parallax sur le thème du Retro Gaming – www.mksgraphisme.com a été très bien accueilli par la communauté du webdesign et les différents sites internet récompensant les meilleures créations web à travers le monde et nous avons eu l’honneur d’être à plusieurs reprises récompensé par le prestigieux titre de Site du jour.

 

 

Récompenses, Nominations & Web Awards :

 

CSS Winner – Website of the day

 

Best CSS – Site of the day

 

Web Guru Awards – Guru of the day

 

CSS Light – Featured of the day

 

CSS Villa – Featured of the day

 

CSS Nectar – Site of The Day

 

French Design Index – Mention Spéciale

 

One Page Love – OPL Awards

 

findWA – Best Web Agency

 

Forum Digital – Featured Most Loved Websites

 

The Design Inspiration – Showcase Gallery

 

Unmatched Style –Showcase Gallery & Review

 

One Xtra Pixel – Article réunissant 10 webdesigns originaux inspirés des années 90

11954810_1628165050757450_6153236129871821837_n

 

MKS Graphisme

Création de site internet

& Communication digitale