Flexbox en production

Un petit article, pour ceux qui tardent à se mettre à Flexbox (Flexible Box) en production, et si il fallait commencer par un argument massif pour convaincre les retardataires, il suffit de regarder du côté de Bootstrap 4 qui embarque désormais cette spécification au sein de son framework. Même si on aime pas changer ses habitudes, c’est un petit effort pour bien des avantages, notamment, la prédictibilité de la mise en page face aux différents écrans, on est plus à la merci d’un float mal luné ou tout autre positionnement récalcitrant. Dans de nombreux cas, le modèle Flexbox offre une amélioration du modèle de boîte. Fini les problèmes de fusion de marge et les éléments auxquels il faut apporter le contexte BFC (Block formatting Context) pour gérer les flottants à qui on en demandait beaucoup face à se contexte des mobiles pour lesquelles ils n’avaient pas été pensé. (suite…)

Sketch, InVision, Adobe XD… la guerre des outils de prototypage pour les concepteurs UI et UX

En ce début 2018, l’arrivée d’InVision Studio nous invite a nous pencher sur ce phénomème que sont les outils de prototypage qui explosent depuis quelques temps, notamment depuis l’arrivée des contextes mobiles, on voit fleurir de nouveaux services connexes aux outils de webdesign historique tels que Photoshop ou Illustrator.

Pour qui ?

Même si les termes de concepteurs UI et UX peuvent faire penser aux webdesigner et graphistes web que ces outils ne sont pas pour eux, il n’en ai rien bien au contraire. Ces nouveaux logiciels sont partis du constat simple, que les outils de PAO n’était plus adaptés au flux de travail et à la création web. Notamment par le fait qu’ils sont limités à présenter des mockups statiques sans possibilité de mise en contexte ou d’intéragir avec elles ou même encore de laisser des commentaires en live. Côté intégrateur, il y a peu de passerelle entre les maquettes produites avec Photoshop et le code HTML, même si le logiciel de retouche d’image a fait des efforts pour exporter et extraire des informations pouvant servir aux codes CSS.
(suite…)

Gulp le couteau suisse de l’intégration web

gulp
Comment faire aujourd’hui pour ce passer de tels outils lorsqu’on prétend travailler de façon professionnel dans le domaine du web. Je parle des task runner et en particulier de “Gulp”, mais je ne suis pas sectaire peut-être certains préféreront “Grunt”, c’est la même philosophie.

Mais c’est quoi un task runner ?

Les sites web répondent aux mêmes exigences que n’importe quel produit, celui d’être fabriqué selon un process de qualité itératif et complexe (minifier les CSS et JS, optimiser les images…) bref une multitude d’opérations ennuyeuses et chronophages. Vous l’aurez compris Gulp représente un gain de temps vous évitant de vous balader sur plusieurs sites pour par exemple minifier vos CSS… C’est en cela que les Task Runner sont devenus très importants dans un projet web. Il faudra pour cela se familiariser avec la console ou le terminal pour lancer les lignes de commande, mais c’est un apprentissage qui sera payant in fine. (suite…)

Non un webdesigner n’est pas un graphiste (pas que !)

Le titre est explicite je crois, un petit billet d’humeur pour expliquer ce qu’est le métier de webdesigner si mal connu finalement pour qu’on vous sorte des clichés du graphiste qui fait du web, ou alors vous coller une étiquette de webdesigner par ce que faite vaguement des maquettes pour des sites, par ce que c’est la mode en ce moment. Mais d’où tu parles comme il dise dans les médias… Je parle d’une année riche consacrée à ma VAE (Valorisation des Acquis par l’Expérience) pour obtenir une licence de webdesigner, je parle comme membre de jury délivrant une certification de webdesigner au Greta, je parle après avoir pratiqué ce beau métier depuis plus de dix ans. Je me permet donc d’expliquer à mes jeunes collègues et moins jeunes ma vision du métier. Mais comme un schéma vaut mieux qu’un grand discours, voici ma vision du métier…webdesigner (suite…)

UX design et webdesign

Parmi les apprentissages du webdesign, il se trouve un domaine qui est peu exploré en réalité, il s’agit de l’UX design, même si on a l’impression de le voir partout, de n’entendre parler que d’expérience utilisateur comme un terme marketing devenu à la mode comme une logorrhée qui n’en finit plus à l’instar du Flatdesign qui le rejoint de près. Mais derrière l’écume des choses se trouve des concepts qui ne sont pas forcément récent comme on aimerait le croire mais qui valent la peine qu’on s’y intéresse pour peu qu’on ait la curiosité de son métier.
Comme beaucoup de web designer j’ai fait de l’UX design sans m’en rendre compte et l’ergonomie pouvait me paraître une histoire de bon sens, donc pas la peine d’y voir une martingale mystérieuse comme on veut parfois nous la vendre. (suite…)

Retour d’expérience comme membre du jury au titre de web designer

Il y a quelques mois, j’ai été contacté par le Greta de Dijon pour être membre du jury. Cette sollicitation soudaine et inattendue pour moi, arrivait à un moment propice ou j’avais envie d’essayer autre chose que la routine quotidienne. Pour la première fois cette année, le Greta a ouvert ses portes à un nouveau titre professionnel dans le domaine du webdesign, complétant ainsi la matière graphique avec du web. Il a donc fallu que le Greta trouve de nouveaux jury compétents dans cette discipline, c’est ainsi qu’on ma demandé de participer à l’aventure.
Un mini formation m’a été délivrée afin de me renseigner sur ce qu’on attendait de moi et également pour me faire découvrir les nouvelles dispositions relatives au travail de jury. Le ministère du travail dont dépend le Greta a en effet durci les conditions de l’examen afin d’enrailler le nombre de recours que les candidats avaient déposés ces dernières années. Étant donné la nouveauté de cette certification au titre de web designer, le Greta ne disposait pas de jury déjà aguerri à ce nouveau titre. J’ai donc été très sollicité pendant deux semaines à la fois sur le Greta de Dijon et Beaune. (suite…)

Invision ou le mockup interactif

Présenter son travail et faire comprendre ses intentions n’est pas toujours chose aisée dans la dimension si labile du web. Heureusement la réflexion sur ce sujet a permis de voir émerger quelques outils pratiques dans ce domaine, comme InVision, un service payant en ligne qui donne la possibilité de publier son travail de manière confidentiel mais avant tout collaboratif. InVision s’inscrit même dans une démarche très en amont des maquettes graphiques, car est à l’initiative de la réflexion du projet en proposant un mode Moodboard sous forme de structure Masonry bien connu des férus du réseau social Pinterest.
invision-3 (suite…)

CSS3 FLEXBOX

css-flexbox
Parmi les bonnes résolutions de ce début d’année, il me semblait intéressant d’approfondir mes lectures sur le module Flexbox, car Flexbox est un module, pas une propriété, cela entraîne pas mal de conséquences, entre autres que Flexbox a des propriétés bien à lui.
Je ne vais pas faire ici une démonstration des derniers aboutissements et des opportunités de FLEXBOX, d’autres sites sont des références en la matière. Juste faire le constat que l’utilisation de Flexbox que je gardais pour traiter des problématiques d’affichages mobiles, peut désormais être déployé de manière plus large pour les résolutions Desktop. (suite…)

Adobe Animate CC ou le revival de flash

La question se posait déjà depuis un certain temps : quelle formation pouvait-on proposer désormais à nos clients pour remplacer flash ?
Flash n’étant plus opérant sur un parc de machines grandissant comme les mobiles, il fallait bien trouver une alternative à une demande récurrente de nos clients pour faire des animations 2D. Aujourd’hui les choses se sont un peu éclaircies, fort heureusement mais elles ont pris une tournure assez singulières, en faisant du neuf avec du vieux. Car c’est bien notre vieille IDE flash, qu’on nous ressert, revenant par la fenêtre après l’avoir accompagner à la porte et annonçé son décès dans les médias idoine (j’avais moi-même mis ma pierre à l’édifice).
(suite…)

Ardoise digital iskn et Wacom bamboo spark

Un marché de niche tente de se développer aujourd’hui essayant de séduire aussi bien les professionnels que le grand public, c’est celui de la reconnaissance du geste sur support papier vers une traduction simultané sur support numérique.
L’ardoise digital de iskn et la bamboo spark de Wacom se sont lancer dans la bataille. Un idéal derrière cette belle idée : garder encore le papier comme support, alors que les tablettes iPad ou tablettes graphiques de Wacom, on fait d’énorme progrès au point parfois de supplanté le papier dans un worflow de plus en plus tendu. Alors pour ce faire une idée et savoir si il faut miser sur ce marché :
Lire l’article
duo-ardoise-bamboo