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

Blog Les Jeudis

Actualité Informatique et Digital

  • Annonces
    • Par région
    • Par métier
    • Par technologies
    • Par entreprise
    • Fiche métiers
  • Entreprises
  • Tests
  • News
  • Se connecter
  • Déposer CV
  • Recruteur
    • Connexion Recruteurs
    • Employeurs
    • Trouvez des CVs
    • Postez des offres
  • Categories du Blog

    • Développement
    • Réseaux et Systèmes
    • Digital
    • E-commerce
    • Marché de l’emploi
    • Conseils
    • Evénements
    • Design
    • Marketing
    • Interviews
    • —-
  • Annonces

    • Toutes nos offres d’emploi
    • par région
    • par métier
    • par technologies
    • par sociétés
    • Par Industries
    • Fiches Métiers
  • Entreprises
  • Tests
  • offres recommandées
  • Se connecter
  • Déposez CV
  • Employeurs

    • Connexion recruteurs
    • Employeurs
    • Trouvez des CVs
    • Postez des offres
  • Développement
  • Réseaux et Systèmes
  • Digital
  • E-commerce
  • Marché de l’emploi
  • Conseils
  • Evénements
  • Design

Pix2Code par UIzard : transformer vos images en code

24/10/2017 par Team LesLeudis

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

 

Category: Design, Développement, Web

About Team LesLeudis

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

Laisser un commentaire Annuler la réponse

Votre adresse e-mail ne sera pas publiée.

Sidebar

Rechercher

Nos Meilleurs Articles

MOA et MOE

MOA / MOE : Quelles sont les différences ?

développeurs front end et backend

Développement front-end et back-end : Quelles différences ?

lignes de code Java

‘Java’ est-il le meilleur langage de programmation pour les débutants?

vb net ou c# comme langage de programmation

C# ou VB .NET, le choix du langage

Comment utiliser le framework React JS

1033853617

Les frameworks de programmation les plus populaires en France 

Les métiers du marketing digital

Les métiers du marketing digital les plus demandés en 2019

signe langage python sur ordinateur portable

Web Scraping avec python

757797865

Qu’est-ce que le DevOps et en quoi consiste ce métier ?

smartphone et ordinateur avec banniere sur kotlin comment langage de developpement pour android

Kotlin pour le développement Android

Jeunes stagieres informatiques dans le domaine de la robotique

Le guide ultime pour bien préparer son stage informatique

Pourquoi choisir symfony pour un projet web featured banner 800px

Pourquoi choisir Symfony pour un projet web ? 

Categories

  • Blockchain (7)
  • Conseils (40)
  • Contenu Top (13)
  • Design (42)
  • Développement (136)
  • Digital (347)
  • E-commerce (11)
  • Evénements (26)
  • Interviews (30)
  • Marché de l'emploi (41)
  • Marketing (98)
  • Réseaux et Systèmes (19)
  • SEO (41)
  • Web (160)

Nos Categories

Blockchain

Conseils

Contenu Top

Design

Développement 

Digital

E-commerce

Evénements

Interviews

Marché de l’emploi

Marketing

Réseaux et Systèmes

SEO

Web

Candidats

Emploi par région

Emploi par métier

Emploi par technologie

Emploi par industrie

Emploi par type de contrat

Tous les emplois

Fiches métiers informatiques

Nos Services

S’inscrire

Annonces

Évènements

Tests

Magazine

Salon LesJeudis

Support

Nous contacter

Vous êtes recruteur ?

A Propos

Conditions générales d’utilisation

Politique de confidentialité

Droit d’accès aux données 

personnelles

Social

Facebook

Twitter

Linkedi

Nos Categories

Blockchain

Conseils

Contenu Top

Design

Digital

E-commerce

Evénements

Interviews

Marché de l’emploi

Marketing

Réseaux et Systèmes

SEO

Web

Candidats

Emploi par région

Emploi par métier

Emploi par technologie

Emploi par industrie

Emploi par type de contrat

Tous les emplois

Fiches métiers informatiques

Support

Nous contacter

Vous êtes recruteur ?

A Propos

Conditions générales d’utilisation

Politique de confidentialité

Droit d’accès aux données 

personnelles

Social

Facebook

Twitter

Linkedi

Nos Services

S’inscrire

Annonces

Évènements

Tests

Magazine

Salon LesJeudis

Les Jeudis

© 2021 Groupe Les Jeudis