📌 CEREBRAS CODER est une application qui simplifie la création de vos projets en déléguant le code à une IA. J’ai fait un test avec le jeu 2048, et j’ai obtenu un résultat super en seulement 3 prompts, grâce à une génération de code instantanée et optimisée.
Aujourd’hui, nous allons voir ensemble dix astuces de conception qui vous aideront à faire une bonne première impression.
📌 Lottielab est un outil de motion design en ligne, pour les équipes de produits. Importez des éléments depuis vos outils de design préférés, comme figma, ou créez-les de toutes pièces dans Lottielab. Animez facilement et rapidement, avec une interface intuitive et des fonctionnalités puissantes.
📌 UNICORN est un service permettant d’améliorer votre site Web avec des effets WebGL stylés, du mouvement et de l’interactivité, rapidement, en quelques minutes.
📌 CALBAR est une application simple qui vous permet d’avoir un mini calendrier toujours disponible dans votre barre de menus Macos. Plus de nombreuses fonctionnalités pratiques pour aller plus loin dans votre expérience.
📌 Je vous mets ici une traduction d’un article vraiment sympa sur les compétences clés d’un UX designers. Je me suis permis également d’amender, de compléter et d’ajouter un certain nombre de commentaires 😉
📌 RIVE EDITOR est une application qui vous permet de concevoir des animations complexes avec une riche interactivité, et ces animations se traduisent de manière transparente en code que les développeurs peuvent utiliser directement. Pensez-y comme un pont entre le monde des visuels et celui des produits fonctionnels et opérationnels.
📌 SUMOPAINT est un service en ligne d’édition d’images permettant de dessiner, combiner des images, leur appliquer des filtres, ou encore des éléments texte. Plus de 300 pinceaux différents ainsi que de nombreux effets sont disponibles.
📌 WORDANCE permet de réaliser rapidement des vidéos promotionnelles à partir de textes et de fichiers audio.
https://plask.ai/ 📌 PLASK est un service d’animation 3D basé sur l’intelligence artificielle. Il permet aux utilisateurs de créer des animations réalistes, a base de motion capture, mais sans avoir besoin d’un costume de capture de mouvement. Le service fonctionne en utilisant un modèle d’apprentissage automatique pour analyser des vidéos de personnes en mouvement. Le modèle…
📌 LES CRITERES ERGONOMIQUES CE BASTIEN ET SCAPIN restent mon réferentiel numero 1 en terme de conception. Ils permettent de conserver à l’esprit les exigeances auxquelles mon interface doit répondre ainsi que le niveau d’éxigeance dans le détail de la conception, en ne s’arretant pas au cas nominal !
Ci dessous la traductions de 2 autres grilles de critères heuristiques, plutot connus, mais une petite piqure de rappel ne fait pas de mal 😉
📌 MAGICA VOXEL est une plateforme de création et de modélisation 3D qui offre une expérience intuitive et puissante pour les artistes et les amateurs de voxel art. MagicaVoxel offre un environnement convivial pour la création de modèles 3D pixelisés.
📌 BATFI est une application MacOS vous proposant de remplacer la gestion classique de votre batterie par une application plus personnalisable et offrant des fonctionnalités d’optimisation de la durée de vie de votre batterie.
📌 CSS LAYOUT est une librairie de centaines de composants pour les développeurs web qui cherchent à créer des sites web professionnels et visuellement attrayants. La collection comprend un large éventail de composants, tels que des menus de navigation, des boutons, des formulaires et des cartes, tous conçus à l’aide des techniques de mise en page CSS.
📌 BLOCKBENCH est un outil gratuit, de création 3D low-poly mettant tous les outils à votre disposition pour rendre le processus de création de modèles low-poly aussi simple que possible.
📌 GIFSKI est un outil gratuit permettant de convertir vos vidéos en animations GIF en utilisant les fonctions sophistiquées de pngquant. Il produit des GIFs animés qui utilisent des milliers de couleurs par image.
📌 PROTOTYPER est un plugin Figma permettant d’injecter directement du code dans vos prototypes figma.
📌 ANIMIX est un plugin FIGMA proposant de créer des animations directement depuis Figma.
A la manière d’After Effect, vous disposez d’une Timeline et de Keyframes pour laisser libre cours à vos idées.
📌 IPREVIEW est une application MacOS qui résout le problème de certains fichiers qui ne peuvent pas être prévisualisés dans macOS Finder, Quick Look et surtout Spotlight.
IPREVIEW vous aide à améliorer considérablement l’expérience macOS en fournissant la mise en évidence du code, la prévisualisation du rendu Markdown et Jupyter, la prévisualisation des images Webp et Avif et l’affichage de leur taille, la prise en charge d’une variété de fichiers de modèles 3D et la prévisualisation des animations, la prise en charge du mode sombre, etc.
📌 ARQ vous permet de créer et de travailler des animations 3D, à l’aide d’objets 3D et d’une timeline, et de créer des interactions complexes avec ceux-ci.
📌 MOKO est un outil qui permet de stocker vos visuels, illustrations et animations aux formats SVG ou Lottie.
#cmondary
📌 JITTER est un outil MotionDeisgn, en ligne, vous permettant d’animer facilement vos créations et d’exporter vos créations sous forme de vidéos ou de GIF, le tout, directement depuis votre navigateur.
📌 PREVIEWED est un générateur de mockup 3D. Une fois vos mockups créés, l’outil vous permettra de créer des vidéos animées de votre mockup en quelques minutes.
📌 DAVINCI RESOLVE est une application gratuite, alternative à AfterEffect.
#cmondary #Tools #Video
📌 VOLT est un #kit gratuit pour #Framer. Il regroupe 11 prototypes et permet donc d’essayer très simplement le #prototypage dans Framer. Parcourez les #prototypes, puis prévisualisez-les, dupliquez-les et essayez les différentes animations, interactions et l’ensemble des possibilités offertes par FRAMER
#cmondary
📌 ARTICLE très complet sous forme de guide pas à pas pour créer de petites animations, et micro-intéractions sous after effect après importation des sources Sketch / Figma.
L’idée est simplement d’utiliser les animations sous #AfterEffect pour donner vie à votre interface et montre comment toutes les éléments doivent se comporter et interagir.
📌 USE ANIMATIONS est une librairie d’icônes animés au format JSON.
Très pratique pour donner rapidement du feedback à l’utilisateur, sans trop surcharger les devs 😉 #Icons #Animation #Feedback #UI #cmondary
📌 FIGMA se dote de plugins et comble par la même occasion son “retard” sur SKETCH. Ici un article sur les 15 meilleurs
📌 FIGMOTION est un plugin permettant de créer des animations dans FIGMA.
📌 ARTICLE très intéressant sur les caractéristiques d’une bonne animation, d’un bon design d’interaction. Toujours à garder à l’esprit : – Les animations doivent être pertinentes – L’animation doit soutenir l’interaction – L’animation ne doit jamais ralentir l’expérience – L’animation doit être naturelle – L’animation doit refléter l’image de marque – L’animations doit tenir compte de la faisabilité technique
📌 GUIDE détaillé sur la manière de réaliser de bonnes animations motion. Le tout avec de nombreux exemples et de petites animations explicatives très graphiques.
📌 FOXCODEX est un tableau périodique du MOTION DESIGN.
📌 ANIMA continue de s’imposer comme étant LE plugin SKETCH incontournable, avec l’annonce d’une fonction PADDING permettant de retailler les boutons et champs de saisie à la taille du texte qu’ils contiennent (adieu PADDY le plugin dédié…)
📌 Sujet récurrent pour moi, Les micro-interactions, et animations au service de l’expérience utilisateur.
📌 Le plugin Sketch TIMELINE (de anima) se met à jour et propose dans sa version 2 de créer des composants interactifs.
📌 BRUSH NINJA est un service web permettant de créer de petites animations GIF, frame par frame.
📌 THREE DOTS est un petit projet sur Github sympa qui fourni 14 types différents d’animations CSS , des fameux 3 petits points qui vous invite à patienter. Il est amusant de retrouver sur une même base de 3 petits points , différentes conventions de signifiance des codes (Chargement, traitement en cours, écriture en cours, ….)
📌 Un nouvel article sur l’importance des animations en tant que feedback !
📌 LIGHTWELL est une application permettant de créer des applications interactives pour iPhone et bientôt Android.
📌 HAIKU est un projet assez proche de SVGator, et permet donc de créer des animations intéractives.
📌 WEBFLOW permet maintenant de créer des animations en reprenant un peu le concept de l’inspector de KEYNOTE.
📌 GIFME est un plugin pour sketch permettant l’ajout de GIF directement dans sketch.
📌 Très bon article sur le Motion Design. J’aurai tendance à utiliser KITE ou HYPE TUMULT pour effectuer ce genre de projet. Je compte bien essayer rapidement SVGATOR pour les petites animations de feedback et les intégrer à un proto (https://app.svgator.com/) Et enfin pour compléter cet article, je vous met un lien un autre article sur le même sujet :
https://www.webdesignerdepot.com/2017/10/3-smart-ways-to-engage-users-with-animation/
📌 Un petit tuto de Pablo Stanley sur l’utilisation de Keynote pour réaliser des animations de parallax.
📌 Parce que j’aime vraiment After Effect que cela reste un outil très puissant pour matérialiser les animations, transitions, et feedbacks de vos interfaces. Voici des petits tutoriaux pour ceux qui voudraient s’y essayer 😉
📌 MOCKINGBOT est un clone gratuit de INVISION
📌 STORYBOARDER est un outil vraiment sympa pour animer vos illustrations crayonnées.
📌 SUPERNOVA est une application qui va vous permettre de transformer votre création Sketch en application mobile.
📌 les animations ne sont pas seulement esthétiques mais permettent d’être en accord avec un certain nombre de critères ergonomiques
📌 UX Prototyping Tools
📌 Je voulais créer un article sur le sujet, mais d’autres l’ont fait avant moi, cependant GRAVIT est un clone de Sketch Gratuit qui mérite que l’on parle de lui.
📌 JUSTINMIND est un outil de prototypage vraiment prometteur.
