Si vous avez déjà développé un peu pour le web vous devez sans doute savoir combien il est fastidieux de faire des modifications CSS sur les textes.

Changement dans le CSS, hop rafraîchissement de la page, gasp l’interligne n’est plus bon => Nouveau  changement dans le CSS, re-rafraîchissement de la page…  Avouez que c’est pénible!

Fort heureusement, tous problème a sa solution. Grâce à un outil mis au point par l’agence Manufi vous allez enfin pouvoir modifier vos textes en live!

Finies les prises de tête et bonjour les joies du code ;-)

Accéder à l'application

[Source]

On ne le dira jamais assez, lors de la conception d’un site web l’ergonomie et l’expérience utilisateur sont deux éléments primordiaux.

Prenons la scrollbar par exemple (mais oui vous savez l’ascenseur sur le côté qui vous permet de descendre dans une page), un « objet » dont l’utilisation pourrait sembler bien anodine. Et bien, c’est précisément grâce à cet unique outil que fonctionne la navigation des deux sites que je vais vous présenter ce soir.

On commence avec le site beercamp.com le scroll est ici utilisé pour nous plonger au coeur même du site. Une sorte de zoom dans un zoom en quelque sorte (vous comprendrez la référence en allant sur le site ;-)

Enfin voici le magnifique site de Landrover et Victoria Beckham. Ce sont ici les effets de hover et de zoom qui ont été exploités en pagaille… Et ce,  pour le plus grand plaisir des yeux :-)

[Source]

C’est ce que l’on pourrait appeler du « CSSart », aux quatre coins du web naissent en ce moment des reproductions de logos créées uniquement à base de CSS.

Comme vous allez le voir, la ressemblance avec les vrais logos en chair et en JPG est parfois stupéfiante; d’autant plus que le gain de performances n’est pas négligeable. Au lieu d’avoir à charger une image de quelque dizaines de kilo-octets le rendu est ainsi créé quasi-instantanément par le navigateur.

Les puristes me feront sans doute remarquer que c’est bien se compliquer la vie pour rien. En effet pourquoi s’embêter à créer des logos en CSS alors que le SVG est un langage dédié pour cette tâche?

Ce à quoi je répondrais simplement: pour la beauté du geste :-)

A voir ici, là ou encore ici.

Si cela vous intéresse jetez un coup d’oeil aussi au projet iPhoneCSS3

[Source]

I’M BACK!

Après deux formidables semaines passées en Angleterre me voici de nouveau sur le continent européen. On attaque donc directement avec cette page 404 créative à souhait.

Vous connaissez tous cette fameuse page 404 tant redoutée par les internautes, et bien le réseau social Nosh a voulu innover en rendant sa page d’erreur aussi originale qu’amusante.

404 | We are sorry, the page you are looking for is lost

Nosh: 404 from Firespotter Labs on Vimeo.

On notera d’ailleurs que l’application iPhone du même nom intègre elle aussi cette vidéo.

Il y a quelques mois je vous présentais le travail incroyable d’Aaron Koblin. Si j’en reparle aujourd’hui c’est que ce dernier revient sur le devant de la scène avec un autre projet ahurissant.

Rome: 3dreams of Black est un film interactif qui plonge littéralement le spectateur au cœur de l’action. Pendant quelques minutes on assiste ainsi émerveillé à une petite prouesse technologique. Grâce à l’intégration WebGL c’est dorénavant l’intégralité du film qui se visionne dans Google Chrome!

Difficile de vous en dire plus tant l’expérience est déroutante…

Tentez l'expérience - Rome: 3 dreams of Black -

Dans la suite retrouvez le making-off du film ;)

Le web évolue Mozilla aussi. Voici quel pourrait être en substance le message lancé par la Mozilla fundation. Pour célébrer l’avènement du HTML5 ainsi que les nouvelles possibilités offertes par les standards W3C la firme au panda roux a récemment actualisé son site Webowonder.org (leur plateforme de démo). Dans cet article je vais donc passer en revue les innovations qui m’ont semblées les plus prometteuses.

Avant de commencer quoi que se soit il vous faudra mettre à jour vos pilotes graphiques (notamment si vous êtes sous Nux). Une fois cette formalité remplie, il ne vous restera plus qu’à ouvrir bien grands les yeux et plonger dans le monde merveilleux de Web o’Wonder!

En tant que graphiste/webdesigner je me suis d’emblée intéressé à la catégorie design. Trois innovations ont ainsi particulièrement retenues mon attention. L’intégration tout en souplesse du standard SVG, la 3D et les effets de drag&drop directement dans le navigateur. (Si tu me lis Good job Geoffrey ;)

Enfin pour terminer je voulais aussi vous montrer cette vidéo impressionnante.

Reprenant le concept de Google Street View la voiture GlobalVision (mandatée par Firefox) a descendue la croisette à Cannes. Jusqu’ici rien de nouveau sous le soleil (de Cannes) si ce n’est un détail incroyable ! Il est en effet possible de se déplacer à 360° dans l’image!!

Dans la suite je vous joint aussi la vidéo d’une conférence donnée à ParisWeb 2010 sur l’opposition HTML vs Flash par Christophe Porteneuve… Vous verrez, le ton est délibérément humoristique et on en prend plein les mirettes…