Fermer

mars 5, 2023

Découvrez Penpot, une plate forme de conception open source conçue pour les concepteurs et les développeurs

Découvrez Penpot, une plate forme de conception open source conçue pour les concepteurs et les développeurs


Le monde des outils de développement vit et respire l’open source. Des langages de programmation ouverts et gratuits, des frameworks ou même des éditeurs de code auxquels tout le monde peut contribuer – sont au cœur des prémisses du Web libre et ouvert. Pourtant, avec les outils de conception, cela a toujours été une histoire bien différente. Pour nos processus de conception, la plupart s’en tiennent à une palette d’outils commerciaux payants – la majorité d’entre eux ont été créés ou acquis ultérieurement par de grandes entreprises technologiques. Heureusement, également dans cet espace, nous commençons à voir des alternatives.

L’une de ces alternatives est Penpot, une application de conception open source qui a récemment commencé à gagner en popularité. Avec plus de 250 000 inscriptions et 20 000 étoiles GitHub, Penpot s’est déjà fait un nom et se développe comme une alternative viable aux autres outils de conception.

Cependant, être open-source n’est pas la seule chose qui rend Penpot unique. Il a également quelques fonctionnalités intéressantes dans sa manche qui en font un très bon match pour une bonne collaboration entre les concepteurs et les développeurs. Curieux d’en savoir plus ? Regardons ensemble de plus près.

Si vous avez déjà fait une bonne partie de la conception et du codage, je parie que vous avez également eu des moments de confusion et de frustration. Une chose que je n’ai jamais réussi à comprendre : pourquoi les applications utilisées principalement pour concevoir des interfaces utilisateur qui sont ensuite construites avec des technologies Web sont-elles souvent si mauvaises pour correspondre aux normes de ces technologies exactes ?

Par exemple, ils proposent des outils de mise en page sophistiqués qui suivent une logique complètement différente de la façon dont les mises en page sont construites sur le Web. Ou ils offrent des outils de dessin qui fonctionnent différemment des graphiques sur le Web, donc une fois que vous exportez votre travail, vous obtenez des résultats étranges et inattendus. Pourquoi?

La réponse est en fait assez simple. Pour la plupart des outils de conception, les fonctionnalités de transfert et axées sur les développeurs étaient une réflexion après coup. Basés sur différents modèles et normes, ils s’avèrent souvent déroutants et frustrants pour les développeurs.

C’est là que Penpot est différent. Créé par une équipe de designers et de développeurs travaillant en étroite collaboration, une excellente collaboration conception-développement a été leur priorité dès le départ.

Comme les autres applications Web, Penpot peut être exécuté sur n’importe quel système d’exploitation ou navigateur Web. Mais pour en rendre l’accès réellement ouvert et démocratique, il s’appuie également sur les Open Web Standards. Par exemple, les fichiers de conception de Penpot sont enregistrés au format SVG – la même norme que le format d’image le plus populaire pour les graphiques vectoriels sur le Web.

Cela signifie en pratique non seulement une meilleure compatibilité avec les technologies Web, mais une parité naturelle entre les conceptions et le code. Avec Penpot, vous n’avez pas à exporter vers SVGvos graphiques sont SVGpar définition.

La même chose fonctionne avec la traduction des styles des conceptions en code. Penpot n’a pas besoin de générer de valeurs CSS. Il peut simplement lire et traiter les valeurs CSS directement à partir des conceptions.

Un bon exemple de cela dans la pratique est Flex Layout, c’est-à-dire la fonctionnalité de mise en page de Penpot qui ne fonctionne pas seulement exactement comme CSS Flexbox. C’est simplement CSS Flexbox. Nous allons essayer ensemble dans la dernière partie de l’article !

Open Source et pourquoi devriez-vous vous en soucier

Avant de plonger plus profondément dans l’outil lui-même, parlons un peu de l’Open Source. Mais pourquoi est-ce si important et qu’est-ce que cela signifie pour vous ?

Cela signifie que c’est gratuit

Dans le monde de la programmation, Open Source signifie généralement que le code source de l’outil, de l’application ou du framework est disponible pour que quiconque puisse le visualiser, le modifier et le distribuer. Mais pourquoi cela serait-il important pour vous et votre choix d’outil de conception ?

Avant tout, le code de l’application est 100 % gratuit et disponible pour un usage commercial. Chaque partie et fonctionnalité de l’application qui est gratuite aujourd’hui le restera. Personnellement, parmi tous les outils de conception que j’ai jamais essayés, je n’ai jamais vu une application de conception aussi complète et solidement construite qui soit entièrement gratuite, même pour une grande équipe. Dans ce domaine, Penpot est loin devant toute concurrence.

Cela signifie une meilleure sécurité et un meilleur contrôle

Mais l’open source est tellement plus. Cela signifie également plus de transparence, de contrôle et de sécurité. N’importe qui peut auditer le code de l’application pour détecter d’éventuelles vulnérabilités de sécurité ou ajouter de nouvelles fonctionnalités à l’outil qui répondent à des besoins spécifiques. De plus, l’open source signifie que le code ne peut pas être contrôlé par une seule entité ou société et que les utilisateurs ne sont pas enfermés dans l’écosystème d’un fournisseur particulier.

Tout cela est vrai aussi pour Penpot. Cela peut ne pas sembler particulièrement significatif ou sexy à première vue, mais si votre entreprise devait un jour se soucier de maintenir un contrôle total sur les normes de sécurité de sa boîte à outils ou si vous souhaitez éviter le blocage des fournisseurs, choisissez une application Open Source. pourrait être un gros problème.

Cela signifie une personnalisation sans fin

Avez-vous déjà utilisé des plugins dans un outil de conception ? Si tel est le cas, vous seriez probablement ravi d’apprendre que la personnalisation est ce que Penpot apporte à un tout autre niveau. L’open source signifie que les utilisateurs peuvent modifier le code source de l’outil pour répondre à des besoins spécifiques, en le personnalisant si nécessaire.

Vous pouvez non seulement étendre les fonctionnalités de l’application. Vous pouvez littéralement le modifier comme bon vous semble pour l’adapter aux processus et aux besoins spécifiques de votre équipe.

Cela signifie que vous pouvez l’exécuter vous-même

Penpot étant open source, signifie également la possibilité d’héberger votre propre instance de l’outil. Cela signifie que vous pouvez exécuter Penpot sur vos serveurs, en ayant un contrôle total sur vos données et sur l’application elle-même.

Cela signifie une tranquillité d’esprit pour l’avenir de l’outil

Enfin, l’open source offre une tranquillité d’esprit pour l’avenir de Penpot. L’outil étant open source, les utilisateurs auront toujours le contrôle de l’outil avec lequel ils travaillent, quel que soit l’avenir. Indépendamment de ce qui se passera ensuite, vous pourrez toujours utiliser Penpot selon vos propres conditions. Cela signifie que les gens peuvent investir dans Penpot en toute confiance, sachant qu’ils auront toujours accès à l’outil et à leur travail (plutôt que d’être à la merci d’éventuels changements d’activité, acquisitions, changements de prix, etc.)

J’espère qu’à présent, vous n’avez plus aucun doute sur les nombreux avantages que cela apporte de travailler avec des outils Open Source. Maintenant, regardons Penpot lui-même.

Où Penpot brille…

Si vous avez récemment travaillé avec l’un des outils de conception les plus populaires de Penpot, vous vous sentirez comme chez vous. Son interface doit être familière et prévisible, et offrir également toutes les fonctionnalités de base que vous pourriez rechercher.

L’interface utilisateur est discrète, les performances perçues sont bonnes et tout fonctionne comme prévu. Mais ce sont les fonctionnalités liées au transfert où Penpot brille vraiment.

J’ai déjà mentionné Flex Layout, la propre fonctionnalité de mise en page de Penpot. Si vous avez déjà utilisé le modèle Flexbox en CSS, cela peut sembler étrangement familier. En fait, c’est exactement cela : CSS flexbox à l’intérieur d’une application de conception.

Et cela signifie non seulement une meilleure parité avec le code que les autres applications de conception (au moins tant que vous prévoyez d’utiliser CSS flexbox dans votre code), mais également un meilleur éventail de possibilités à l’intérieur de l’outil de conception lui-même (par exemple, vous pouvez envelopper des éléments de la disposition automatique en plusieurs lignes).

Des mises en page plus puissantes signifient également de bien meilleures possibilités lorsqu’il s’agit de concevoir des conceptions vraiment réactives. Avec ce que Penpot peut faire, il y a de fortes chances que, dans de nombreux cas, vous n’ayez plus jamais à créer des conceptions distinctes pour différents points d’arrêt.

Penpot différents points d'arrêt
(Grand aperçu)

Tout cela ne serait pas aussi bon sans le grand onglet Inspecter. Penpot vous donne tous les CSS dont vous pourriez avoir besoin, ainsi que le code SVG source de tout composant que vous sélectionnez.

Génial!

…Et là où ça ne va pas (encore)

Indépendamment de tous les éloges, Penpot n’est pas parfait non plus. Étant un outil relativement jeune, il est difficile de rivaliser avec les géants qui dominent la scène des outils de conception.

Si vous le comparez étroitement à d’autres applications de conception populaires, vous trouverez certainement quelques fonctionnalités manquantes, ainsi que certaines d’entre elles moins complexes qu’ailleurs. Par exemple, la boîte à outils des composants et les fonctionnalités de prototypage de Penpot sont encore relativement simples et limitées.

Cela dit, la feuille de route de Penpot est très activement travaillée. Vous pouvez vérifier sur quoi l’équipe est en ce moment sur leur site internet.

Il est également important de garder à l’esprit que le potentiel de développement de Penpot en tant qu’outil Open Source ne peut être sous-estimé. La communauté de contributeurs de l’outil est déjà assez forte, et je pense qu’elle ne fera que croître. C’est un avantage concurrentiel que les outils à code source fermé ne pourront jamais atteindre.

En voyant ce que Penpot peut faire aujourd’hui, j’ai personnellement hâte de voir la suite.

Par exemple, en regardant l’implémentation de Penpot de Flex Layout, pensez à quel point ce serait cool d’avoir un outil similaire pour CSS Grid. Qui est mieux placé pour le construire que Penpot ? Alerte spoiler : si vous regardez leur feuille de route publique d’assez près, vous découvrirez qu’ils y travaillent déjà.

Dernières pensées

Même si Penpot est un outil relativement nouveau, il constitue un choix solide pour une plate-forme de conception. Il fait un excellent travail pour réduire l’écart entre les concepteurs et les développeurs.

Je pense que c’est une approche open source et un changement bienvenu qui ne devrait que profiter à notre industrie, car j’espère que d’autres suivront.

Si vous souhaitez essayer Penpot, il n’est plus en version bêta et est disponible pour vous et votre équipe — complètement gratuit

Ressources

Éditorial fracassant
(il)




Source link