Une image en 3D avec juste du CSS et de l'html
Román Cortés a réalisé une vraie prouesse technique : réaliser une image avec un effet 3D interactif sans utiliser ni Flash, ni Javascript. Uniquement des instructions CSS et html.
Il est parti du tableau Les Ménines, peint par Vélasquez. Par découpage, il a créé des premiers plans et des arrières-plans, en complétant les parties de l'image qui étaient masquées dans le tableau original. Puis il a programmé le mouvement relatif de ces différents plans en fonction du mouvement de la souris au dessus de l'image. Il a créé comme ça un "diorama", donnant ainsi une profondeur jamais vue à ce tableau peint en 1657.
Ca redéfinit cette peinture différemment. Par exemple, un troisième tableau apparaît en haut à gauche au fond de la pièce ...
Cela me rappelle une scène célèbre de mon film culte "Blade Runner", quand Deckard explore une photo, et qu'il découvre une femme qui était cachée derrière un rideau de douche ...
Pour en savoir plus :
1. CSS 3D Meninas (Román Cortés)
2. Les Ménines (Wikipédia)
3. Blade Zone
Crédit image : Román Cortés
écrit par Luc | lien permanent
2 Comments:
Sur que si Velasquez voyait ça de là-haut, il n'en reviendrait pas.
Bel effort, mais je crois que je préfère l'original...
Tout en HTML ? Ca me rappelle un peu le "ASCII art" ou Brigitte Bardot était représentée par un canevas de caractères alphanumériques. Bel effort, mais très laid !
Enregistrer un commentaire
<< Home