Browsing Category

Interfaces

Design, Interfaces

True Detective – Séquence titre


Générique de True Detective
Superbes design et animation par Antibody pour la série True Détective. Parfait accord entre une musique qui sent bon une Louisiane moite et dark, une nonchalance profonde qui se prolonge en image avec un enchainement sans faille de visuels surex et entremêlés à la perfection. Très fan.

Design, Interfaces, Lifestyle, web

Art of the Title Sequence

J’ai toujours aimé les séquences d’ouverture de films. C’est le moment privilégié où l’on entre dans un film, dans son ambiance. Quelques minutes qui posent les bases de l’intrigue, de l’atmosphère ou du débat de fond. C’est une séquence beaucoup plus libre que le film, espace qui peut laisser place à une créativité débridée, dans un format proche du clip parfois ou dans une sobriété esthétique toute dévolue aux impressions. C’est un Art en soi et une très belle source d’inspiration. J’ai découvert il y a peu The Art of the Title, un site à la gloire des « Title designers« , site qui nous expose ses choix subjectifs et une analyse des séquences d’ouvertures, celles de films mais aussi de génériques TV. Le site est par là : Art of the Title. Ci-dessous, pour le fun, 10 liens vers 10 séquences d’ouverture que l’on connait tous mais qui donnent envie de revoir les films.

1 – Bullit
Pour la music de Lalo Schiffrin et ses lents travellings très 70s avec jeux de typos.
Lien vers la séquence d’ouverture de Bullit
The Art of title sequence

2 – Dirty Harry
Le premier volet de la série avec aussi la musique de Lalo Schiffrin. Pour l’ambiance de l’intro, les prises de vues et pour Eastwood en Harry Callahan.
Lien vers la séquence d’ouverture de Dirty Harry
The Art of title sequence

3- Lord of War
Pour la problématique résumée dans un « plan séquence » hors norme.
Lien vers la séquence d’ouverture de Lord of War
The Art of title sequence

4 – The Shining
Musique et images théatrales qui font entrer dès les premières secondes dans l’ambiance oppressante du film. Brillant.
Lien vers la séquence d’ouverture de Shining
The Art of title sequence

5 – Catch me if you can
Pour les illustrations graphiques et l’animation. Pour les fans d’Helvetica et de vintage.
Lien vers la séquence d’ouverture de Cath me if you can
The Art of title sequence

6 – Se7en
Le seul souvenir que j’ai du film vu au cinéma, c’est cette intro… dérangeante. Bien vue.
Lien vers la séquence d’ouverture de Se7en
The Art of title sequence

7 – Panic Room
Belle utilisation de 3D intégrée dans un décors urbain aux teintes superbes, ambiance globale aux inspirations « Hitchcockiennes ».
Lien vers la séquence d’ouverture de Panic Room
The Art of title sequence

8 – Vertigo
Sobre, simple, inquiétant, le style de Saul Bass.
Lien vers la séquence d’ouverture de Vertigo
The Art of title sequence

9 – Delicatessen
La plus frenchy avec l’univers unique de Caro et Jeunet du début.
Lien vers la séquence d’ouverture de Delicatessen
The Art of title sequence

10 – Fight Club
Pour le parcours synaptique sous cocaine. Dans le ton.
Lien vers la séquence d’ouverture de Fight Club
The Art of title sequence
The Art of title sequence

apple, Interfaces, Mac, Réseaux sociaux, Services, Softs, User experience

Courier pour Mac, poster un fichier d’un clic vers un ou plusieurs services

Courier pour Mac, poster des fichiers d'un clic vers plusieurs services
Je viens de découvrir et d’acheter ce petit Soft pour Mac qui est d’une simplicité d’utilisation remarquable. Il est édité par Real Mac Software à qui l’on doit notamment Rapid Weaver qui permet de faire des sites rapidement et simplement. Leur positionnement, c’est la simplicité et des interfaces hyper soignées et très ergonomiques. Courier est conçu sur ce principe, son objet est d’uploader des fichiers d’un simple drag & drop vers des services divers (Vimeo, Youtube, Flickr, Facebook,…, ou encore un serveur FTP dans le répertoire de son choix). Pas nouveau me direz vous, on peut facilement créer des droplets pour le faire mais Courier se distingue par sa polyvalence et la possibilité de Drag & Drop et d’un transfert d’un même shoot vers plusieurs services.
Courier pour Mac, poster des fichiers d'un clic vers plusieurs services
L’idée est donc de poster des courriers, on drop des fichiers dans des enveloppes que l’on aura préalablement configurées (certaines avec plusieurs services) et on valide l’envoi, après une étape de validation (tag par exemple, nommage…) une petite animation sympa vous permet de visualiser le transfert géographique de vos/votre fichier et voilà. typiquement le genre de service qui me fait gagner du temps.
Courier pour Mac, poster des fichiers d'un clic vers plusieurs services
Ci-dessus l’exemple d’un transfert d’un fichier vers Flickr, on peut tagger, décrire et nommer ses photos. Chaque service destinataire bénéficie ainsi de son éventuelle boite de dialogue intermédiaire pour que tout se déroule bien une fois le fichier transféré sans avoir besoin de classer le fichier ou le renommer, etc…
Courier pour Mac, poster des fichiers d'un clic vers plusieurs services
Ci-dessus, la visualisation du transfert géographique de votre fichier, ça ne sert absolument à rien, seulement élégant et n’enlève rien à la rapidité qui est bel et bien au rendez-vous, très rapide. Beaucoup plus que de sortir un Cyberduck qui est Cyberlent dans son genre.

L’autre bonne idée, c’est l’ouverture aux plugins, chacun pourra looker ses enveloppes, développer son plugin pour gérer son service préféré de destination au sein de l’appli. Possible de les faire bientôt, le SDK sera bientôt déjà téléchageables et 2 plugins dispos pour le moment. Super appli, à tester, 5 transferts possibles dans la version gratuite.

(Update). Ajoute aussi des menus contextuels sur clic droit, menus qui permettent d’envoyer le, les fichiers sélectionnés dans l’enveloppe de son choix, top. (/update)

Interfaces, localisation, Réseaux sociaux, web

Sentiers débattus vous envoie promener

Sentiers débattus, randonnées, balades

Pour commencer, j’aime ce nom, j’aime cette baseline qui vous envoie promener, extrêmement bien trouvés et en plein accord avec un logo on ne peut plus rempli de sens. Sentier débattus est à l’image de ces bases : réfléchi, précis et complet pour qui a envie de partir en balade sur ou en dehors de sentiers et d’en débattre. Sentiers débattus, c’est le projet des amis Christophe et Olivier que je connais fort bien pour avoir travaillé (et beaucoup ri) avec eux.

Ce tout nouveau site est une communauté focalisée sur la randonnée et la balade en général, plaisir ou sportive, sans à priori de niveau sportif. Le service couvre un large spectre des préoccupations des marcheurs, de l’itinéraire en lui même, à l’organisation de cette balade seul ou à plusieurs (du groupe d’amis au club) en passant par la gestion des équipements dont on dispose… (Mais pas que)

Sentiers débattus, randonnées, balades

La page parcours est particulièrement intuitive et soignée d’un point de vue esthétique, on a tout sous la main avec une boite à outils qui permet notamment d’exporter les données GPS du parcours par exemple ou de l’imprimer au format PDF (Mais pas que). Simple efficace et focalisée sur l’action. A voir également la page Parc national, par exemple ici le Vercors, où l’on a une vue globale des différents parcours référencés. Mais je vous laisse découvrir par vous même, c’est par là.

La réalisation graphique et technique est très soignée et pointue, on sent qu’il y a eu de la réflexion en amont et l’ensemble a été exécuté par nos amis de NewQuest qui sont décidément des tueurs. Yann fait d’ailleurs un topo du projet sur le blog de NewQuest par ici.

Sentiers débattus, randonnées, balades

Longue route à Sentiers débattus ! Le site est à découvrir par ici.

Sentiers débattus, randonnées, balades

E-commerce, Interfaces, Wordpress

Un joli e-commerce à 39 USD

J’ai vu un thème WordPress Ecommerce intéressant il n’y a pas longtemps : eStore. Un thème qui se base sur 2 plugins existants et donc un WordPress qui sert de base à l’ensemble (les fiches produits sont des posts) :

  • Le thème eStore qui coute 39 USD, il est par là. Il est assez bien fichu, l’ensemble est vraiment soigné et possible de s’approprier le CSS et d’en faire sa chose. La démo de ce thème par ici.
  • Le plugin eShop, un Shopping Cart complet qui utilise les dernières évolutions de WordPress pour les exploiter dans un catalogue. Pas vu le back office encore mais au vue de la liste des features, c’est une bonne base pour un nombre d’articles limités (Gestion stocks, Produits avec multicritères, produit immatériel autorisé, templates e-mail…). Voir la liste des fonctions par ici. Ce n’est donc pas adapté à du gros e-commerce mais sur du e-commerce d’appoint, c’est parfait.
  • Le Plugin WordPress Simple Paypal Shopping Cart : le plugin qui va permettre l’ajout au panier et le réglement par Paypal.

theme e-commerce wordpress : e-store

Ce n’est pas adapté à un business qui veut se développer, Prestashop ou Magento sont bien plus adaptés et puissants, mais pour qui veut lancer son e-commerce d’appoint ou tester une idée, 39 USD… Pas un gros risque :)

Design, E-commerce, Imazine, Interfaces, Timefy

Good time

Quelques news de Timefy qui est dans le dernière ligne droite, le gros œuvre est fini et on est maintenant en train de finaliser le site, rédiger les pages de contenu, ajouter des infos, régler les fonctionnalités, gros rush encore, beaucoup à faire mais ça va bientôt être OK. Le lancement est prévu semaine prochaine, que du bon.
Montres Timefy
Les jours qui viennent de filer depuis le dernier post ont filé très vite, reçu le Kbis, obtenu le contrat VAD dans un temps record, toutes les montres ont été réceptionnées, l’éditorial rédigé, des milliers de photos shootées (pour en garder peu), et mises en ligne, des 100aines de tasses de café avalées, de clopes fumées, de playlists écoutées sur Spotify, la belle vie équilibrée quoi. La première sélection est en place sur le site. Beaucoup d’échanges avec mes amis de Newquest sur les finitions du site. De passage à Barbusland Vendredi, on a pu faire un gros point et échanger sur la dernière ligne droite, on est calé. Ils ont fait vraiment un super boulot et ce travail d’artisans que nous sommes pour préparer les murs et le mobilier de la boutique est un énorme plaisir, c’est bon de voir une idée prendre forme.
Prestashop et WordPress
Newquest a réalisé un super job sur les base d’un Prestashop, la solution qui a été retenue pour sa simplicité, sa souplesse et sa puissance. La boutique est couplée à un WordPress qui va nous servir à porter le blog bien sûr mais amener aussi des compléments intéressants sur la fiche produit.

Cette semaine, implantation du stock avec une journée et demi de réglages logistiques, mise en place des procédures, de l’administratif à faire, de la compta, des tests, d’autres tests et retests et reréglages tout en finissant la déco et les contenus.

Design, E-commerce, Interfaces, User experience

UI Pattern web survey

Toujours intéressant de benchmarker une quantité importante de sites pour connaître la localisation la plus courante de telle ou telle fonction. Où est l’aide, comment est la nav, y-a-t’il des onglets, où est le logo, où l’accès au compte, etc… Sur ce terrain, une initiative très intéressante de UI Patterns qui nous propose un service qui permet de tester collectivement des sites, 105 sites pour le moment, et de mutualiser le résultat qui est très intéressant. Pour le moment le questionnaire porte sur 16 questions, ce qui est encore peu mais cela va se développer à l’usage puisque le site est participatif.
UI Pattern web survey
Le résultat ressort soit sous forme de grille de « chaleur » dans le cadre d’une localisation de fonction, comme ci-dessous,  plus le carré est foncé, plus on retrouve l’élément à cet endroit. Le résultat peut aussi être représenté sous forme de pourcentages pour les questions non visuelles. Pour voir la liste des questions et les résultats, c’est ici.

UI Pattern web survey

Le questionnaire est ludique (cf ci-dessous), une box interactive pour les questions et le site testé est placé en dessous. Les questions sont soit des questions de localisation d’éléments (que l’on positionne d’un clic de souris) ou des questions relatives à la qualification du look ou des fonctionnalités de ces sites (est-ce que le fond est clair ou foncé ?).

UI Pattern web survey

Merci à Benoit pour l’info

Blog, Design, Interfaces, Wordpress

Divine, créer un template wordpress depuis Photoshop

Une top info communiquée par Yann, un plugin au top pour Photoshop CS4 : Divine. Un plugin puissant qui vous permet de créer un template WordPress depuis un fichier Photoshop, oui Madame vous avez bien entendu. Pas testé l’outil encore, vu qu’il ne tourne que sous Windows et pas sous Mac, mais le concept est au top. J’ai l’impression que l’exécution est à la hauteur, à vérifier par les graphistes alertes que vous êtes.

Divine, créer un template wordpress depuis Photoshop

Le plugin est activé depuis Photoshop et vous permet de définir des zones, des tranches en quelque sorte à la image ready. Vous affectez ces tranches à un élément de WordPress (Title, Comment, User, etc…), il faut donc être assez précis dans le template de départ, ça va de soi.

Divine, créer un template wordpress depuis Photoshop

Divine, créer un template wordpress depuis Photoshop

Une fois ces zones définies, on procède à la création du template, Divine travaille pour vous et peut même le publier à votre place. J’ai regardé, mais pas trouvé, l’intégralité des fichiers a l’air d’être généré depuis le PSD principal. Il doit donc falloir faire quelques retouches pour les pages internes (post, page, résultat recherche).

Divine, créer un template wordpress depuis Photoshop

Divine est gratuit mais il y a des limitations : toutes les images sont exportées en GIF et les dimensions du template doivent se situer entre 750×1000 et 1000×2000. La version payante permettra de faire sauter ces verrous.

Divine, créer un template wordpress depuis Photoshop

Via Newquest.

Blog, Design, Ergonomie, Interfaces, Réseaux sociaux, Services, User experience, web

Cargo, un CMS social pour les créatifs

Cargo Collective
Cargo Collective est un projet découvert cette semaine via Astro. J’ai pu obtenir un accès à la beta et je vous fais un petit topo du service que je viens de tester. En quelques mots, Cargo est un CMS puissant et élégant destiné aux créatifs pour construire et partager leur portfolio d’une part et également un outil qui permet de suivre l’activité de portfolios que l’on a décidé de suivre. C’est un mix entre un CMS pur et un service comme Tumblr qui fonctionne de la même manière. Pas mal de points communs mais plus puissant en terme de customisation et de navigation. Des utilisateurs, il y en a déjà, dont le très intéressant Does it Float par exemple.

Ci dessous, l’accueil du portail Cargo Collective où vous pouvez suivre l’actu des portfolios que vous suivez, décrouvrir de nouveaux CargoSites.

Cargo Collective

Voici ci-dessous, La partie settings de votre Dashboard une fois votre compte créé. (J’ai fait 3 captures du frame droit du dashboard que j’ai disposées en colonnes). Vous pouvez définir la page que vous souhaitez en page d’accueil, ajouter une favicon, définir une image pour le header, etc. Vous pouvez sélectionner des gabarits prédéfinis dont vous pouvez retoucher le CSS à volonté et vous avez enfin la possibilité d’ajouter des morceaux de html spécifiques (Scripts, Tags analytics, etc.)

Cargo Collective

Ci-dessous, la partie création de page. Cette partie est accessible depuis votre accueil Dashboard ou la liste des pages existantes est présente, un clic et vous arrivez sur cette fonction de création de page/post. Vous définissez, pour une page, son contenu et sa mise en page avec des fonctionnalités insérables telles que slide show entre autre. Vous pouvez ensuite associer un thumbnail à votre projet (pour les mises en avant), un titre, une date, des tags et une couleur de fond. Et voila.

Cargo Collective

Beaucoup de choses sont donc possibles sous Cargo qui donne la main potentiellement sur la mise en page et les fonctionnalités sans pour autant rendre l’outil compliqué. Il est complètement accessible à quelqu’un qui n’y connait que chi en code. Complètement dans la lignée d’un Tumblr, à surveiller. C’est utilisable comme portfolio mais également comme alternative aux blogs pour les passionnés de photos ou d’illustration, de création en général, la finalité est le partage et la diffusion, donc, le champ est libre.

Ci-dessous, un exemple de portfolio, celui de Nuinosis à voir ici.
D’autres à découvrir comme But Does it Float, Sara the Cupcake, ou encore les sélections de portfolio faites par cargo, ici

Cargo Collective

art, Design, Ergonomie, Interfaces, Services, User experience

Tout pour les yeux

tply
Un petit Zoom sur Tout pour les yeux aka tply. Un site qui m’a plu pour trois raisons :

  • Présente le meilleur des expos de la scène montante de l’illustration, du street art, de la photographie et des arts numériques, et ça, c’est bien.
  • Le site est dans une structure proportionnelle en colonne, un format ajustable en fonction de la dimension de la fenêtre de votre navigateur. Autant de colonnes que le permet la largeur de la fenêtre. La mise en forme est voisine de  sites comme D&Department, un site japonais que j’aime beaucoup ou encore EnjoyThin.gs, site des gens qui aiment les choses.
    Cette structure minimaliste est très agréable à parcourir, très proche de la une d’un quotidien. Ca me rappelle aussi la version expérimentale du NYTimes, l’article skimmer qui est très proche mais va plus loin puisque configurable à volonté.
  • J’aime bien le logo & sa typo (merci à Joaquim pour cette version)

tply
Ci-dessous, une capture de D&Department, le top de la mise en page différente, sexy et néanmoins intuitive.
tply

Accessoires, Design, Gadgets, Interfaces, Iphone, User experience

Iphone Stencil Kit

Vous qui avez en tête la création d’une interface pour l’iphone, voici un Iphone Stencil Kit car rien de vaut le papier et le crayon pour laisser crayonner ses idées, les gommer et recommencer. Excellente idée, justement. L’iconographie générique joue un un rôle clef dans ces interfaces qui se doivent d’être intuitives, les automatismes visuels créent le confort d’utilisation. J’en ai commandé un, ça me plait bien, ne serait-ce que pour l’objet lui même. 16,95 USD, par là

iphone-stencil-kit

iphone-stencil-kit

Via TUAW

Blog, Design, E-commerce, Interfaces, Multicanal, Services, User experience, Video

Archiduchesse, king of the chaussette, on air

Archiduchesse - chaussettes colorées made in France

Patrice vient de lancer Archiduchesse, yay ! Je m’y suis collé trop tard, moi qui voulait du orange et du vert pomme.. Pfff, 5 heures après le lancement, déjà dévalisé sur ces 2 tons, success. Pas grave, plein de couleurs de chaussettes façon Panton, 30 au total pour le lancement dans un coton égyptien quali teinté-tissé en France. Bon démarrage à toi Patrice ! Et félicitations pour le site, j’aime beaucoup la home, claire, explicite et immédiate. Efficace, simple et funky, c’est bon.

Archiduchesse - chaussettes colorées made in France
Archiduchesse - chaussettes colorées made in France
Archiduchesse - chaussettes colorées made in France
Archiduchesse - chaussettes colorées made in France

Buzz, E-commerce, Ergonomie, Interfaces, User experience

Uniqklo intro

Uniqlo interface

introduction : une très belle interface événementielle pour Uniqlo, site Tokyoïte qui n’en est pas à son coup d’essai (cf post du capitaine sur le sujet). Les valeurs clefs de la marque défilent en scrolling vertical, les produits apparaissent en tournoyant, un par un dans un enchainement rythmé et en musique. Belle démonstration. Le tout est interactif, on peu cliquer chaque produit et aller l’acheter sur le shop. Ca c’est du web.

Uniqlo interface

Ci-dessous une capture du site Uniqlo, le vrai. Belle dispo produit en enchainement vertical, à la japonaise. Donne le sentiment d’une offre très riche sur ses 5 colonnes à la une, on va au produit directement, intéressant. La segmentation, elle, se révèle une fois dans le site. J’aime l’idée de se lâcher en page d’accueil et de rester minimaliste au niveau de la navigation, seulement l’essentiel.

Uniqlo interface

Ergonomie, Interfaces

RIA patterns

rich internet applications patterns
Les interfaces utilisateurs évoluent sans cesse, le web prend le look des applications dans le cas des RIA et les applications prennent un orientation web, les deux se retrouvant à mi chemin dans ce phénomène de convergence.

Designing web interfaces nous propose un post très intéressant, une synthèse illustrée des typologies de pages, de fonctions : recherche, browse, dashboard, … Le post est illustré d’une 100aine d’exemples d’écrans pour transposer ces templates sur des sites existants. Les grandes lignes des principes de zoning en synthèse pour se remettre les idées au clair, top. C’est par la. Ils nous proposent également le post dans une version PDF.
rich internet applications patterns

Via BenjaminF

Interfaces, Réseaux sociaux, Softs, User experience

Fotonauts – Les voyages de M. Hullot

fotonauts

Ca fait un petit moment que j’ai envie de poster sur Fotonauts que j’ai la chance de tester depuis quelques semaines. Un service remarquable et prometteur de partage de photos mais pas que, puisque Fotonauts permet d’enrichir ses photos d’articles Wikipedia, de textes, de les localiser sur un Google map et surtout d’interagir avec les collections de chacun pour concevoir de nouveaux ensembles, d’enrichir le tout. Un genre de fotopedia en quelque sorte comme le défini Jean-Marie Hullot, son créateur (une épée).

Fotonauts = deux composantes et un support commun, le web.
Une application (pour le moment sous Mac). Sous Mac et Windows.
Un site web : fotonauts.com

L’appli

L’appli, Fotonauts, vous permet de naviguer dans les albums de la communauté et de créer vos propres albums. Chose remarquable, vous pouvez créer des albums avec vos photos mais également avec ceux d’autres albums (ou en provenance de flickr) et interagir et compléter les albums des autres.
Le point central est bien évidemment la photo, une photo organisée en albums, pages et sous pages, agrémentée de vos textes, de textes mashupés Wikipedia, de liens, et une photo enfin localisée sur un google map, le tout indexé et navigable par arbo, moteur, etc.

Ci-dessous, la « home » de l’appli :

fotonauts

Créer un album :
D’une grande simplicité et très ergo, l’interface vous propose une « photoline » source dans la partie supérieure, vous placez les photos une à une ou par groupe dans l’album, une page ou une sous page que vous aurez préalablement créé et ça y est, c’est en ligne. cool. Les photos peuvent venir de votre Iphoto, de votre compte Flickr, Picasa, etc… et ça, c’est top.
L’album ou la page sont ainsi éditables, vous pouvez y ajouter textes, cartes, liens, etc… Un manque cependant pour le moment, c’est l’impossibilité de tager la photo en elle même, modifier son titre, l’unité mini est pour le moment la page. Mais cela va sans doute évoluer.
A noter qu’un album peut être privé, visible « en lecture seule » ou encore modifiable par tous, un wiki de la photo.

fotonauts

Des points marquants pour l’appli, en vrac et dans le désordre :
Très rapide (les photos sont transférées en temps masqué), c’est indolore.
Superbe interface, top ergo, intuitive, sobre, efficace. Jean-Marie Hullot, proche de Steve Jobs, a participé à faire de Apple ce qu’il est aujourd’hui, on retrouve complètement l’univers.
Le mode Wiki pour les albums, chacun peut participer, faire évoluer, composer.
Les commentaires sur les photos et leur suivi dans un espace unique (frame droit). Très bien foutu.
Connexions aux services Flickr, Picasa pour récupérer ses photos. Et également pour les stocker.
Possibilité de twitter ses nouveaux albums (Dans le dernier update de la beta testé ce soir)
– Possibilité de suivre les gens / albums qui vous intéressent.
– La gestion des licenses Creative Commons.

Des bémols :
(mais c’est certainement en train d’évoluer de leur côté, je viens de voir déjà pas mal de changements sur l’update chargé ce soir)
Pas de détail sur les photos, titres, tags, etc… Si, c’est en place dans la nouvelle release mais pas encore éditable (Merci Adrian pour l’info)
– Recherche un peu hasardeuse (manque de pertinence)
– La nav dans les albums existants manque de fonctionnalités sur l’appli.
– Le fait de ne pas pouvoir visualiser toutes les photos d’un répertoire et de ses sous répertoires lorsque l’on clique sur le répertoire en question. Pour voir les photos, il faut aller dans les sous répertoires, le répertoire père ne sert à rien si ce n’est à porter un visuel d’illustration. Dommage et pas super intuitif pour le coup.

Pour tester l’appli, inscrivez vous à la Beta, c’est par là.
(Faut un Mac pour ceux qui ne suivraient pas). Et ben, c’est moi qui ne suivait pas, la nouvelle release tourne sous Windows également.

Le Web

Du côté du site Web Fotonauts.com, qui vient d’ailleurs d’évoluer considérablement il y a 3 jours, vous pouvez surfer dans la communauté et explorer les albums, les fotonautes, interagir avec les albums.
Le mieux, c’est d’aller voir, par la pour un album avec pages et sous pages.

fotonauts

Autre point fort, les Widgets, leur création est simplissime, cf par ici
Gestion de la dimension très bien sentie.

Monsieur Hullot

J’ai eu la chance de croiser Jean-Marie Hullot, le fondateur de Fotonauts, pendant le Web’08. Passionné de voyages comme moi, du Népal et du Bouthan notamment, nous avons parlé Kathmandu et Pashupanath, Saddhu, mais pas vraiment web ni interfaces :)
Le parcours de Jean-Marie Hullot est impressionnant, respect. Il est du reste d’une simplicité désarmante.

En tout cas, Fotonauts, à tester et adopter absolument, une autre façon d’aborder la photo en ligne, tès collaboratif et promis à un très bel avenir.

E-commerce, Interfaces, Search, User experience

Flasher sur des Converse

Converse flash catalogue

Communiquer, faire découvrir, tenter, Converse sait très bien le faire online et notamment avec son site allemand, Converse.de, qui est un petit bijou en flash. Pas un site de vente mais un site pour flanner, découvrir et comprendre la profondeur du catalogue.

Converse flash catalogue

Allez faire un tour dans la partie catalogue et vous allez retrouver cette grande étoile qui est le catalogue. Tout est alors affaire de zoom pour découvrir les produits. Possible également de passer dans un mode horizontal avec un menu paramétrique qui vous permet d’affiner votre recherche. On retrouve une navigation à la Reisenthel, un must dans le domaine.

Converse flash catalogue

Un avatar sympa vous explique la nav et est débrayable à tout moment s’il vous saoule ou si vous avez compris de suite le principe. L’avatar joue le rôle du vendeur et est parfaitement intégré dans la page, utile, ludique et bien communiquant, bon pour la marque.

Converse flash catalogue

A découvrir également le site US de Converse qui est, lui, marchand. Sans doute moins communiquant mais très bien pensé pour ce qui est d’arriver au produit en cliquant le moins possible. Très graphique, en full flash avec une orientation nette sur la simplicité de navigation. Une molette de contrôle vous emmène sur la section désirée et ensuite vous procédez par recadrage paramétrique pour aboutir à votre sélection idéale.
Converse acheter en ligne

C’est de l’efficace.
Sur une marque comme converse, un fabricant qui communique sur les produits et sa marque en même temps qu’il vend, le Flash prend tout son sens. On est dans l’impression, et cela prédomine sur l’expérience d’achat et des effets négatifs du flash (comme le référencement naturel par ex). C’est une prise de partie qui me plait bien ici. Un risque c’est clair mais, sur la partie marchande US, le site est bien mené et l’expérience d’achat est vraiment très agréable, il y a matière à craquer.

Converse design your own shoes

A tester également, le e-commerce sur mesure avec la possibilité de créer sa propre paire de Converse, toujours sur le site US.

E-commerce, Ergonomie, Interfaces, Shopbots, User experience

Potoroze, le portail du shopping 3D est maintenant accessible à tous

potoroze - shopping 3D
Potoroze vient de sortir de la beta fermée et est maintenant accessible à tous depuis ce jour.

Premier moteur de shopping en 3D, le site est un moteur shopping classique dans lequel certaines fiches produits proposent une visualisation 3D des produits. Les produits en 3D photoréaliste sont motorisés par la techno de VB2S, Subdo, une techno très aboutie. Le rendu est tout bonnement impressionnant, j’avais pu tester grâce à François puis au travers de la beta, et de découvrir ainsi différentes applications.

potoroze - shopping 3D

A voir notamment la fiche produit, le zoom plein écran et l’outil de comparaison des produits en face à face. J’attends avec impatience les essayages sur mannequin virtuel qui doit valoir des points lui aussi.

potoroze - shopping 3D

Ce qui est impressionnant avec Potoroze, ce sont les textures photos appliquées au modèle 3D, le rendu apporte vraiment une belle valeur ajoutée, tout bonnement bluffant.
A tester & à adopter !

Bravo à Sébastien Chevalier & à toute l’équipe.
Vous pouvez tester d’autres utilisations de Subdo par ici

Interfaces, Mac, Softs, User experience

MailPlane ou comment gérer plusieurs comptes GMail dans une seule appli

Un petit post de chauffe pour une remise en route de Imazine avec cette excellente application : MailPlane.

mailplane - mac - gmail

Une appli indispensable pour ceux qui gèrent leurs mails sous Gmail et ont plusieurs comptes (et vous êtes nombreux). Au sein d’une même appli autonome, qui n’utilise donc pas un navigateur internet, vous pouvez ajouter N comptes Gmail et passer de l’un à l’autre à la volée dans une même interface, d’un simple clic.

mailplane - mac - gmail

Vous pouvez répondre, imprimer, deleter, etoiler, forwarder, .., idem Gmail
Mais vous pouvez aussi, ajouter images, sons, videos à la volée.

Autre atout : le système est interconnecté à Growl, un avertisseur générique (qui fonctionne notamment avec Adium) qui vous notifie chaque fois que vous recevez un mail. Vous pouvez alors accéder aux nouveaux mails par l’appli elle même ou directement dans la barre de menu où stationne gentiment une boite à outil et action.

L’appli tourne légèrement en tache de fond, top pratique.
Un outil au top que j’ai acheté après 1 mois d’essai.
C’est sous Mac. Je ne sais pas s’il existe un équivalent Windows.

Blog, Buzz, Campagnes, Design, Interfaces

Unscrew america

Unscrew America
Une véritable réussite, voilà ce qu’est le site de Unscrew America, une association environnementale dont l’objet est de promouvoir des gestes simples pour la protection de notre environnement. Le geste simple ici, cest le changement des ampoules traditionnelles par des ampoules CFL(Compact Fluorescent Lamp) ou LED(Light Emitting Diod, beaucoup moins consommatrices et nocives pour l’environnement.

Unscrew America

Lesley Chilcott, l’homme à la tête du projet, précise que si chaque personne (Aux US j’imagine) change 5 ampoules, ça fera le même effet que 4 millions de voitures en moins sur les routes. Typiquement un geste simple et collectif qui demande peu d’investissements et aux effets immédiats, un bon point de départ pour la réflexion. Les ampoules sont première étape et l’équipe travaille déjà au projet de l’année prochaine, Lesley Chillcot compte bien proposer chaque année de dévisser quelque chose.

Unscrew America

Carte blanche créative donnée au Fluid, Boom & design Group pour le site qui est une véritable réussite. Un petit côté Yellow Submarine un peu trashy, un côté Monty Python avec un graphisme très personnel et des animations aux top. Des bonnes idées partout. Globalement, des choses simples et sympas pour un message simple et puissant.

Le site fait partie d’une campagne globale de GSD&M’s Idea City, menée en On, Print & TV. A voir également L’hymne autralien par un Kangourou, ça vaut des points aussi.

E-commerce, Ergonomie, Interfaces, made in design

DA senior en Freelance Wanted !

DA senior freelance
Nous recherchons un DA senior en Freelance pour un projet made in design.
Tueur né et expérimenté, notre DA freelance idéal est très créatif, est senior, a des réalisations reconnues online et a également une forte expérience en interface e-commerce. Nous voulons une interface soignée, efficace et très ergonomique. Du beau au service du visiteur et dans le sens de la valorisation du produit.

Si vous êtes intéressé par une collaboration éventuelle,
n’hésitez pas à nous envoyer l’adresse de votre book sur dadesign.mid@gmail.com
Merci d’avance !

Blog, E-commerce, Ergonomie, Interfaces, User experience

Une nouvelle version pour Koodza

koodza new version
koodza new version
Koodza, le site marchand pilote de Décathlon vient de sortir sa nouvelle version avec la nouvelle année. Une nouvelle version différenciante à l’ergonomie étudiée.

- Une segmentation principale à bouton unique avec un div qui s’ouvre (à la façon d’Amazon US ancienne version). Pas forcément le plus convainquant ici, le fenêtre a une telle dimension que l’on est un peu perdu à son ouverture. Mais bon, l’idée est forte et le header a, de fait, de la personnalité, c’est clair.
- Une segmentation secondaire avec utilisation originale d’un carousel à la Apple store. Très visuel. Je suis curieux de savoir si les visiteurs sont Ok avec ce type de navigation. C’est agréable et clair. Plus parlant que du simple texte mais j’ai juste une interrogation avec le scrolling horizontal qui peu dérouter mais c’est bien mené en tout cas. A suivre de près.
koodza new version
Menu gauche contextuel sur chaque segment avec fonctions de recadrage de l’offre (à la manière des résultats moteurs). On recadre avec des curseurs, par couleur quand justifié, par prix, par taille, par niveau, etc… Très adapté au monde du sport et le mieux fichu de la nouvelle version je trouve. Excellent, sous-entend un gros travail opéré en amont sur la segmentation.
Moteur de recherche (motorisé par Antidot) avec une page de résultat bien faite proposant un recadrage paramétrique clair et efficace coté gauche.

Koodza.fr
est mis en web par une équipe très sympa emmenée par l’ami Jérôme, voisin lyonnais que j’ai eu le plaisir de croiser plusieurs fois et qui fait vraiment du beau travail. Jérôme a d’ailleurs récemment lancé son blog, Ikom, qui nous propose des analyses métiers des plus intéressantes. A découvrir d’urgence si le e-commerce vous intéresse !

E-commerce, Ergonomie, Interfaces

Fauchon, un air de fêtes

fauchon
Pour le plaisir des yeux, allez jeter un oeil rose sur le nouveau site de Fauchon et surtout sur la partie e-commerce. Tout juste sorti de la boite, le site de Fauchon est une très belle histoire écrite en full flash par Megalo(s) qui décidément assure au niveau technique et créa. Des tueurs, on vous dit.

Eric de Superfiction en fait une analyse intéressante, allez jeter un oeil également.

Full Flash, design épuré dans la tendance, noir et rose, valorisation soignée des produits, des assortiments, animations softs et élégantes dans l’esprit de la marque, gestion du panier très bien faite. Le mouse over sur le panier est un petit bijou.

Url rewriting intensif sur pages produit et fiches sélection, le flash devient fréquentable par les moteurs.

On regrettera juste des temps d’attente un peu trop longs sur la navigation dans la segmentation mais l’anim 3D avec les pétales roses, ça aurait été dommage de s’en passer. Quoiqu’il arrive, on ne passe pas commande tous les jours sur le site de Fauchon, une expérience de ce type est, de fait, cohérente.

A noter l’option livreur en tenue à 30€ (pour Paris et limitrophes), original et un tarif réaliste.

Via Superfiction

E-commerce, Interfaces, Moteurs de recherche, User experience

Zero patience

zero patience - produits e-commerce

Le client n’est pas l’otage d’un site,
c’est le site qui est l’otage du client, il faut le savoir.

Si celui-ci ne trouve pas ce qu’il cherche dans les deux minutes, il s’en va sans appel et ne reviendra souvent plus. L’importance du moteur de recherche et d’une segmentation pertinente est capitale, on le sait mais ça devient de plus en plus crucial. On risque de manquer une vente et surtout de perdre définitivement le visiteur dont les exigences sont des plus en plus marquées. Zéro patience !

zero patience - produits e-commerce

Une étude intéressante de SLI System
fait ressortir des chiffres édifiants :

– 73% des visiteurs qui ne trouvent pas ce qu’ils veulent dans les deux minutes s’en vont.
– 36% affirment qu’ils ne reviendront pas sur le site.
– 56% disent qu’ils reviendront uniquement sur le site s’il y a des produits exclusifs.
– 96% affirment que le moteur est important dans le shopping sur un site.

La recherche est un élément primordial de la séduction, de la fidélisation et au sens large, c’est ce qui représente de manière intelligible, perceptible le service, sa personnalité, c’est de l’image.

Via WebProNews

E-commerce, Interfaces

Net à porter, juste pour les yeux

net à porter

Juste pour les yeux, Net à porter n’est pas une tuerie du référencement naturel (c’est même le contraire) mais un plaisir du surf à tout point de vue. Le surf est entièrement axé autour du produit et de sa valorisation : photos très soignées, design de pages épuré au max, ambiances en entrées de rubriques du type magazine, nouveautés, pêles mêles, styles,…

Allez vite faire un tour sur la fiche produit qui est redoutable : Photo principale disposée à droite, bon format, autres photos (avec chargement Ajax) à gauche avec le descriptif et le libellé et la marque (en image pour être dans le style du site). Le Add to Shopping Bag est très bien fait, changement de visuel pour changement d’état avec ajout de la taille si besoin. Classique mais très bien réalisé. Les actions contextuelles sont nombreuses (tell a friend, more Fendi…) et très claires.

Le minimalisme de Net à porter est une vraie réussite, les produits sont dans un écrin qui n’a pas oublié d’être pratique et ergonomique. Très efficace.
Merci Sandrine pour le lien.

net à porter

Interfaces, User experience

MegaBlok – une ergonomie ludique et efficace

mega blocks
Un petit zoom sur un site de saison, le site de Mega qui n’est autre que la marque mère de Megabloks, le concurrent direct de Lego. Le Canadien Mega a donc lancé un site international assez remarquable et un bel exemple d’interface riche au service de la démonstration produit.

mega blocks

Le site Mega comporte beaucoup de services et fonctions, mais je me focalise ici sur la partie catalogue produit (Shop) que je trouve vraiment bien faite. On y trouve une belle valeur ajoutée en tant que parent à la recherche d’information sur l’intérêt d’un jouet, qui ne l’oublions pas est la pour accompagner l’enfant dans son développement, ce n’est pas qu’un produit ultra marketté. Sur leur site, on a la demo produit, le coté fun et paillette et le côté valeur ajoutée, pas mal.

mega blocks

Vous avez les illustrations ci-dessus de ce que sont les résultats de recherches, une catégorie produit et ci-dessous de ce qu’est une fiche produit. Cette sur cette fiche produit que tout se passe, c’est un concentré d’infos et cela reste néanmoins facile d’accès et simple. Flash est ici à son avantage puisqu’il est utilisé au service de l’ergonomie et uniquement sur certaines zones clefs. Toutes les infos sont accessibles d’un coup d’oeil en mouseover sans scroll. Petite illustration ci-dessous de cette fiche produit et la meilleur démo reste encore leur site.

mega blocks

Mega n’est pas un site marchand, c’est un site d’aide au choix et un site de traffic on et off qui redirige vers des marchands online et offline contextuellement. J’ai eu la chance d’aller faire un tour à Montreal il y a 6 mois et j’ai visité le siège. J’ai rencontré à ce moment la, un des resp. Marketing qui m’avait parlé de développement web fort et des projets en cours, et bien félicitations, c’est top.

E-commerce, Interfaces, Personnalisation

E-commerce sur mesure avec Beboard

beboard cusomiser planche
beboard cusomiser planche
Un peu de e-commerce sur mesure avec Beboard qui vous propose de customiser votre planche à la spreadshirt. Vous réalisez le Sticker de votre choix avec des motifs prédéfinis, des typos que vous aimez ou encore vos créas persos. Vous associez le tout à votre planche favorite, vous configurez, choisissez taille, modèle et puis click, pay et Surf. Très bel exemple de personnalisation avec site flash on ne peut plus simple et ergo, un jeu d’enfant.