InterfacesRiches.fr

En ce moment ce sont surtout les social games et les Rich Internet Games qui sont sur le devant de la scène, mais il y a une catégorie de jeux en ligne qui pourrait bien faire un come back fracassant en 2010 : les point and click games. Apparus il y a presque une trentaine d’année sur les ordinateurs 8 bits, la particularité de ces jeux étaient de proposer  une ambiance très immersive et un gameplay avant tout fondé sur l’observation et la manipulation d’objets. Certaines choisissaient de tout miser sur le graphisme (comme le mythique Myst), d’autres sur l’humour (comme le non moins mythique Leasure Suit Larry).

Depuis ces jeux sont passés de mode et se sont fait complètement largués par les simulations sportives, FPS et autres MMORPG. Oui mais voilà, il semblerait que nous ayons atteint un pic de réalisme dans les jeux et que certains joueurs de l’époque (dont je fais parti) aient la nostalgie des jeux privilégiant la qualité de la création artistique (au détriment du réalisme) et de la narration. Mélangez tout cela à de nouveaux canaux de distribution comme l’iPhone et vous obtenez de très bonnes conditions de marché pour donner une seconde vie aux point and click games.

Illustration avec le grand retour de Secrets of Monkey Island sur iPhone :

Il y a aussi des spécialistes comme Big Fish qui proposent tout une série de Hidden Object Games :

Dark Tales disponible chez Big Fish Games

Ces jeux peuvent être testés en ligne mais sont limités car la version complète est payante et téléchargeable. Une mécanique bien huilée mais qui manque un peu d’âme (les jeux sont produits à un rythme industriel et se ressemblent tous plus ou moins).

Je vous propose donc de découvrir un jeu beaucoup plus intéressant : Machinarium. Le gameplay est le même mais le travail réalisé sur l’ambiance graphique et sonore ainsi que le story-telling est tout à fait remarquable :

L'univers graphique dégantée de Machinarium

Il est possible de jouer à la démo en ligne mais la version complète doit être achetée et téléchargée.

Les superbes décors de Machinarium

(via Tapahont)

Vous pourriez me dire que les jeux à télécharger n’ont rien de révolutionnaires, et vous auriez bien raison. Par contre se sont les conditions de marché qui ont changées : Avec la déferlante des netbooks, ce sont des millions de machines qui pourraient être ciblées par ces jeux, car ces dernières sont incapables de faire tourner des jeux plus lourds (avec de la 3D en temps réel). bon OK il y a bien eu cette démo technique au dernier CES (Tegra 2 runs Unreal Engine 3, puts high-end console 3D graphics in your pocket), mais ce n’est pas très sérieux de vouloir faire tourner un FPS sur un netbook.

Notez qu’il existe aussi d’autres plug-ins qui pourraient faire tourner des jeux de très bonne facture dans le navigateur, notamment le Unity Player qui propulse les jeux de Lego : Unity Powers 3D Lego Star Wars Browser Game.

Et ce n’est qu’un début puisqu’avec l’Open Screen Project, le lecteur Flash sera disponible sur de nombreux smartphones en 2010 : Flash Player bientôt disponible sur les smartphones Android. Autant de terminaux qui rentrent dans la poche et sont les compagnons de tous les jours de millions de trentenaires et quarantenaires qui ne demandent qu’à replonger dans les mécaniques de jeux de leur enfance, à l’image de ce portage de Maniac Mansion : Maniac Mansion 3D Remake.

Le remake de Maniac Mansion en Flash

Démo vidéo disponible ici :

(via Tapahont)

Netbooks, smartphones… il ne manque plus qu’un seul type de terminal à cibler : les touchbooks. Hé oui, car quand vous y réfléchissez bien les jeux en Flash qui fonctionnent sur le principe d’écrans à découvrir en cliquant un peu partout sont les candidats idéals pour venir apporter une dimension ludique aux touchbooks. Pour le moment le marché est embryonnaire, mais nous feront le point dans un mois ou deux quand la tablet d’Apple sera sortie et que le grand public découvrira le potentiel derrière ces machines.

Et tant que nous sommes dans le recyclage des jeux rétro sur des machines de nouvelle génération, nous pourrions-nous pas envisager un retour des jeux d’aventure textuels sur les ebooks ? Pourquoi pas des jeux du type Zork ou Les livres dont vous êtes le héros… Encore une fois je vous propose d’attendre quelques mois que les usages se développent.

J’ai comme l’impression que 2010 sera l’année de la 3D (ou peut-être bien 2011 le temps que les technologies murissent). Vous pouvez d’ors et déjà expérimenter de la 3D “nouvelle génération” dans vos salles de cinéma avec le film Avatar, mais vous pourrez bientôt en bénéficier chez vous avec l’arrivée de la 3D sur les disques Blu-Ray (3D high-def movies coming to your living room on Blu-ray) et sur les moniteurs (LG Unveils Full HD 3D Monitor) ou les équipements équipés de technologies comme 3Ddisplay.

Plus proche de nos domaines de préoccupation, les applications et sites web, nous allons commencer à voir des choses tout à fait intéressantes avec notamment ce brevet déposé par Apple pour une technologie mélangeant capture et affichage 3D : Apple Working on 3D ‘Hyper-Reality’ Displays.

L’idée est de pouvoir manipuler des contenus 3D sans avoir recours à des périphériques comme le SpaceNavigator en utilisant votre webcam. Dans l’exemple qui suit, il suffit ainsi de se pencher pour faire pivoter le graphique :

Déplacez des objets 3D avec votre webcam

Plus intéressant, cette technologie peut également servir à mieux s’y retrouver dans vos fenêtres en décalant votre perspective :

Mieux gérer vos fenêtres avec votre webcam

Une application fort utile car ne nécessitant pas d’apprentissage (elle reproduit un comportement de tous les jours).

Dans un registre plus terre-à-terre, et pour faire écho à la récente publication des spécifications de WebGL (WebGL draft published, Khronos seeks community involvement), nous commençons à voir des expérimentations d’applications en 3D temps réel dans le navigateur comme ici avec Cube Defense :

Un jeu de tower defense dans votre navigateur avec WebGL

Rien de révolutionnaire, si ce n’est le fait que cette application ne nécessite aucun plug-in (juste un navigateur compatible). Démonstration vidéo ici (via 3D Test) :

Terminons cette série avec la “3D du pauvre” (n’y voyez rien de péjoratif) réalisée uniquement en CSS : CSS 3D Meninas. L’astuce est de simuler une profondeur de champ avec le mouvement de la souris :

En déplaçant la souris sur la droite de l’image, vous déplacez les différents éléments du tableau :

Les explications sont ici : De la fausse 3D à l’aide de CSS3.

Ces différents exemples ne sont pas directement liés, mais ils illustrent une tendance de fond qui va monter en puissance l’année prochaine. Ça à commencé au cinéma, ça va arriver sur votre TV et votre ordinateur, la prochaine étape sera votre mobile : 3-D Untethered: A Look at Mobile 3-D Technology. À suivre…

Je viens tout juste de prendre connaissance que la marque danoise de vêtements Red Issue vient de remporter un Webby award pour avoir pensée à un mode de navigation qui s’inspire de l’Iphone.

Pour naviguer sur l’interface en Flash, il faut dessiner une flèche, un rond ou encore un M.

Flèche = Image suivante ou précédente.
Rond = Zoom.
M = Menu.

Sur le plan de l’expérience utilisateur, je trouve cette exploration très intéressante. Ce type de navigation qui déclenche des actions grâce à la reconnaissance des dessins a aussi été utilisé ailleurs. Prenons par exemple l’interface du jeu  Straw Hat Samourai et  Toshiba .

Straw Hat Samourai

Grâce à la reconnaissance de forme, nous évitons les clics de souris et le clavier.

Toshiba

Pour déclencher des actions, il faut dessiner des formes. L’interface reste toutefois très lourde à charger ce qui ralentit le tracé de la souris.

Rencontrerons-nous de nouvelles interfaces Web qui détecteront la reconnaissance de forme dans les prochains mois ?

Qu’en pensez-vous ?

Source : Arnaudmeunier et Herbiflux

P.S. Je vous invite aussi à consulter l’article Immersion tactile pour Metal Gear Solid Touch sur Richcommerce.fr

Je suis passé complètement à côté d’une réalisation tout à fait intéressante : la Culturebox de France3. Il s’agit d’un service de catch’up TV (”pour regarder sur le web une émission diffusée récemment sur ta télé) qui présente la particularité de proposer une interface sous forme de mosaïque de vidéos :

La mosaïque de vidéos de Culturebox

Pour ne pas alourdir la page, les vidéos ne sont animées que de façon aléatoire et une info-bulle géante présente le détail de l’émission. Une initiative tout à fait intéressante dans la mesure où les contenus produits par France3 sont de qualité (uniquement des sujets sur la culture) et de courte durée (donc adaptés au support web).

Vous avez également la possibilité de filtrer les émissions par région ou par thème à l’aide de la télécommande :

Les contenus régionaux de la Culturebox

Notons que le lecteur est d’une sobriété à toute épreuve qui me fait penser à celui de M6 Replay mais qui remplit très bien son travail :

Le lecteur de vidéo de la Culturebox

Un grand bravo aux équipes derrière cette réalisation. Plus d’infos ici : Culturebox, le concentré de culture de France 3.

Ford a toujours été précurseur en terme d’interfaces riches avec notamment le Towing Guide dès 2005 (remplacé depuis par un showroom universel). Ford poursuit sur sa lancée avec un travail très intéressant de refonte des tableaux de bord des véhicules hybrides : Ford’s Green Plan to Drive Sales.

Le résultat est tout simplement splendide avec une planche de bord dopée aux widgets :

Un tableau de bord"riche" chez Ford

Un très beau travail de reconception réalisé par l’agence Smart Design avec une très bonne lisibilité et de belles proportions. Quel dommage par contre que des voyants plus classiques soient éparpillés au dessus et dans les angles. J’imagine que c’est pour une raison de sécurité, si l’écran ne fonctionne plus les voyants sont toujours actifs.

Dans le même genre il y a également le très futuriste tableau de bord de la Lamborghini Reventon :

Tableau de bord de la Lamborghini Reventon

(via Information Aesthetics)

Nous connaissions déjà Hema, cette boutique hollandaise où un gobelet qui bascule provoque une réaction en chaîne et détruit tout le “linéaire” :

Avant

Après

C’est maintenant le tour de Wario de nous défoncer la page de YouTube pour le teaser de son nouveau jeu (Wario lan Shake It) :

Avant

Pendant

Après

Même si ces destructions de page sont perturbantes pour le navigateur (possibilité de plantage), ces animations n’en restent pas moins terriblement efficaces. Attendez-vous donc à une vague de vandalisme dans les prochaines semaines… Vous connaissez d’autres exemples ?

J’ai découvert un site bien étrange ce matin : This Is The Index Page. Lancé par Converse, le but de ce site n’est visiblement pas de vendre mais plutôt de faire partager une expérience aux visiteurs. Ces derniers sont donc confrontés à une liste d’URL qui défilent :

Toutes ces URL sont toutes plus étranges les unes que les autres… Vous en choisissez donc une au hasard (KissingWithRoss.com) et vous tombez là-dessus :

Vous pouvez ensuite naviguer entre les URL à l’aide des flèches en bas de l’écran ou revenir à l’index pour en choisir une autre (ex. OutOfYourLeagueGuyOnMotivation.com) :

Étrange ? Oui complètement.

Absurde ? Parfaitement.

On y comprend rien ? Oui, effectivement.

Mais à quoi ce site peut-il bien servir alors ? À planter le décor, à recréer un univers de marque décalé, à plonger l’internaute dans un contexte très imerssif (d’où le recours à la vidéo en plein écran).

Bref, c’est ce que je prux définir comme de l’Ambient Branding : la gestion de l’image de marque au travers de scènes et d’ambiances. Je ne sais pas si c’est efficace mais le dispositif est très intéressant et surtout disruptif…

Vous aimez ?

(via iMedia Connection)

Il existe déjà de nombreuses applications et services de cartographie : En 2D (Google Maps, Yahoo! Maps, Live Maps, Mappy, Via Michelin…), en 3D (Google Earth, Microsoft Virtual Earth, Map24…). Mais il manquait quelque chose d’intermédiaire.

Ce vide est maintenant comblé avec ce service de cartographie en 3D isométrique (autrement appelée la 2,5D) : OnionMap.

C’est visuellement très mignon et surtout moins lourd que de la vraie 3D. Pour l’instant il existe une petite dizaines de villes mais ils promettent d’en rajouter régulièrement.

Et si ce mode de visualisation vous intéresse, je ne serais que trop vous recommander cet autre site qui propose une vue 2,5D de Hong Kong : Hong Kong Edushi 3D Map.

Alors… un nouveau créneau à prendre ? (via Information Aesthetics)

Si vous me lisez régulièrement alors vous devez déjà savoir que j’adore les schémas et autres représentations visuelles synthétiques. En fait j’affectionne tout particulièrement les timelines car elles permettent de représenter la chronologie d’évènements de façon très efficace.

Dans ce domaine Google propose ainsi une timeline tout à fait intéressante chez Google Finance :

Cette timeline permet ainsi d’associer des évènements (communiqués de presse et actualités) à des évolutions du cours de l’action. Vous apprécierez au passage la très élégante possibilité de jouer sur l’échelle et sur la plage de visualisation (à l’aide de réglettes et de glissé/déposé.

Autre exemple encore plus intéressant avec la timeline du tout nouveau SoundUnwound lançé par Amazon (cf. Amazon Launches Social Music Site). Cette gigantesque base de donnée musicale (sur le même modèle que IMDb) propose ainsi une représentation chronologique de la discographie d’un groupe en y incluant les “plages de présence” des différents membres du groupe ayant participé à tel ou tel album : Timeline for Soundgarden.

C’est encore une fois du très bon travail car la visualisation et la manipulation sont très intuitives. Vous pouvez de plus cliquer sur les membres du groupe ou sur un album pour faire remonter plus d’infos via une info-bulle géante.

Enfin comment ne pas traiter ce sujet sans évoquer AllOfMe, un service entièrement dédié à la publication et au partage de timelines “publique” : Apple Products Timeline.

Vous noterez en haut à droite la possibilité de changer l’échelle ainsi que les très belles info-bulles géantes.

Quel dommage par contre que tout ces services reposent sur Flash (impossibilité de chercher ou de convertir une timeline en tableau avec du texte).

Les interfaces riches basées sur l’intérêt et les goûts de l’utilisateur sont selon moi les plus intéressantes à visiter.

inSuggest, lancé en janvier 2008, est un des nombreux exemples que j’ai en tête ! (Je prévois vous en montrer d’autres prochainement)

Développé dans le même esprit de WhoIsLikeIt, inSuggest se différencie par son interface en Ajax, sa fonction glissée déposée ainsi que la recherche de photos et la suggestion de sites en accord avec vos tags et bookmarks del.icio.us.

Recherchez des sites similaires :

En saisissant et validant l’URL d’un site que vous appréciez dans le champ de recherche en haut de la page, inSuggest vous propose rapidement une sélection de sites similaires à celui suggéré, sous la forme de vignettes cliquables. Vous pouvez ensuite continuer en glissant une vignette sur un espace de suggestion. Le moteur affiche ainsi une nouvelle liste de sites similaires.

Recherchez des photos similaires à celle que vous donnez comme modèle :

En saisissant et en validant un ou des mots clés, inSuggest affiche images qui se retrouvent sur la base de donnée de Flickr. Puis, en glissant une image sur un espace de suggestion, vous obtiendrez une nouvelle liste d’images semblables.

Recherchez des sites en accord avec vos tags et bookmarks del.icio.us :

En soumettant votre identifiant Del.icio.us, inSuggest vous propose des signets en relation avec ce que vous bookmarkez.

Je me questionne maintenant du moment ou il sera possible de permettre la recherche de vidéos similaires sur Insuggest ! Qu’en pensez-vous ?