Archive pour la catégorie ‘Innovation’

LES LABS, tendance du Web

Lundi 7 décembre 2009

Tous les grands acteurs du Web s’y sont mis, alors c’est quoi un lab ?
Le phénomène ne date pas d’hier, il fût initié par Google puis repris par beaucoup d’autres comme Apple (finalemement, son Apple Store est une sorte de lab très rentable), Digg, Twitter, Orange valley, facebook…

Le fonctionnement d’un lab :

Les objectifs peuvent variés, mais les constantes sont :

  • - faire tester des applications sans trop investir, sans s’engager sur leur fiabilité
  • - innovations (application, dispositif, …)
  • - espace de créativité (on met en œuvre des idées afin de les évaluer)
  • -plateforme de tests auprès d’utilisateurs réels
  • -possibilité à certains utilisateurs de participer à l’élaboration et au développement d’un projet

Et chez n², que pourrait être le lab ?

  • - veille individuelle des créas puis partagée
  • - veille individuelle des développeur puis partagée
  • - veille individuelle des chef de projets puis partagée
  • - échange, synthèse sur les tendances et les expérimentations de chacun

Sur ces bases, nous pouurions injecter certaines idées dans les projets en cours ou à venir pour les nourrir afin de les dynamiser, de les améliorer et d’innover.

en savoir plus :
http://www.presse-citron.net/les-labs-une-autre-tendance-du-web-meme-twitter-sy-colle

L’élégance du Design, façon R’Pure

Mardi 13 octobre 2009

r_pure

Une autre très belle interface en Flash pour le site R’pure :
studio de design packaging, produit et graphique.

Vous remarquerez l’élégance des lignes établissant des liens relationnels entre matériaux et nature du produit (cf. entrées de gauche et de droite).  Les courbes se tendent et se détendent au grès des de la manipulation des images.

http://www.rpure.net

Frisco

Un coup d’oeil sur les interfaces expérimentales, avec Bestiario

Jeudi 8 octobre 2009

bestario

Ce site n’est pas « tout neuf, tout neuf », mais il référence un certain nombre de sites aux interfaces surprenantes et parfois impressionnantes, toutefois l’ergonomie n’est pas toujours de la partie, mais à voir.
http://bestiario.org/

Il me fait également penser à de l’art génératif et au travaux d’Aaron Koblin
http://www.etapes.com/actus/video-interview-de-aaron-koblin
http://www.aaronkoblin.com/work.html

koblin

Conférence annuelle Adobe Max : focus sur l’édition 2009

Mardi 6 octobre 2009

adobe_max_2009_02
Cette conférence, organisée par Adobe a lieu tous les ans à la même période. Cette année c’est à San Francisco !
Parmi toutes les grosses annonces, celles qui nous intéresserons le plus sont :
- Sortie du flash player 10.1 et de Air 2.0,
- Flash CS5

Flash player 10.1 :

Le nouveau player flash, (conforme aux spécifications de l’Open Screen Project) a pour but de garantir un comportement homogène sur les différents types de machines comme les PDA(s) (Android, Symbian, PalmOs …), netbook, ordinateurs traditionnels… Il sera disponible d’ici le premier trimestre 2010. Malheureusement, l’iPhone, ne permettra toujours pas d’utiliser le player Flash.

Pour permettre cette homogénéité, l’accélération matérielle sera enfin mise en place (les équipes d’Adobe étant apparemment en collaboration avec Qualcomm, Nvidia et Nokia). Les netbooks pourront enfin permettre la lecture de vidéos HD sans trop de problèmes.

Ajouté à tout cela, il supportera le multi-touch (très utile pour les appareils mobiles ainsi que les écrans tactiles).

Flash CS5 :

Pour l’instant, peu d’infos le concernant. La première version bêta devrait être disponible d’ici la fin de l’année, aucune date n’étant annoncée pour la version finale.

Une des grosses nouveautés, pouvoir développer des applications iPhone (dont certaines étant déjà disponibles sur l’AppStore) ! Malgré le fait qu’Apple soit contre l’intégration du Player Flash dans Safari, les développeurs ActionScript pourront tout de même développer des applications (compilé en Objective C par CS5).

Air 2.0 :

Peu de nouvelles jusqu’à maintenant… Une amélioration, semble t-il notable des performances, meilleure prise en charge du hardware (clé usb, micro) et enfin le support multi-touch tout comme le Player Flash 10.1

Concernant le reste de la suite Adobe et leur version CS5, pour l’instant très peu d’infos … ont filtré. D’ici la fin de cette conférence (qui pour rappel dure trois jours), nous devrions y voir un peu plus clair.

Mickael

Interface cachée, interface objet

Jeudi 1 octobre 2009

Une tendance semble se dessiner. Les interfaces deviennent de plus en plus transparentes, se dématérialisent au sens propre comme au sens figuré. Que se soit OS X leopard, PLASMA KDE sur LINUX, Windows VISTA et son remplaçant SEVEN, tous ces systèmes d’exploitations tendent à adopter des environnements graphiques (GUI) qui reproduisent l’aspect du verre dépoli surtout dans la représentation des fenêtres mais aussi celles de nombreux éléments de l’interface, sans compter la généralisation du support multitouch.

pile (stack) apple Mac OSX / Iphone

pile (stack) apple Mac OSX / Iphone

Le système des icônes placées dans une fenêtre semble vivre ses dernières années. Les icônes deviennent le contenu du document qu’ils représentent et ne sont plus une reproduction symbolique associée à un nom de fichier comme cela a été le cas ces dernières décennies. Nous passons d’une représentation abstraite du document numérique à une représentation figurative. Les dernières innovations permettent d’agrandir l’icône et de prévisualiser le contenu du document. Les dossiers ne sont plus représentés tels qu’ils l’étaient mais empreintent le concept de pile de documents (ou stack) comme on empilerait nos documents sur un bureau réel. Les interfaces mobiles (aux écrans de tailles réduites) préfigure semble t’ il la généralisation de ses principes.

Si nous poussons la logique jusqu’au bout, c’est l’interface elle même qui disparaît au profit de l’objet intelligent, l’interface étant cachée dans l’objet lui même.  Microsoft imagine dans le futur que l’interface soit totalement transparente et qu’elle se mélange à notre environnement immédiat. Cf vidéo ci-dessous
L’objet devient alors l’interface.

http://www.officelabs.com

Par conséquent, nous nous retrouvons avec l’impression que les interfaces vont se multiplier dans un avenir proche mais que les standards ne sont absolument pas établis. J’ai envie de dire que nous vivons la phase la plus excitante de se genre d’innovation.

Pourquoi parle t’on de standard ? Tout simplement parce que, qui dit interface dit aussi apprentissage de cette interface. Même si ces interfaces se veulent intuitives, on sent bien qu’au travers des différentes démonstrations des prototypes, ces innovations requièrent un apprentissage gestuel et cognitif.

Plus ces interfaces semblent transparentes, plus elles mettent en jeu des techniques complexes. Nous, nous dirigeons alors vers encore plus d’opacité technique (même si l’interface est intuitive elle n’en demeure pas moins mystérieuse / magique et techniquement de plus en plus complexe à comprendre pour le quidam et par conséquent elle nous échappe)

Quelques liens et vidéos sur le sujet

Touch (multipoint)

http://www.perceptivepixel.com

perceptive pixel / jeff hann

perceptive pixel / jeff hann

Apprentissage des interfaces, des gestes

Table Windows SURFACE
http://www.youtube.com/watch?v=ZlWCgWCoeOg
Interconnexion des objets entre eux (généralisation du sans fil)

Piloter un ordinateur avec des gestes

L’histoire du multitouch
http://www.billbuxton.com/multitouchOverview.html

Grape, votre bureau de demain ?

http://www.mac4ever.com/news/43093

grape pour OS X, permet d'organiser les fichiers par projet de façon visuelle

grape pour OS X, permet d

Intuition
Manipulation / la main / disparition du pointeur
On avait symboliser la main par le pointeur de la souris, aujourd’hui, la main n’a plus besoin d’être représentée puisqu’elle c’est elle même qui agit sur l’interface

bureau virtuel en 3D

BumpTop 1.0 – 3D Desktop Zen

http://www.engadget.com/2009/04/08/video-bumptop-gives-windows-7-touchscreen-pcs-purpose/#continued

bumptop, prototype de bureau 3D

bumptop, prototype de bureau 3D

BumpTop est un bureau virtuel en 3D facile à utiliser qui imite notre comportement et face à un bureau réel. Selon le site, cette interface innovante vous permettrait d’être plus productif.
Ce bureau Windows organise visuellement vos fichiers, permet le rangement de dossiers, de zoomer sur des photos etc..
L’attrait de Bumtop réside dans l’aspect ludique et high-tech des commandes de votre ordinateur. Il reproduit à merveilles les documents qu’on empile sur son bureau pour les avoir sous la main.

On peut se demander toutefois si ces interfaces sont réellement efficientes. Certes l’expérience semble très amusante, divertissante, visiblement on éprouve beaucoup de plaisir à manipuler les informations aux bouts des doigts mais, nous pouvons nous demander si les interfaces de type Bump top sont adaptées à manipuler un grand nombre de documents et si on pourra un jours travailler réellement avec.

Les précurseurs

DIGITAL DESK
Pierre WELLENER 1991

Représentation d’une interface avec des objets réels

Et pour finir l’amusante pub pour google chrome

Frisco

Malte Martin, double vie à la Galerie Anatome

Mercredi 30 septembre 2009

En dehors du Web !

Malte Martin

Malte Martin

La galerie Anatome, est l’un des principaux lieux dédiés au graphisme à PARIS

Vernissage de l’exposition
Malte Martin, double vie
ce jeudi 01 octobre 2009 à partir de 18h30 en la présence de Malte Martin.

38 rue Sedaine
75011 Paris
T +33 1 48 06 98 81
F +33 1 58 30 71 03

www.galerie-anatome.com
http://www.atelier-malte-martin.net

Flash, WebGL, Unity : prenez possession de l’interface avec HelloEnjoy !

Mardi 29 septembre 2009
helloenjoy

Comme un « echo » à hello World, HelloEnjoy est un site d’agence, qui nous fait une belle démonstration en 3D temps réel en Flash (c’est la mode du moment), c’est plutôt très bien réalisé, la typo est manipulable à souhait, le tout gérant l’inertie et la gravité. ENJOY !

http://www.helloenjoy.com/

Stéphane & Francis

Imagining Mozambique : un site novateur et intuitif

Mardi 29 septembre 2009
Imagining

LE SUJET :
Imagining Mozambique, un site dont le but est de venir en aide à la population du Mozambique et plus particulièrement aux enfants, qui depuis ces dernières décennies, ont été victimes de guerres civiles, désastres naturels… Cette cause, soutenue par l’ASEM (Association en faveur de l’Enfance Mozambicaine) a permis de réunir un collectif d’artistes pour une exposition dont le point de départ fut la Maxalot Gallery à Amsterdam.

LE SITE :
Le site est composé de plusieurs parties : les exhibitions, la partie dite « imagine » et les vœux.
En arrivant sur le site, l’utilisateur visionne une courte séquence vidéo qui permet de poser le décor, puis il tombe directement dans la partie « imagine », l’effet voulut, imprègne dès le départ l’utilisateur dans l’univers. Cette partie, en forme circulaire permet de mettre en avant les différents thèmes abordé (on y retrouvera entre autre la malaria, la famine, le sida…). Pour chacun de ces thèmes, on trouvera un texte, assez court, décrivant en détail l’état des lieux.

La partie exhibition regroupe les œuvres de l’exposition, réalisées par les artistes.

Enfin la partie des vœux est omniprésente sur une bonne partie du site, elle permet a chacun de créer des vœux, ou encore de visionner ceux des autres utilisateurs du site.

Le but du site : imprégner l’internaute de l’ambiance, de l’univers du pays, mais surtout des maux qui frappent sa jeune population.

L’INTERFACE :
Concernant la première partie, « imagine », l’interface circulaire est novatrice et intuitive. On navigue en faisant dérouler les univers, qui se suivent et s’enchaîne en douceur. Les thèmes abordés sont très bien mis en avant, beaucoup de détails font que l’on s’imprègne aisément dans la vie locale. Pour chacun des thèmes, un texte détaillant le sujet est disponible.
Le sound design participe énormément à cette implication, une musique de fond est accompagné par des effets sonores (propre à chacun des univers). Les couleurs et les formes permettent eux aussi de s’imprégner de l’ambiance de chacun des thèmes.
On remarquera un menu alternatif (beaucoup plus simple d’utilisation que l’interface circulaire) situé en bas de l’écran pour les néophytes.

Des lucioles Dispatchées sur la partie « imagine » se trouvent des symbolisent des vœux, l’utilisateur peut, à tout moment les consulter en cliquant dessus. Un bouton en haut à droite de l’écran (pas très visible d’ailleurs) permet de participer et d’exaucer un vœu (personnalisable à souhait). Cette partie met elle aussi l’accent sur le coté immersif du site, dès lors que l’utilisateur exauce un vœu, il s’implique complètement dans l’univers peut en toute simplicité défendre lui aussi cette cause…

La partie exhibiton se veut sobre, le seul but, exposer les œuvres du collectif.

LES ENJEUX :
Les enjeux du site sont simples, sensibiliser les utilisateurs à la vie au Mozambique. De ce fait, l’utilisateur, s’il se sent suffisamment impliquer pourra faire une donation. On regrettera tout de même un bouton « donate » pas très visible…
Même si tout le monde ne fera pas forcément de donation, en parcourant ce site, on se sentira forcément sensibilisé au problème. Presque aussi impactant qu’un reportage vidéo, ce site utilise la corde sensible.

LES POINTS NEGATIFS :
Malgré un bon concept de navigation et une réalisation graphique de très bonne qualité, on note quelques détails négatifs. Une navigation à la molette aurait pu être utilisée pour la partie « imagine ».

La navigation de la partie « imagine », auparavant uniquement en déroulant les univers a elle été (à juste titre) légèrement modifié pour intégrer un menu alternatif. Ce dernier permet dorénavant à tout le monde de pouvoir naviguer sans avoir à chercher comment switcher d’univers.

Il aurait été appréciable de pouvoir utiliser les boutons précédent/suivant du navigateur de façon à pouvoir simplement revenir sur ses pas. Un problème récurant pour les interfaces en full flash et qui pourtant peut être très simplement mis en place.

http://www.imaginingmozambique.com/

Michael

Silenzio : modes de visualisation et expérience utilisateur

Mardi 29 septembre 2009
silenzio

silenzio

waterlife

waterlife

Prenez à la fois « Silenzio » agence de communication spécialisée dans le cinéma et « Waterlife » site de l’association canadienne pour la sauvegarde des grands lacs, mixé à la sauce Papervision/3D et vous obtenez deux sites magnifiques.
Tous deux ont réussi à présenter de façon ludique un nombre assez important d’informations/contenus riches via des systèmes de visualisation à la fois original et dynamique.

L’un « Silenzio » vous présente un catalogue d’affiche de cinéma qu’il est possible de filtrer suivant plusieurs représentations, dont une basée sur le système Cooliris, pour ceux qui connaissent.
« Waterlife » quand à lui vous présente un grand nombre de contenus riches via des représentations de symboles, liés à l’environnement, eux-mêmes construits sur une multitude de vignettes.

Ces deux types d’ergonomies sont, je pense, très pertinente pour ce type de site devant présentés un nombre assez important de contenus. Mais la navigation ainsi que l’expérience utilisateur ne doit pas en pâtir, petit bémol de ce coté pour Waterlife. Les petites vignettes ne sont pas cliquables, alors que nous voudrions voir ce qui se cache derrière et le système vous emmène, contre gré et sans prévenir, vers le niveau inférieur. Très déroutant et décevant vu tout le travail réalisé autour.

L’usage des nouvelles technologies allié à des modes de visualisation doit bien sur continuer à évoluer et enrichir le web, mais l’expérience utilisateur ne doit pas surtout pas en pâtir sous peine de voire l’internaute garder une mauvaise image de votre marque.

Silenzio
http://www.silenzio.fr/

Waterlife
http://waterlife.nfb.ca/

Cooliris
http://www.cooliris.com/tab/#c=283&f=Channels

Stéphane

  • Les sorties

    • aperçu pour Sogeti

      > Sogeti

      La SOciété pour la GEstion de l’entreprise et Traitement de l’Information s’offre un nouveau « look-and-feel » avec n²

    • aperçu pour SODEXO

      > SODEXO

      La Planète Sodexo présente son nouveau site Web.

    • aperçu pour Claro-Afflelou

      > Claro-Afflelou

      Le dernier-né d’Afflelou simplifie vos démarches opticien, n² les digitalise.

    • aperçu pour Kiabi Emploi

      > Kiabi Emploi

      Postuler en ligne sur le site de Kiabi ? C’est désormais possible grâce à n².

    • aperçu pour Ryder Cup 2018

      > Ryder Cup 2018

      Pari gagné : la France accueillera la Ryder Cup 2018, quelque six mois après la mise en ligne du site de soutien n²

    • aperçu pour 48h Brico !

      > 48h Brico !

      Weldom, bricoleur averti, partage ses bons plans sur 48h Brico.

  • Les lectures du moment

    • Dont’ make me think, a common sense approach to web usability
      de Steve Krug
      éd.New Riders, 201 p.

       

    • L’essentiel d’ActionScript 3,
      de Colin Moock, éd. O’Reilly, 959 p.

    • Designing Interactions,
      de Bill Moggridge, éd. The MIT Press,
      766 p.

  • On aime / on n'aime pas

    • > Carls no

      Coup de coeur sur le site du restaurant norvégien Carls no !

    • > Lab Simurai

      Lab Simurai expose ses projets et expérimentations en matière d’animation CSS 3 !

    • > Soul Reaper

      Une BD animée en HTML 5 !