ZBrush 4R7 et Keyshot

ZBrush 4R7 Keyshot

ZBrush 4R7 a été annoncé cet été par Pixologic et ne devrait plus tarder à sortir. Parmi les nouveautés annoncées, une en particulier, a retenu notre attention : le pont entre ZBrush 4R7 et Keyshot, le logiciel de rendu qui rencontre un succès grandissant, notamment chez les utilisateurs de ZBrush.

Ce pont est donc une très bonne chose, comme en atteste la vidéo de teaser suivante :

Plutôt pas mal non ?

Se former à Keyshot

Vous souhaitez vous former sur Keyshot et prendre un peu d’avance avant l’arrivée de ZBrush R7 ? Ça tombe bien, nous avons des tuto Keyshot pour vous ! Ces derniers sont proposés par Bernard Caumes qui utilise déjà depuis quelques temps, ZBrush et Keyshot dans son flux de production professionnel.

Pour terminer, voici quelques images d’objets 3D créées dans ZBrush 4R7 avec un rendu Keyshot (les 2 dernières images sont signées Thomas Roussel, dont je vous recommande vivement la lecture de son blog).

ZBrush 4R7 Keyshot ZBrush 4R7 Keyshot ZBrush 4R7 Keyshot  ZBrush 4R7 Keyshot

L’outil Promo Globale est là

promo gobale tuto

Voici un outil que les contributeurs attendaient avec impatience, notamment ceux avec un gros catalogue de cours : vous avez désormais la possibilité de mettre en place une promo globale sur vos tuto.

Actuellement, cette tâche pouvait être assez chronophage, puisqu’il fallait saisir vos promotions, tuto par tuto.

promo globale tuto.com

Comment ça fonctionne ?

Voici ce que vous allez pouvoir définir pour vos promos globales :

  • Choisir quels cours seront concernés par cette promo globale : tous vos tuto, une famille en particulier ou un logiciel (dans une prochaine version nous proposerons de rentrer un peu plus dans le détail, avec un système de liste et de cases à cocher).
  • La réduction appliquée en pourcentage.
  • La date et heure de début de la promo.
  • La date et heure de fin.

Un résumé vous indique le nombre de tuto qui seront concernés par cette promo globale ainsi que sa durée.

Vous retrouverez également un historique qui reprendra la liste des promos globales que vous avez mises en place (ainsi que celles générées par tuto.com, si vous avez laissé coché cette option sur vos cours). Vous pourrez notamment voir en un coup d’œil, le statut de ces promos globales. Ces status sont : « programmé », « en cours » et « terminé ».

A savoir :

  • Vous ne pourrez supprimer que les promo globales programmées (ou expirées).
  • Les promos globales générées par tuto.com prendront le dessus, si vous en avez vous-même programmé une pendant la même période.
  • Si une promo globale de tuto.com se termine avant la fin de votre propre promo, cette dernière prendra le relais et se terminera à la date que vous aurez fixée au préalable.
  • Une promo globale prend le dessus sur une promo mise en place sur un tuto.

Cet outil va donc vous faire gagner un temps assez considérable et vous permettra de réfléchir à une stratégie de promotion à appliquer pour vos tuto, complémentaire avec le générateur de coupons de réduction.

Tuto Bootstrap !

tuto Bootstrap

Nous avons enfin décidé de lancer notre chaîne de tuto Bootstrap.

Jusqu’à maintenant, ces derniers étaient classés dans la chaîne CSS, catégorie « Bootstrap », mais vu que dernier prend de plus en plus de poids dans le quotidien des intégrateurs front-end, nous avons décidé de lui accorder plus d’importance sur le site, en lui donnant plus de visibilité.

Bootstrap c’est quoi ?

Pour rappel et pour faire simple, Bootstrap est un framework opensource qui regorge d’éléments prêts à l’utilisation : des composants ou « components ». Par exemple vous trouverez :

  • des Glyphs (une collection d’icônes)
  • des listes déroulants
  • des boutons
  • des éléments de formulaires
  • des menus
  • fil d’ariane
  • pagination
  • des messages d’alertes
  • des barres de progression

Côté Javascript (jQuery) vous trouverez des comportements prêts à l’utilisation comme des carrousels , l’apparition de tooltips, l’apparion de modals ou popins…

Bref, tout ce qu’il faut pour démarrer rapidement avec l’intégration de votre projet web. La force de Bootstrap c’est que tout ces éléments sont personnalisables. Nous utilisons d’ailleurs Bootstrap pour l’intégration de toutes les pages de tuto.com !

Bootstrap fonctionne sur un système de grilles fluides ce qui fait que vous obtiendrez un site Reponsive (qui s’adapte à la taille de l’écran sur lequel vous le consultez : mobile, tablette ou desktop).

Bootstrap est gratuit, opensource et utilisé par de très nombreuses entreprises. La version actuelle est Bootstrap 3.

Tuto et Formations Bootstrap

Vous trouverez donc dans cette chaîne des tuto Boostrap qui vous aideront à acquérir les bases ou bien découvrir dans son intégralité, ce framework HTML, CSS et Javascript (jQuery) lancé par Twitter. Plus important encore, vous apprendrez à travailler sur des projets concrets d’intégration de sites Internet, qui feront appel à Bootstrap, dans une logique de flexibilité et de gains de temps. Notez que Bootstrap adopte une logique Mobile First, ce qui fait que vos pages Internet, intégrées avec ce dernier, seront Responsive Design.

Sélection de tuto Bootstrap :

 

Nouvel accueil pour vos cours achetés

« Un espace pour accéder en un clic à un cours et ses options »

Nouvel accueil cours tuto.com

L’amélioration de la plateforme suit son petit bonhomme de chemin. Les précédentes semaines nous nous sommes focalisés sur des fonctionnalités réservées aux contributeurs ; il était donc temps de faire plaisir (on l’espère) aux utilisateurs qui se forment sur tuto.com.

Nous vous présentons donc, le nouvel espace d’accueil d’un cours.

Pourquoi cette évolution ?

Nous sommes partis d’un constat. Peu d’utilisateurs ont pris conscience des différents possibilités qui accompagnent un cours depuis la mise en ligne du nouveau tuto.com (juillet 2014). Bien que le visionnage d’un tuto soit à vos yeux, l’action prédominante, d’autres options sont à votre disposition :

  • Le salon d’entraide : véritable prolongement de votre apprentissage, vous pouvez y poser vos questions à l’auteur, qui pourra venir vous répondre, ainsi que les autres clients du même tuto (ce que l’on appelle dans le jargon, le peer to peer learning ou encore le social learning, notions très répandues dans les MOOCs).
  • Le téléchargement des fichiers sources qui accompagnent souvent un tuto.
  • La validation des vos acquis via le QCM (quand ce dernier est disponible). Petit rappel : 3 tentatives pour atteindre le score de 100% afin de décrocher le badge et le certificat du cours.
  • La possibilité de laisser votre avis : cette partie est aussi importante pour les formateurs, qui adorent récolter des retours, positifs ou négatifs (lorsque ces derniers sont constructifs, évidemment), mais également les futurs clients qui basent leur décision d’achat, en partie sur ces fameux avis.

Jusqu’à présent, lorsque vous étiez au niveau de la liste de vos cours, et que vous en sélectionniez un, vous étiez redirigé sur le visionnage en ligne de ce dernier.

Désormais, vous passez d’abord par un accueil qui vous présentera les accès rapides aux différentes parties listées précédemment. Vous retrouvez également dans une colonne, située à droite dans l’interface, un résumé statistiques sur le cours et également les dernières entrées dans le salon d’entraide.

Cette nouvelle interface se veut plus efficace en terme d’interactions avec vos cours, les formateurs, la communauté. Nous allons voir désormais si ce nouveau design est efficace.

A vous de jouer !

Element 3d V2

Element 3D V2

Element 3D v2, LE plugin 3D de référence pour After Effects signé VideoCopilot sort aujourd’hui ! Ce qu’on peut vous dire, c’est que le père Andrew Kramer et son équipe ont bien bossé. Plus rapide, plein de fonctionnalités nouvelles. Voici la vidéo de présentation :

Les nouveautés en détail d’Element 3d V2

  • Element 3D v2 est plus rapide, avec des meilleurs temps de rendu (2 fois plus rapide).
  • Redesign de l’interface : l’interface a été revue pour améliorer votre flux de production.
  • Outils de déformation 3D qui vous permettent d’ajouter du bruit à vos modèles 3D, de les tordre, les torsader, les arquer, ajouter de la distorsion… Le tout avec de très nombreux paramètres pour gérer les déformations. Des outils qui vont s’avérer très pratiques pour l’animation et en particulier le Motion Design.
  • L’apparition du rendu Wireframe par Matériaux avec des contrôles sur le mode d’apparition du wireframe et d’autres options d’affichages bien pratiques là encore.
  • Bevel Outline que vous pouvez contrôler de la même manière que le bevel traditionnel. Cela vous permettra par exemple de créer des textes 3D encore plus complexes qu’auparavant.
  • Mode de transfert par matériaux : la possibilité d’appliquer à chaque matériaux son propre mode de fusion (pratique pour les effets de fumées, de flammes ou d’interfaces HUD).
  • Exclusion d’un objet du Multi Object : permet de créer des animations de démembrement d’un modèle en spécifiant quelles parties du modèle seront affectées. Vous avez également la possibilité de créer ce type d’animation sur un mesh spécifique appliqué à un channel.
  • Sub Surface Scattering (SSS) : les pros de la 3D connaissent bien ce terme qui peut se résumer comme étant la simulation de la transluminescence (pénétration de la lumière au travers d’un objet translucide, comme  de la peau par exemple).
  • Matte Shadows : amélioration de la gestion des ombres.

… mais aussi, 3 nouveaux produits !

  • BackLight : une collection de 50 HDRI Environment Maps et 35 HDRI light maps, très haute résolution (jusqu’à 8k). Vous pourrez jouer avec le gamma, la luminosité, le contraste, la saturation, l’UV Offset ou Repeat… 2 types de lumières sont proposées : Light Arrays et Single Lights de quoi jouer avec des effets de réflexion.
  • ProShaders 2 :  + de 300 matériaux basés sur les propriétés physiques de vos environnements.
  • Motion Design 2 : une collection de modèles 3D avec des objets très détaillés. Notamment des éléments comme des pistons ou autres pièces mécaniques qui , en les assemblant, vous permettront de construire de nouveaux modèles 3D. Vous retrouvez notamment des collections de poutres, éléments bioniques, buttons, capsules, chaines, tissus, hardwares, liquides, composants, charnières, badges, tuyaux…

Que penser de ce nouveau Element 3D v2 ?

Personnellement on adhère.

Le plugin reste très intuitif tout en proposant un tas de réglages et d’options qui vous permettent dans bien des cas de vous passer d’un logiciel 3D plus lourd comme Cinema 4D ou 3ds Max. C’est donc un nouveau coup dur pour les éditeurs de softs 3D qui se positionnent notamment sur le Motion Design, car, en l’occurrence, Element 3D v2 reste à nos yeux LE plugin à avoir si vous souhaitez agrémenter vos productions motion design avec de la 3D : la librairie des modèles 3d, des lights ou des shaders  est impressionnante de qualité, et les fonctionnalités du plugin seront clairement suffisantes dans 90% des cas.

Côté tarifs

Voici le détail des offres liées à Element 3D v2 :

  • Element 3D V2 seul : 195,95$
  • Mise à jour depuis la version 1 : 99,95$
  • Motion Design 2 : 99,95$
  • BlackLight : 99,95$
  • ProdShaders 2 : 99,95$
  • Motion Design Bundle : Element 3d V2 + BlackLight + ProShaders + Motion Design 2 = 349,95$ (ou 249,95$ dans le cadre d’une mise à jour).

Element 3d V2 Bundle

Notez qu’Element 3D v2 fonctionne dès la version CS5 d’After Effects (et bien entendu avec After Effects CC 2014). Les utilisateurs MAC devront être, à minima, sur Mac OSX 10.7. Vous pourrez bien évidemment ouvrir vos anciens projets Element 3D V1.6 sur la version 2 (il pourrait y avoir quelques ajustements à effectuer sur certains projets néanmoins ; n’oubliez donc pas de faire une petite sauvegarde avant de tenter la manipulation !).

Tuto Elments 3D V2

Des tuto sur Element 3D V2 sont en cours de production chez certains auteurs ; vous pourrez ainsi vous former et apprendre à jouer avec les nouvelles fonctionnalités de ce plugin indispensable pour After Effects.

Sketch 3 : l’avis des pros

sketch-img1

Sketch est un logiciel de design d’interface qui s’adresse aux webdesigners sur Mac. Encore très jeune, Sketch réussit, pourtant, à s’imposer progressivement auprès de la communauté des UX designers et dans de grandes sociétés telles que Facebook, Google, Twitter, Dropbox…
Et pour cause. Bohemain Coding, l’éditeur, semble bien tenir ses promesses en proposant, avec la version 3, un outil particulièrement fluide, flexible et taillé sur mesure pour les UI/UX/mobile designers. Au point de constituer, aujourd’hui, une alternative particulièrement solide à Photoshop et Illustrator ; dans les limites de ses champs d’application, du moins. En gros, Sketch nous fout bien le bordel dans un marché dominé jusque-là par Adobe et son Creative Cloud !

Du coup, comme on aime bien quand c’est le bordel, on a voulu participer au débat en invitant trois UX designers convertis à répondre à nos questions et confronter leurs expériences : Philippe Hong, Sébastien Gabriel et Jean-Marc Denis. Le premier a déjà remporté plusieurs prix le récompensant pour son travail (CCS Design Awards, CSS Awards, Dope Awards, Best Mobile Application) et vient de publier un tuto sur Sketch 3. Le second est visual designer pour Google Chrome et utilise le logiciel, notamment, pour la conception d’interfaces et d’icônes. Le troisième travaille chez Google en tant que product designer (Inbox et Gmail Android ont été entièrement réalisés sous Sketch) et n’est clairement pas sans responsabilité  dans le bordel susnommé ; car, en plus de tenir des workshops pour les non convertis, il propose une Master Class en vidéo pour vous apprendre à concevoir une application mobile avec Sketch 3 (in english).

Bref, de quoi se faire une idée assez précise de ce qui se trame !

Pourquoi avoir choisi de délaisser les outils du Creative Cloud au profit de Sketch ?

S. G : J’utilise toujours le Creative Cloud sur certaines choses mais Sketch offre simplement une meilleure flexibilité dans mon travail quotidien qui est de créer des interfaces et de gérer une myriade d’assets. Sketch brille là où Photoshop pêche, car ce dernier devenu trop généraliste. Sketch est un programme répondant à nos besoins, très particuliers, de designer d’interface.

P. H : J’ai choisi de passer sur Sketch pour les projets UI car le logiciel est adapté à ce besoin, et surtout parce qu’il est performant. Son utilisation est fluide et sans « ramage » ; une chose primordiale pour bien travailler.

J-M.D : Pour ma part, je n’ai jamais utilisé tous les outils de la Creative Suite à 100%. De plus, son prix est exorbitant. Il n’y a jamais eu de vrai concurrence sur ce marché, c’est pourquoi tout le monde a toujours utilisé Photoshop, Illustrator ou Fireworks. Evidement chacun de ces outils possède des qualités et des défauts. D’autre part, il existe beaucoup de ressources pour apprendre Photoshop ; c’est une des raisons qui en font l’outil par défaut de tous les designers avec qui j’ai travaillé. C’est un outil référence mais qui n’est pas conçu pour du design d’interfaces. Les fonctions de retouches photos de Photoshop et son moteur assez lourd en font un outil que beaucoup détestent mais que tous utilisaient au quotidien. Illustrator qui est une solide alternative, possède malheureusement une courbe d’apprentissage moins évidente. Quant à Fireworks qui était censé combler un vide, a été laissé à l’abandon par Adobe.
Sketch a donc chamboulé beaucoup d’habitudes et beaucoup de designers attendaient ardemment l’outil qui proposerait une alternative plus solide et stable que la Creative Suite. Les débuts n’ont pas été incroyables. Néanmoins, les premiers pas ont été rafraichissants grâce à l’interface native Mac et à la facilité déconcertante de manipulation des éléments. L’adoption de Sketch par beaucoup de designers s’est expliquée et s’explique encore par l’engouement autour de nouvelles fonctionnalités comme les smart guides, la touche « alt » pour afficher les mesures, le mode vectoriel, l’exportation des ressources, et les éléments que l’on peut modifier dynamiquement sans avoir à les détruire. De plus, à sa sortie, son prix de lancement de $30, avait été très attractif, pour les designers, qui comme moi, étaient freelances.

sketch-img4

Quels sont précisément ses atouts ? Ses inconvénients (il y en a toujours…) ?

J-M.D : Sketch est un logiciel qui y a beaucoup d’atouts pour plaire aux designers mais évidement ce logiciel est encore jeune dans sa création et l’équipe, bien que très réactive et à l’écoute, a encore du travail devant elle.
Pour moi, l’un des gros atouts de Sketch, c’est la rapidité du logiciel. Il est entièrement vectoriel et utilise des langages natifs à Mac OS. Cela entraine des fonctions gratuites dues à l’OS comme par exemple le versioning, la sauvegarde automatique des fichiers et le rendu des fontes plus précis que tout autre logiciel. Toutes les opérations sont non destructives donc les combinaisons et transformations de formes vectorielles sont réversibles et dynamiques. Sketch Mirror est aussi un atout de taille, pouvoir regarder ses designs en temps réel sur le téléphone. Cela aide à itérer très rapidement.
L’équipe travaille très vite et est à l’écoute des utilisateurs. Par exemple ils ont été réactifs quant à la demande des symboles qui sont arrivés dans la version 3.
Bien que très pratique et efficace, ce logiciel possède quelques axes d’amélioration. Le pixel grid snapping en est un bon exemple, c’est un bug qui était vraiment très frustrant. D’autre part, il se peut que Sketch plante de temps à autre si les pages sont trop fournies. Dans ce cas précis, je conseille de garder des pages avec un nombre d’artboards raisonnable. Le point positif de ce dernier bug, est que lors du plantage du logiciel, on ne perd jamais vraiment le travail puisque la sauvegarde automatique fonctionne très bien. Mais globalement je considère que l’équipe actionne de manière très effective sur les problèmes que l’on peut rencontrer.

S.G : Sketch est léger, simple et rapide. Il est entièrement vectoriel et a un système de création d’assets incroyablement pratique et flexible.
Les inconvénients de Sketch viennent principalement de ses bugs et petites choses, qui peuvent parfois énerver, comme la gestion de l’alignement sur la grille de pixels ou de l’outil texte.
Certains reprocheront à Sketch de manquer d’outils spécifiques comme l’édition de bitmap, mais il est important de comprendre que Sketch est un outil de niche et que ses développeurs ont fait un excellent travail pour le garder dans la bonne direction. Il est toujours plus facile d’ajouter des fonctionnalités supplémentaires pour plaire aux requêtes des utilisateurs mais on obtient, au final, un produit lourd et difficile à maîtriser ; un problème que rencontre les produits Adobe, selon moi.

P.H : Sketch a effectivement beaucoup d’atouts. C’est notamment un logiciel natif Mac, donc extrêmement fluide ; il est entièrement vectoriel, ce qui permet de zoomer et être très précis ; propose une nouvelle façon de travailler avec un système d’ « Artboards » (plan de travail) qui permet d’avoir une vue sur tout le design, qui peuvent ensuite être déposer dans des pages (très pratique car on a tout notre projet dans un seul fichier) ; un fichier dépasse rarement les 100 Mo, alors que ceux de Photoshop peuvent facilement atteindre les 1Go ; beaucoup d’autres choses très intéressantes, enfin, que j’aborde plus longuement dans mon tuto d’introduction à Sketch.
Parmi ces inconvénients : le logiciel est encore assez jeune donc il y a encore des bugs, mais cela tend à s’améliorer ; parfois des petites incompréhensions dans l’utilisation (Symbole, par exemple, qui ne peuvent pas être redimensionner). Bref, je lui laisser le temps de murir un peu :)

sketch-img5

Etes-vous le seul à utiliser Sketch ; est-ce un choix individuel ou un dessein collectif de chez Google ?

S.G : Je suis loin d’être le seul et de plus en plus d’équipe l’intègre à leur workflow. Faire changer les habitudes d’utilisation dans une entreprise tel que Google est un procédé qui peut être long car tous nos anciens documents sont faits via des produits Adobe, et Sketch a encore des choses a prouvé. Il ne correspond également pas forcément à tous les types de designer que l’on peut rencontrer à Google. Je dirais qu’une grande partie d’UI et d’UX designer a déjà fait le changement.

J-M.D : J’utilisais Sketch avant d’arriver chez Google et j’ai toujours été un “Evangéliste“ de ce logiciel. En arrivant chez Google j’ai beaucoup parlé du logiciel et ai proposé de former les designers sur quelques workshops. Beaucoup ont accrochés et se sont convertis. En arrivant j’étais le seul de l’équipe Inbox/Gmail à l’utiliser mais j’ai rallié pas mal de designers ; on est maintenant une dizaine à s’en servir. C’est devenu un outil de production à part entière. Inbox par Gmail iOS et Android et le nouveau Gmail Android ont été à 100% désignés sous Sketch.
Beaucoup de designers d’autres équipes utilisent Sketch et c’est pour ça que vous voyez des fichiers Sketch fournis publiquement par Google pour le material design.

sketch-img2

sketch-img1

Quelle place pour Sketch face à ses concurrents ; Photoshop et Illustrator notamment ?

S.G : Comme je l’ai dit précédemment, Sketch est un outil de niche et c’est ce qui en fait sa force. L’équipe de développement est également très proche de la communauté et c’est précisément ce qu’il manque à Adobe, je pense. Ils ont la flexibilité et la rapidité d’adaptation d’une petite entreprise qu’un mastodonte comme Adobe ne peut plus avoir. Si Sketch maintient sa direction de niche et son niveau d’écoute, il deviendra (s’il ne l’est déjà) un outil incontournable pour la clientèle visée, loin devant ses concurrents.

P.H : Tout à fait d’accord. Sketch se situe sur un marché de niche, contrairement à Photoshop où on a l’impression que tout y est concentré. Cela donne un air nouveau à ce qu’on connait depuis longtemps, c’est à dire : Photoshop photoshop photoshop… D’autres concurrents sont sur la balance, comme Affinity Designer que j’attends avec impatience et que je vous dévoilerai sûrement dans un prochain tuto…

J-M.D : La suite CC rattrape le retard dans les dernières versions mais ça reste toujours des usines à gaz à cause de l’ancienneté du code. Toutefois, il faut comprendre qu’elle n’est pas un outil conçu pour du design d’interface. Cependant, Illustrator reste encore pas mal utilisé, je comprends pourquoi c’est un outil solide mais l’héritage du monde du print est toujours un sujet sensible chez nous. :)
Du coté des prochains logiciels, j’ai rencontré Marc Edwards et j’attends avec impatience la sortie de leur logiciel Skala. Je respecte beaucoup Marc et j’imagine que son attention du détail et son expertise se reflèteront dans ce logiciel.

Comment pourrait évoluer ce logiciel dans ses prochaines versions ? ou comment aimeriez-vous qu’il évolue, du moins ?

S.G : Pour moi, Sketch doit rester simple et évoluer en même temps et en osmose avec le besoin auquel il répond. L’un des grands dangers de Sketch serait de trop se diversifier. Je pense que Sketch est actuellement extrêmement bon dans ce qu’il propose et qu’une fois les quelques bugs corrigés, il approchera de la perfection pour l’UI design.
Ce que je souhaite secrètement est que cette équipe talentueuse produise un « Sketch du motion design » qui fonctionnerait en parallèle de l’application Sketch originelle. Ce serait, pour moi, la « Sketch Creative Suite » parfaite. Mais je pense que ça n’arrivera pas tout de suite !

P.H : J’espère qu’ils corrigeront ces quelques bugs mais sinon je sais qu’ils sont en train d’améliorer certains outils pour que l’utilisation soit encore plus simple. Je pense qu’ils ont raison car un bon logiciel est, avant tout, un logiciel simple d’utilisation.

J-M.D : J’aimerais beaucoup qu’il évolue dans un esprit plus collaboratif. J’aurais par exemple aimé pouvoir facilement exporter des librairies de symboles pour partager des icônes avec mon équipe afin d’être certain d’utiliser les mêmes icônes. Soyons fous, pourquoi ne pas avoir un système de type Github pour avoir ces librairies tout le temps à jour, et que tout le monde puisse participer et les enrichir? Pareil pour les palettes de couleurs et autres effets. Soyons vraiment fous, pourquoi ne pas en faire un store dans Sketch pour pouvoir partager ou vendre non seulement avec mon équipe, mais avec le monde entier ce genre de librairies d’icônes ?! Promis cette idée est gratuite ! Il faut noter que c’est un axe de développement que certains logiciels 3D ont utilisé avec succès (Unity).

Quelles différences le logiciel apporte-t-il dans la logique de création ou de production ?

P.H : Elle apporte une cohérence dans le process de création, je pense. Le fait qu’on puisse avoir des styles prédéfinis et qu’on dispose de l’ensemble de notre projet en un seul fichier est particulièrement efficace. Et ça évite de devoir chercher les fichiers un peu partout ; un avantage non négligeable !

J-M.D : Je pense que c’est basé sur un ressenti personnel plutôt qu’une nouveauté technique. Ouvrir Sketch, pourrait se comparer à l’ouverture de l’app Bloc note, alors que la Creative ressemblerait plus à Word. A l’ouverture du logiciel, la présentation de cette page blanche est vraiment intéressante, ça aide à se focaliser sur la création et l’itération. L’interface de Sketch est assez dépouillée et donc les barres d’outils ne se mettent pas en travers de votre chemin, vous passez plus de temps à prendre soin de vos designs plutôt qu’à réfléchir pour savoir où se trouve tel ou tel outil.

S.G : Peu de différence dans la logique mais il apporte une grande flexibilité et une rapidité d’exécution et d’itération inédite. La facilité avec laquelle Sketch gère la production d’assets et le scaling est le jour et la nuit comparé à Photoshop.

sketch-img3

La qualité du code CSS généré par Sketch est-elle du goût des devs de votre entourage ?

S.G : Je n’utilise pas cette fonctionnalité au sein de Google.

J-M.D : Je n’ai que très peu utilisé cette fonction en production car je ne travaille pas directement avec des intégrateurs web. Les rares fois où je l’ai utilisé, le code était acceptable. J’imagine que depuis, l’équipe a dû consolider cette option.

P.H : J’ai pu tester le code CSS que génère Sketch, il n’est pas de mauvaise qualité mais pas assez poussé, à mon sens. Un point qui sera probablement amélioré.

Comment le Responsive Design a t-il un impact sur la manière d’aborder votre métier ? Autrement dit : Mobile first or not ?

P.H : Le Responsive Design est devenu pour moi une nécessité, vu le nombre de connexion qui s’effectue, de nos jours, via mobile. Je ne suis pas très partisan du Mobile First ; beaucoup de gens en parlent mais je pense qu’il ne faut pas l’appliquer tout le temps et à tout va. Les besoins utilisateurs influent vraiment sur choix de la méthode à prendre. Mobile First oui, mais pas tout le temps.

S.G : « User first » est ce qui me vient à l’esprit avant Mobile First. Mobile First est une tendance en réponse à l’évolution forte de notre marché en faveur des produits mobiles. La méthode a du sens à partir du moment où l’on ne l’utilise pas à tort et à travers. Connaitre les habitudes, besoins, et comportements de ses utilisateurs et prendre des décisions adaptées par rapport à ça est, selon moi, le plus important. Donc oui, il faut penser Mobile First si c’est cohérent avec la direction produit et fait d’une manière qui n’altèrera pas l’expérience utilisateur sur les autres formats utilisés.

J-M.D : Mobile First ! C’est évident et de notoriété publique ! Toutes les études le montrent, le mobile dévore le desktop depuis l’arrivée des smartphones. Les produits que je conçois commencent par une intégration sur mobile mais évoluent rapidement sur toutes tailles d’écran, que ce soit de la tablette, ou du desktop (responsive.png). L’idée est simple, si vous désignez une expérience pour mobile, vous partez, de facto, avec l’environnement qui impose le plus de restrictions possibles. Évoluer vers de plus grands écrans sera alors facile et vous permettra d’utiliser l’espace pour améliorer l’expérience de vos utilisateurs. Notez que c’est un des atouts de Material Design et c’est de cette façon que nous avons conçu nos produits (http://youtu.be/wtLJPvx7-ys?t=17m50s).

A ce titre, intégrez-vous Sketch Mirror à votre flux de production ?

S.G : Oui.

J-M.D : Oui, c’est une partie essentielle de mon workflow. Visualiser en temps réel vos designs permet de libérer du temps pour l’itération. Plus de concentration et d’engagement sur la création.

P.H : Oui absolument, et ça me fait gagner pas mal de temps. On sait tout de suite si la taille est bonne. Un assez bon outil.

sketch-img10

Que pensez-vous du Flat Design ? Quelles sont, selon vous, les tendances à venir ; doit-on envisager/craindre, par exemple, un retour au skeuomorphism après avoir atteint une forme ultime de la simplification graphique (comme un perpétuel retour des choses) ?…

P.H : A mon sens, le Flat Design a atteint son apogée. Beaucoup de design reprenne un peu de style Skeuomorphique ; je pense notamment à Twitter dont certains boutons ne sont pas entièrement flat. J’ai moi même pu constater, sur certains de mes projets, que les boutons flat avaient du mal à être distingués. Sur quoi il fallait les changer. Mais je ne pense pas qu’on doive envisager un retour du skeuomorphism, en tout cas pas de sitôt.

J-M.D : J’aime beaucoup cette citation de St Exupery qui résume ma vision du design ‚ « Il semble que la perfection soit atteinte non quand il n’y a plus rien à ajouter, mais quand il n’y a plus rien à retrancher ». Les smartphones ont rapproché les humains des écrans via le touché. La tendance skeuomorphism était une évolution attendue et souhaitée pour renforcer ce rapprochement. On connait les boutons, les textures et comment ils réagissent lorsqu’on interagit avec eux. Maintenant, les gens sont familiarisés avec ces métaphores, il est donc facile d’enlever ces effets visuels pour vous concentrer sur ce qui compte vraiment : le contenu.
Material Design est une étape intéressante où ces éléments plats prennent de la hauteur. On ré-introduit cet environnement physique qui va permettre de reconnecter les éléments de l’interface avec le contenu.
Ce qui m’amène à penser que l’avenir des interfaces se développera sur une 3ème dimension. L’ajout d’un environnement physique sera bénéfique pour faire une connexion avec les écrans. On peut imaginer configurer des sources de lumières, des angles de caméras et ajouter de l’interactivité du matériel avec les interfaces. Apple a commencé à introduire ça avec iOS7. Lorsque vous penchez votre téléphone, le wallpaper bouge en fonction de l’axe gyroscopique.
La réalité virtuelle est un pas de géant et les gens qui ont pu tester Occulus savent de quoi je parle. Savoir intégrer des interfaces dans un champ de vision en 3D est un challenge que personne n’a vraiment réussi à résoudre. Marcher dans la rue avec des lentilles projetant une interface à la Iron Man devant soi n’est pas une solution viable pour la vie de tous les jours !

S.G : Flat Design est un terme en réponse au Skeuomorphism. Comme toute réaction diamétralement opposée, ces deux mots ont tendance à englober ou généraliser ce qu’est le Flat Design ou le Skeuomosphism.
Je pense que le concept de Flat Design est basé sur une mauvaise conception de ce qu’est le skeuomorphism. C’est un terme vague utilisé en réponse forte à un autre terme vague ou mal compris. Cela donne ce genre de simplification : « Si ce n’est pas une représentation de faux cuir ou bois alors c’est du Flat ».
« Flat » ne représente que ce qui n’a pas de dimensions. A ce titre, la majeure partie de ce qui est désigné comme « Flat » ne l’est pas. Beaucoup de designers utilisent toujours, à juste titre, des métaphores de la vie réelle comme le positionnement de la source de lumière, générant dégradés de couleurs et ombres, etc.
Ce qui est important est ce qu’il y a au milieu, le design intelligent qui fonctionne sans se soucier des « mots tendances ».
Oui je pense que le design est cyclique, comme beaucoup de choses. Il évolue au gré des réactions fortes, en opposition à la tendance établie. Ce qui est intéressant, c’est de trouver son positionnement par rapport à ça. Savoir peser le pour et le contre et savoir s’adapter.
En se positionnant au milieu, en prenant le bon et en laissant le mauvais, le design subit une « évolution » et non une « révolution. Terme moins sexy mais beaucoup plus efficace, intelligent et constructif.

Sketch est-il, finalement, une réponse à ses évolutions techniques (Responsive Design) et esthétiques (Flat Design) ?

S.G : Sketch est un exemple parfait d’un produit répondant à un besoin au bon moment. Il a grandi en même temps que les UX et UI design ont pris du poids au sein de notre industrie. Il est finalement à l’image de ce que nous essayons, tous, de faire dans notre métier : proposer une solution élégante, efficace et en harmonie avec les besoins du moment.

J-M.D : Oui à 100% pour le responsive et flat design ainsi que tout design 2D qui a pour but de terminer sur un écran. Par contre, ce n’est, pour l’instant, pas une réponse pour ce qui est de la 3D.

P.H : Sketch est une des réponses, mais pas la seule..

Sketch est-il en mesure d’assurer des projets graphiques plus complexes ?

P.H : Pour des projets web, on peut avoir des projets Sketch assez conséquents. Mais il est vrai qu’il reste limité au design UI et qu’il faudra sûrement plus sur des projets plus complexe.

S.G : Sketch et son style épuré peut paraître trop simple pour aborder des projets graphiques plus complexe mais il ne faut pas le sous-estimer ; il suffit de le maîtriser. Cela étant dit, et comme je l’ai dit précédemment, ce qui fait la force de Sketch est qu’il répond parfaitement à un besoin précis et trop se diversifier pourrait lui porter atteinte. Photoshop reste le maître de l’édition bitmap et Illustrator reste inégalé pour des projets vectorielles complexes et les illustrations.
Sketch est fait pour assurer des projets complexes d’UX/UI designer et c’est ce qui fait sa force. Au-delà de cette niche, il faudra se tourner vers d’autres programmes.
Pour conclure, je dirais que ce qui est important est de maximiser l’interopérabilité des programmes dans la mesure du possible et sur le long terme. C’est un but probablement difficile à atteindre étant donné que ces logiciels sont développés par des entreprises différentes.
Je pense que vouloir un programme qui fait tout, aboutit, en général, sur quelque chose qui n’excelle nulle part.

J-M.D : Oui, sans aucune hésitation ! De manière concrète, quasiment tout le design de Inbox et Gmail Android a été réalisé sur Sketch. Je vous laisse imaginer le nombre d’itérations et d’écrans sur lesquels nous avons dû travailler. Nous échangions nos fichiers Sketch et j’ai même créé un sticker sheet assez complexe que j’ai partagé avec mon équipe (interaction designers, motion designers, prototypers, ingénieurs et product managers) pour qu’ils puissent, eux aussi, exprimer leurs idées avec des designs plus concrets.

Pour aller plus loin

sketch-banniere

Echanges : le nouveau flux PROMO

Notifications de Promotions

Ne ratez plus aucune promo !

Voici une nouveauté assez sympathique si vous êtes un client de tuto.com et que vous ne souhaitez pas passer à côté d’un bon plan. Nous affichons désormais dans le flux d’échanges, côté client, une nouvelle catégorie de messages appelés « PROMO » que vous pouvez filtrer, comme les autres notifications.

Liste des promos qui seront remontées dans ce flux :

  • Le deal du jour (à -70%).
  • Un tuto que vous auriez mis en favoris et qui passe en promo.
  • Les promos sur les packs de crédits.
  • Les promos lancées par tuto.com sur tout le catalogue, une famille ou un logiciel qui vous concerne.
  • Les codes promos générées par les auteurs sur des tutos qui vous concernent.
  • Les tuto offerts par les auteurs.

Chaque notification est accompagnée d’un lien. On vous indique également la date de validité de chaque promo.

En toute logique, vous devriez pouvoir, grâce à ce flux, dénicher les meilleurs plans de tuto.com et économiser quelques euros, ce qui fera du bien à votre porte-monnaie :)

 

Le nouveau générateur de coupons

outil promo tuto.com

Le nouveau générateur de coupons de réduction est arrivé. Découvrez-le !

Nous continuons le travail d’améliorations de la plateforme et cette fois, c’est l’outil de génération de coupons de réduction qui a le droit à son lifting.

Premier changement de taille : son emplacement. Nous avons en effet décidé de le sortir de la partie « modification de cours », et le considérer comme un outil à part entière. Pour cela, nous avons créé une nouvelle section dans votre espace vendeur : outils promo. Pour le moment, vous y trouverez uniquement le générateur de coupons, mais nous sommes en train de tester l’outil de « mass promo » – très attendu par les contributeurs – qui leur permettront de générer des promos sur tout leur catalogue, une famille de logiciels ou bien une sélection de tutoriels, le tout en un seul clic (gros gros gain de temps en perspective !).

coupon promo tuto

Les nouvelles capacités du générateur de coupons

Voici ce que vous allez pouvoir faire grâce à ce nouvel outil :

  • Générer un coupon de réduction valable sur tous vos cours.
  • Générer un coupon pour un cours en particulier.
  • Offrir un cours.
  • Accéder à l’historique de vos codes, avec une indication sur le statut (actif ou périmé), le nombre de saisies et surtout le nombre de codes utilisés !

Pour chaque type de coupons de réduction, vous pouvez :

  • Indiquer le montant de la réduction en pourcentage.
  • Indiquer si le coupon peut être saisi par tous les utilisateurs ou un client en particulier.
  • Indiquer si vous voulez que l’on notifie les destinataires de ce coupon, pour vous.
  • Indiquer le nombre d’utilisateurs qui peuvent saisir le code de réduc.
  • Indiquer une date de péremption du code (pour faire des promo flash par exemple).

Cet outil est linké à partir de pages stratégiques, comme la page d’un de vos clients, à qui vous pourrez directement offrir un code promo ou offrir un tuto tout court :)

Nous vous recommandons vivement de générer des codes promo ou d’offrir vos cours. Il s’agit ici d’un puissant outil de fidélisation et de transformation des ventes. Cela impactera donc très positivement vos ventes et donc votre chiffre d’affaire généré sur tuto.com.

Exemples de scénario :

  • Offrir une réduction sur un tuto qu’un bon client vient d’ajouter en favoris.
  • Proposer de faire gagner un de vos cours au choix sur Twitter ou Facebook.
  • Lancer une promo flash de -50% sur tous vos cours sur 24h.
  • Proposer -70% sur un cours pour les 5 premiers à saisis le code XYZ.
  • Utiliser un code promo sur votre communauté adosser à votre code affiliation.

A vous de jouer !

 

 

Pourquoi il est important de répondre à un avis client

avis client

Voici un mini guide pratique pour vous aider à répondre aux avis laissés par vos clients. Nous verrons également pourquoi il est important de répondre à tous les avis, positifs ou négatifs… surtout négatifs !

Le poids des avis clients.

Avis Vérifiés (une plateforme de gestion externalisée d’avis clients) annonce sur leur site Internet que les avis clients peuvent augmenter jusqu’à 20% vos ventes. D’après CtoC, 41% des internautes déclarent réaliser régulièrement des achats spontanés suite à des commentaires positifs. A contrario, 74% renoncent à un achat à cause d’avis négatifs (nous verrons plus bas comment minimiser cet impact).

Faut-il pour autant céder à la panique dès lors qu’une mauvaise note arrive ?

Beaucoup d’entre vous essayent de maintenir à tout prix une note de 5 étoiles sur leur tuto. L’objectif est louable, mais il ne faut pas pour autant paniquer dès lors qu’un client insatisfait vient chambouler votre joli 5/5.

En effet, une étude a montré que si un internaute ne voit que des avis « 5 étoiles » sur une fiche produit, ce dernier deviendra suspicieux. En d’autres, termes il vaut presque mieux obtenir une moyenne de 4,5/5 que 5/5. A la prochaine note assassine, ne vous affolez pas :)

Doit on répondre aux avis clients ?

La réponse est bien évidemment « OUI », et d’autant plus si l’avis de base est négatif. Une étude menée fin 2013 pour TripAdvisor par PhoCusWright démontre que  77 % des personnes interrogées pensent qu’un établissement qui rédige des réponses aux avis laissés par leurs clients, donne l’impression de se préoccuper davantage d’eux. Plus de 60 % indiquent qu’en général, lire ce type de réponses leur donne plus envie d’acheter.

Il est donc primordial pour vous de répondre à tous les avis que vos clients vous laissent ; qu’ils soient positifs et encore plus si ces derniers sont négatifs. Selon la même étude, 87% des internautes pensent qu’une réponse appropriée à un avis négatif leurs laisse une meilleure impression.

Comment répondre à un avis client ?

Voici quelques règles à garder en tête, lorsque vous répondez à un avis laissé par un client :

  • Évitez tout d’abord d’utiliser la même réponse type pour tous les avis laissés sur votre tuto. Cela donnerait l’impression que vous souhaitez bâcler l’exercice ou bien que vous cherchez à l’automatiser. Souvenez-vous, les internautes aiment les réponses personnalisées.
  • Essayez de répondre rapidement. Pour cela, abonnez-vous aux alertes « avis » dans votre compte tuto.
  • Prêtez une attention particulière à l’orthographe et à la grammaire. Cela a un impact sur les ventes (et accessoirement sur le référencement naturel de vos fiches produits).
  • Gardez un ton professionnel en toute circonstance (même si certains avis sont agaçants). En effet, l’étude de Trip Advisor montre que pour 70 % des personnes interrogées indiquent qu’une réponse agressive ou défensive suite à un avis négatif leurs donne moins envie d’acheter. Vous pouvez donc donner votre avis mais dans style poli et pondéré. N’oubliez pas que les autres internautes liront votre réaction !

Vous l’avez-vous, répondre au avis clients peut avoir un fort impact sur vos ventes.

Enfin, si jamais vous faites face à un avis/note qui vous semble abusif, n’hésitez-pas à nous contacter. Nous sommes-là pour intervenir !

 

 

Nouveau PSD à télécharger !

PSD Fotolia Ten

Mi Kyung Kim et Kenichiro Tomiyasu vous proposent une nouvelle composition dans le cadre de l’opération Ten de Fotlolia et donc, un nouveau PSD à télécharger gratuitement pour 24h ! Découvrez ici l’interview et les backstages de la réalisation de leur composition :

© 2014 Blog Tuto.com

Theme by Anders NorenUp ↑