Facebook Home : une interface imaginée avec l'aide de Quartz Composer d'Xcode

Florian Innocente |


L'interface et les interactions de "Home", le nouveau launcher de Facebook pour Android ont été d'abord mis au point et testés avec Quartz Composer. Un outil d'Apple livré avec Xcode et commode pour réaliser des prototypes d'interface (à l'origine, et encore aujourd'hui, il pouvait servir à la création rapide d'économiseurs d'écrans sophistiqués pour OS X). Cet environnement de développement utilise une approche très visuelle, plutôt que d'obliger à tout de suite mettre les mains dans le code. Il sait tirer profit d'OpenGL, OpenCL et de frameworks d'OS X comme Core Image et Core Vidéo.



Pour l'anecdote, avant d'intégrer les outils de développement d'Apple, Quartz Composer avait été conçu par le français Pierre-Olivier Latour, il avait été baptisé PixelShox. Apple l'a repris à son compte avec l'embauche de son créateur en 2003. Quartz Composer a été utilisé pour créer les effets dans nombre des applications audio et vidéo de l'entreprise et dans ses OS. Latour, parti d'Apple en 2009, est aujourd'hui l'un des cofondateurs d'Everpix (lire Everpix : nouvelle formule d'essai gratuite).

Julie Zhuo, qui a piloté le design de Facebook Home, raconte que pour mettre au point un tel logiciel, le prototypage dans Photoshop n'est absolument pas adapté.

Comment pourrions-nous discuter d'une interface basée sur des effets physiques, des panneaux et des bulles qui peuvent être jetées en travers de l'écran si l'on s'assoit devant des images statiques ? (réponse : on ne peut pas). Ce n'est pas un secret que beaucoup d'entre nous dans l'équipe de conception Facebook sont de fervents utilisateurs de Quartz Composer, un outil de prototypage visuel qui vous permet de créer des démos de grande qualité qui ressemblent et se comportent exactement à ce que vous attendez du produit final


Elle ajoute que cet outil a « changé la manière » dont Facebook travaille sur ses designs d'interfaces. Quartz Composer est entré dans l'équipe avec l'arrivée d'un autre ancien d'Apple, Mike Matas, qui avait réalisé le livre interactif Our Choice pour iPhone/iPad d'Al Gore, rempli d'effets sophistiqués (lire aussi iBooks : un air de déjà vu pour les manuels scolaires). Précédemment, Matas a travaillé sur le thermostat Nest, sur l'interface de Photo Booth, celle de Time Machine et des éléments graphiques d'iOS (comme la grosse batterie verte en recharge que vous voyez tous les jours sur l'écran verrouillé).

Non seulement Quartz Composer rend le travail avec les ingénieurs beaucoup plus facile, mais il est aussi incroyablement efficace pour raconter l'histoire d'un design. Lorsque vous voyez une démonstration en live, peaufinée et interactive, vous pouvez comprendre immédiatement la manière dont elle est prévue pour fonctionner, bien mieux que ne pourraient le faire des mots, un long discours ou des schémas.

Et cela conduit à de meilleurs retours, de meilleures itérations et au final un meilleur produit. Lorsque vous travaillez sur quelque chose pour lequel les interactions comptent à ce point - dans le cas présent une richesse dans les gestes, une importante part de physique dans l'interface - tout autre chose plus légère ne conviendra pas.


Autre anecdote racontée par Julie Zhuo, les Chat Heads, ces bulles affichant vos amis et depuis lesquelles on peut démarrer une conversation partout dans l'interface de son téléphone, avaient été imaginées avant le projet Home. Des ingénieurs de Facebook trouvaient que chatter sur un mobile était foncièrement quelque chose de compliqué, ils ont alors pris le temps de chercher de nouvelles idées.



Ils n'étaient pas engagés à ce moment-là dans un développement stressant, avec les contraintes afférentes « Avoir des moments comme ceux-là, où les designers ont la liberté d'explorer et de rêver à des solutions sorties de nulle part est essentiel pour arriver à de bonnes idées » écrit Zhuo, qui ajoute « Si vous travaillez toujours sur un planning à la semaine, avec le rythme d'un camp d'entrainement, il est probable que vous obtiendrez quelques gains en terme d'optimisation, mais des concepts complètement nouveaux ne peuvent éclore dans de telles conditions. Il faut se donner du temps à la fois pour l'exécution et l'optimisation et s'accorder de la place pour des solutions créatives et ambitieuses. »

avatar oomu | 
Quartz Composer est un très bon outil, injustement oublié.
avatar Anonyme (non vérifié) | 
En tout cas est très réussi comme interface. Bravo Apple, bravo FB
avatar Anonyme (non vérifié) | 
modéré et banni
avatar Lecompas | 
Complètement d'accord avec la dernière citation (de l'article). Ca me fait presque regretter de ne pas aimer FB.
avatar Anonyme (non vérifié) | 
Y a aussi la création de spectacle ;) https://www.dropbox.com/s/dp7u70mgnogf2i0/La%20Messe%20Report%20V1.mov
avatar bigham | 
@oomu: Mouais… "injustement oublié"… Faudrait voir à pas oublier qu'il est aussi simple d'utilisation que Shake dès qu'on veut faire des trucs un peu poussés. On est loin à la fois d'un éditeur de code et d'un outil comme Motion.
avatar ziggyspider | 
Je n'utilise pas Xcode, mais je l'ai installé pour Quartz composer et AUlab, deux très bons outils pour expérimenter. Dommage que Apple ne les diffuse pas directement pour ne pas devoir tout installer.
avatar Shimomura | 
frotte-moi le bras dans le sens du poil ^_^ un réseau social extraordinaire, une interface extraodinaire, réalisée grâce aux produit extraordinaires d'une entreprise extraordinaire, c'est limite Disneyland ^_^ Facebook c'est de l'auto fellation ou cunilingus selon le genre, rien de plus. Qu'ils cherchent à séduire Apple en faisant le dos rond ne fait aucun doute, qu'ils arrivent à leurs fins est une autre histoire ^_^
avatar amnesic | 
Ils sont taquins chez FB de faire la promotion d'un outil qui devrait avoir le label "deprecated" prochainement :-(

CONNEXION UTILISATEUR