6 alternatives Figma pour les concepteurs UI et UX

Publié: 2022-09-16

La nouvelle selon laquelle Adobe a acquis Figma est maintenant connue. La quantité de mèmes inondant les chaînes Twitter et Slack a été quelque chose. Et même si je ne peux pas parler au nom de tout le monde, je pense qu'un nombre important de designers ne pourront pas vivre confortablement avec cette nouvelle.

D'abord et avant tout, pour le moment, Figma restera une société indépendante (séparée de Creative Cloud). Cela a été dit dans l'annonce du PDG, Dylan Field. Au fur et à mesure que des informations plus concrètes seront disponibles sur leurs plans pour l'avenir, cet article sera mis à jour en conséquence.

16.09.2022 - Figma a fait un espace Twitter pour discuter de l'acquisition, et Ashish a préparé un résumé de tout ce qui a été dit/discuté.

L'autre chose est que Figma n'a pas de véritable concurrence en ce qui concerne à la fois un plan gratuit mais aussi un hub communautaire. Si vous êtes un petit designer ou peut-être un blogueur, vous ne pouvez pas faire la différence entre leurs plans Free et Pro. C'est comme ça que c'est bon.

La compétition a eu pas mal de chaussures à remplir.

Ce n'est pas seulement que Figma est un outil de conception et de prototypage multiplateforme, axé sur la collaboration, avec une douzaine de cas d'utilisation. En 6 courtes années, Figma est passé d'un outil de conception à un épicentre de ressources de conception, d'outils et de guides sur la façon de créer des interfaces utilisateur de classe mondiale.

Communauté Figma

À tel point que si vous êtes un utilisateur de Sketch, InVision, Adobe XD ou tout autre utilisateur de plate-forme alternative, Figma peut toujours faire partie de votre flux de travail de conception quotidien car ses ressources sont si bonnes. Et cela est décuplé pour les utilisateurs réels de Figma. Des modèles aux kits d'interface utilisateur en passant par les textures et les motifs, en passant par un référentiel extrêmement riche de plugins qui rendent la conception beaucoup plus agréable.

Je pense que c'est une évaluation juste que plus que les gens mécontents de l'acquisition de Figma par Adobe, c'est la peur de perdre l'accès à ces ressources organisées par la communauté. Intégrer un aspect communautaire peut s'avérer bénéfique, que vous soyez un outil de conception payant ou gratuit. Et encore plus si le jour vient où Adobe décide de débrancher Figma et de le mettre dans Creative Cloud.

Alternatives Figma pour les concepteurs UI et UX

Les humains sont des créatures incroyablement adaptables, nous allons donc regarder au-delà des nombreuses choses qui font de Figma une excellente plate-forme. Au lieu de cela, nous examinerons ce qui fait des autres outils de conception/prototypage une alternative solide.


1. Pot à crayons

Penpot - Outil de conception pour les équipes

Penpot est en préparation depuis 2021 (bien que l'idée semble remonter à 2018) et est conçu comme un logiciel open source pour la conception, la collaboration et le prototypage. Il est multiplateforme (basé sur un navigateur) et vous pouvez auto-héberger Penpot avec Elestio ou Docker.

Le projet lui-même est toujours en version bêta et je pense qu'il restera dans cet état pendant un certain temps. Néanmoins, quelles sont les principales caractéristiques sur lesquelles Penpot est construit ?

  • Conception - interface pilotée par composants pour la création et la gestion de projets de conception.
  • Prototypage - créez des aperçus UX interactifs et testez le flux de conception.
  • Collaboration - collaboration d'équipe en temps réel avec prise en charge des commentaires et des commentaires.
  • Commentaires – créez des commentaires sur des éléments spécifiques et partagez-les avec votre équipe.
  • Ressources - bibliothèques et modèles organisés par la communauté.

Ainsi, Penpot est tout à fait conforme à ce que propose Figma, notamment en étant gratuit. En ce qui concerne l'interface de Penpot, il existe de nombreuses similitudes entre Figma et d'autres outils similaires.

Exemple d'interface Penpot

Je pense que si vous jouez avec, vous allez certainement trouver des choses qui ne semblent pas aussi vives que dans Figma. Il est possible de copier et coller des images, mais la structure des actifs en elle-même peut prendre une minute pour s'y habituer par rapport à sa linéarité dans Figma.

Une chose que Penpot n'a pas est la mise en page automatique, mais cela a été confirmé pour être travaillé dans ce tweet et devrait arriver sous peu. De plus, des travaux sont en cours pour vous assurer que vous pouvez télécharger vos fichiers .fig sur Penpot. Cela semble venir après l'ajout de la mise en page automatique.

Gary Simon de DesignCourse a récemment réalisé un tutoriel pour Penpot, et vous pouvez regarder sa vidéo d'introduction de 30 minutes ici. Le didacticiel est basé sur une simple conception de page de destination pour un portefeuille et constitue un bon aperçu de ce dont Penpot est capable à ce stade de développement.

2. Croquis

Esquisse - Conception & Prototype

Je suis sûr que l'équipe de Sketch est ravie de la nouvelle. Figma et Sketch sont les meilleurs outils de conception UI/UX sur le marché, et de loin. Le seul problème avec Sketch est qu'il est verrouillé derrière macOS (l'application Web est limitée au partage de prototypes et aux commentaires uniquement), bien qu'il y ait eu des rumeurs selon lesquelles ils prévoyaient de s'étendre vers d'autres systèmes.

Esquisse contre Figma

J'adorerais m'asseoir ici et discuter des différentes comparaisons entre Figma et Sketch, mais ils l'ont déjà fait pour moi. Cette page s'adresse à tous ceux qui découvrent Sketch ou qui ont une expérience antérieure et qui ont besoin d'un rappel de la façon dont Sketch se compare à Figma.

En ce qui concerne l'implication de la communauté, Sketch est définitivement parmi les meilleurs d'entre eux. Il existe des dizaines de sites Web gratuits Sketch actifs, et Sketch dispose d'un système de plugins, en plus d'éléments tels que les extensions et les intégrations. Ils ont également un fantastique cours gratuit qui sert d'introduction aux bases de la conception, mais plus important encore - l'interface et les capacités de Sketch.

En ce qui concerne les prix, Sketch propose un essai gratuit de 30 jours et son plan premium est fixe à 99 $ par an.

3. Sieur

Créateur de site Web sans code, outil de conception Web pour les concepteurs

Si vous utilisiez Figma principalement pour utiliser des kits d'interface utilisateur préexistants que vous personnalisez et transmettez ensuite pour les modèles HTML, alors Siter pourrait s'avérer être une alternative utile. Cet outil de conception est conçu comme une plate-forme sans code pour créer et personnaliser les mises en page de sites Web et les publier via Siter.

Ce qui est génial avec leur plateforme, c'est que vous pouvez inviter d'autres personnes à collaborer sur le même design. En d'autres termes, cela pourrait être une bonne alternative pour toute personne faisant partie d'une agence spécialisée dans la création de sites Web en direct pour leurs clients. Une fois le projet terminé, vous pouvez en transférer la propriété à votre client.

Éditeur de site

Voici quelques autres fonctionnalités :

  • Code – Vous pouvez ajouter un code personnalisé qui est exécuté lorsque vous publiez ou prévisualisez votre conception.
  • SVG - Il est possible d'importer et d'éditer des vecteurs SVG ou de les créer vous-même avec des courbes.
  • Mouvement - Ajustez l'état de l'élément (transitions, survol, actif) avec un aperçu en direct.
  • Importation Figma - Vous pouvez importez un projet Figma existant et transformez-le en un site Web en direct !

Le prix commence à 12 $ par mois pour les projets personnels et à 19 $ pour les projets avec jusqu'à 5 collaborateurs et/ou projets.

4. UXPin

UXPin - Outil de conception et de prototypage

L'une des choses avec les outils de conception, que ce soit pour les illustrations ou la conception d'interface utilisateur, c'est qu'après un certain temps, ils ressentent tous la même chose. Bien sûr, chaque outil a une fonctionnalité distincte que l'autre n'a peut-être pas, mais en regardant de loin, les outils de conception ont tendance à être construits de la même manière.

Alors, en quoi UXPin diffère-t-il de cela ?

UXPin est un outil de conception basé sur du code qui vous permet de créer vos interfaces en utilisant les mêmes composants que ceux utilisés par les développeurs. La fonctionnalité s'appelle la fusion et n'est disponible que pour React.

Il est possible d'utiliser UXPin sans cette fonctionnalité, et la plate-forme est mature pour le travail quotidien de l'interface utilisateur, y compris le prototypage, le wireframing et le travail collaboratif.

Si cela ne semble pas assez fou, UXPin prend également en charge l'intégration de systèmes de conception préexistants comme point de départ de votre prochain projet d'interface utilisateur. Vous pouvez choisir entre Material UI ou parcourir le répertoire Adele pour toutes les bibliothèques de composants prises en charge par UXPin.

Prise sans vergogne : j'ai déjà écrit sur les bibliothèques de composants React.

Si vous souhaitez en savoir plus, l'endroit pour le faire serait les UXPin Docs. Vous trouverez des instructions détaillées sur chaque aspect de ce que cet outil a à offrir, y compris des exemples de l'éditeur et comment l'utiliser, ainsi que de nombreuses autres fonctionnalités, et toutes les informations sur leur fonction de fusion.

Qu'en est-il de la tarification ? UXPin propose deux forfaits différents : Merge et Standard. La fusion commence à 89 $ par mois pour le plan Startup (1 utilisateur) et à 119 $ par mois pour le plan Entreprise (également pour 1 utilisateur). La norme commence à 19 $ par mois et par utilisateur, le plan Pro coûtant 69 $ par mois.

5. Concepteur d'affinité

Concepteur d'affinités

Affinity Designer est souvent négligé car il n'est pas commercialisé comme un outil UI/UX en soi.

Pourtant, il est capable de concevoir des maquettes, des conceptions d'interface utilisateur, des logos et des actifs de marque. En plus de cela, il possède des fonctionnalités d'illustration phénoménales, ce qui est formidable si votre objectif principal d'utilisation de Figma était de concevoir et d'optimiser des éléments tels que les actifs de la marque et la structure créative globale.

Cette vidéo de Joshua Omido est un bel aperçu de l'interface d'Affinity, mais aussi de l'ensemble du processus de travail avec la conception de l'interface utilisateur d'une application mobile.

Cela dit, Affinity Designer manque de fonctionnalités telles que la collaboration et le prototypage en temps réel et ne dispose pas non plus d'un système de plug-in. Très certainement un facteur décisif pour les équipes.

Et enfin, le domaine dans lequel Affinity Designer excelle est son système de licence. Vous ne payez qu'une seule fois pour le logiciel (60 $ + un essai gratuit) et vous pouvez l'utiliser sur vos appareils Windows ou macOS.

6. InVision

InVision

InVision fournit une solution alternative à FigJam. En tant qu'utilisateur de Figma, vous connaissez probablement déjà FigJam. Sinon, il s'agit d'une interface de tableau blanc en ligne basée sur une équipe où vous pouvez travailler ensemble sur des idées, définir des plans dans la pierre et créer des trajectoires de projet visuelles. InVision fournit la même solution, en se concentrant sur l'abordabilité ( il a un plan gratuit ! ) et des fonctionnalités simples.

Existe-t-il des outils de conception UI/UX (natifs) pour Linux ?

J'ai vu cette question être souvent posée au cours des dernières 24 heures, et pour autant que je sache, le seul outil de conception UI/UX Linux natif est Akira.

Akira - Application Linux native pour UI et UX Design construite en Vala et GTK

Le projet en est encore à ses débuts. À moins que les gens ne soient disposés à contribuer eux-mêmes au projet ou à le soutenir financièrement, je m'attends à ce que les progrès soient relativement lents. C'est également pourquoi de nombreux outils de conception UI/UX les plus populaires se concentrent strictement sur une interface basée sur un navigateur, car cela élimine le besoin de créer des applications natives.