• Skip to main content
  • Skip to header right navigation
  • Skip to after header navigation
  • Skip to site footer
  • Facebook
  • Twitter
  • Instagram
Lesjeudis

Blog Les Jeudis

Actualité Informatique et Digital

  • Tous les annonces
  • Employeurs
  • Développement
  • Réseaux et Systèmes
  • Digital
  • Marché de l’emploi
  • Conseils
  • Evénements
  • Formation

Pix2Code par UIzard : transformer vos images en code

24/10/2017 par Team LesJeudis

De nombreux développeurs transcrivent des interfaces utilisateur en lignes de code. Beaucoup de temps consacré à une tâche pas toujours vécue comme très épanouissante. Et si ces interfaces graphiques front-end jusqu’alors programmées manuellement pouvaient désormais être transformées automatiquement en code ? C’est en tout cas le défi que s’est fixé UIzard. Un simple screenshot UI suffit et la magie opère : le code généré automatiquement est utilisable tel quel. Ce genre d’inventions impensables hier (indispensables demain ?), ça n’arrive pas tous les jours et ça mérite bien un focus LesJeudis ! 

Le développement front-end, c’est un métier ! Et rassurez-vous, UIzard n’a pas l’intention de le supprimer ! Traduire des conceptions UI en code peut effectivement être fastidieux sans être passionnant, ce qui explique qu’elle soit jugée mûre pour l’automatisation. Mais leur invention ne se destine pas uniquement aux devs. Leur credo : “Code less, create more”. S’adressant aussi aux designers et aux développeurs, UIzard a souhaité faire en sorte que le temps de développement pour les uns, et la complexité de la tâche pour les autres, ne soit plus un frein à la création. 

Pix2Code crée en fait une passerelle, notamment entre développeurs et designers UI/graphiques, afin que chacun puisse avancer dans son domaine, avec ses propres méthodes, dans l’univers de l’autre. Le développeur peut, via un simple screenshot, transformer une interface utilisateur en code, tandis que le graphiste n’est plus contraint à travailler sur tel ou tel éditeur graphique : tant qu’il y a du pixel, il y aura du code ! 

Comment ça marche ? 

C’est essentiellement grâce à l’intelligence artificielle, et plus précisément aux progrès du deep learning, que Pix2Code a pu voir le jour. L’équipe a également énormément tiré profit de son environnement académique : en gros, ils ont profité d’un accès privilégié aux dernières recherches en la matière pour peaufiner leur outil. 

Pix2Code n’a besoin que d’un screenshot d’une interface utilisateur graphique (GUI) pour fonctionner. Il entraîne une combinaison de trois réseaux d’apprentissage automatique pour pouvoir, non pas générer des images à partir d’images ou du code à partir de texte, mais bien partir d’une image à l’entrée pour aboutir à du code. Le processus se fait donc en trois étapes : le programme doit à la fois analyser l’image, comprendre ses différents composants (mise en page, boutons, icônes, etc.), mais aussi faire preuve d’intelligence sémantique, comprendre différents langages et du texte, et enfin faire le lien entre le code, le texte et les images correspondantes pour pouvoir associer l’image décomposée à une recomposition codée prête à l’emploi. Encore en mode bêta mais déjà disponible sur leur site (qui propose aussi, à des fins éducatives, une explication en vidéo du principe dans les grandes lignes ici). 

Et ça marche ?

La solution, vouée en principe à devenir toujours plus performante et précise, offre déjà des résultats plutôt impressionnants ! Le code généré, s’il n’est pas vraiment compilable, fonctionne indifféremment sur iOS, Android et les interfaces Web. A ce stade précoce de la recherche, l’algorithme fonctionne avec une précision de 77%. En pratique, il faut le prendre comme un traducteur automatique linguistique et c’est pour ça qu’on aime : ça peut effectivement permettre de gagner du temps pour les développeurs qui peuvent y entrer des fichiers JPEG d’une interface conçue et produire du code qui peut ensuite être affiné et manipulé. Ca facilite également le travail de designers UI ou de graphistes possédant une connaissance moins avancée du code. Mais ça ne remplace personne, tout comme les traducteurs en ligne sont encore bien loin d’égaler des traducteurs professionnels.  

La véritable inquiétude, c’est plutôt au niveau des dérives potentielles : cela pourrait largement faciliter la copie du code d’un autre site Web. Bien que l’esprit parmi les devs et programmeurs soit largement collaboratif et éthique, nombreux sont ceux qui mettent leur talent au service de clients de tous horizons, et il est à espérer qu’il ne soit pas un jour possible de “copier/coller” des sites comme on copie maintenant facilement des textes. 

Quoi qu’il en soit, UIzard, qui propose avec Pix2Code sa toute première application, compte bien nourrir un maximum son outil pour en accroître la précision. Et vous, que vous inspire ce wizard du code ? Magicien ou sorcier ?

A lire aussi :
> En savoir plus surPix2Code by UIzard
> Toutes les offres d’emploi Dev sur LesJeudis

Categorie: Développement, Design, Web

About Team LesJeudis

Lesjeudis est fier de compter sur une équipe multidisciplinaire de professionnels techniques et du marketing. Ensemble, nous couvrons de vastes domaines informatiques et de développement, ainsi que du marketing et du numérique. De Rails à .net, de la conception graphique à l’interface utilisateur et au référencement, vous bénéficierez de nos connaissances et de notre expertise dans chaque article que nous écrivons dans ce blog.

Previous Post:Ineat Groupe, Lille’s Digital success story
Next Post:“Plus de 100 postes de consultants IT sont proposés actuellement chez Modis”

Reader Interactions

Leave a Reply

Your email address will not be published. Required fields are marked *

Sidebar

Déposez CV

Rechercher

Nos meilleurs articles

Bannière Développement de jeu vidéo

Développement de jeux vidéo : Ce qu’il faut savoir

Le processus du RPA (Robotic Process Automation)

La Robotic Process automation, aux frontières du machine learning et de l’IA

Comment bien sécuriser ses transactions sur le web ?

Modeles React JS

10 modèles React gratuits que vous pouvez utiliser pour vos projets

smartphone avec l'appli de CB et les textes: iOS, Android et windows

Développer une application mobile pas à pas

Un programmeur en t-shirt 'code master' fait semblant d'utiliser des langages informatiques sur un panneau interactif

Comment se former au métier de développeur informatique ?

Les erreurs courantes en C# à éviter pour exceller en tant que développeur

Tout savoir sur Angular 18

Scrum

Repenser Scrum pour libérer son potentiel

Prompt Engineering

Le Prompt Engineering : L’art de converser avec l’intelligence artificielle

Rust

Rust – Le nouveau pilier de la Data Science

Le guide ultime du développeur Python

Categories

  • Blockchain (14)
  • Conseils (58)
  • Design (38)
  • Développement (166)
  • Digital (298)
  • Divers (7)
  • E-commerce (13)
  • Evénements (24)
  • Fiche métier (2)
  • Formation (16)
  • Interviews (35)
  • Marché de l'emploi (69)
  • Marketing (127)
  • Méthodologie (10)
  • Réseaux et Systèmes (33)
  • Web (149)

Nos Categories

Blockchain
Conseils
Méthodologies
Design
Développement 
Digital
E-commerce
Evénements
Formation
Interviews
Marché de l’emploi
Marketing
Réseaux et Systèmes
Web

Candidats

Emploi par région
Emploi par métier
Fiche métiers informatiques
Nous contacter
Vous êtes recruteur ?

A Propos

Conditions générales d’utilisation
Politique de confidentialité
Droit d’accès aux données personnelles (cookies)

Social

Facebook
Twitter
Linkedin

Les Jeudis

© Copyright 2023 LesJeudis. Tous droits réservés.