{"id":1517,"date":"2024-04-09T11:25:13","date_gmt":"2024-04-09T11:25:13","guid":{"rendered":"https:\/\/howtogeek.blog\/it\/?p=1517"},"modified":"2024-04-09T11:25:13","modified_gmt":"2024-04-09T11:25:13","slug":"how-to-convert-hand-drawn-website-layouts-into-html-code-using-sketch2code-by-microsoft-it","status":"publish","type":"post","link":"https:\/\/howtogeek.blog\/it\/how-to-convert-hand-drawn-website-layouts-into-html-code-using-sketch2code-by-microsoft-it\/","title":{"rendered":"Come convertire layout di siti Web disegnati a mano in codice HTML utilizzando Sketch2Code di Microsoft"},"content":{"rendered":"<p>Ti sei mai chiesto quanto sarebbe bello disegnare qualcosa su un foglio e lasciarlo prendere vita nel mondo reale? Bene, questo \u00e8 solo qualcosa che Microsoft ha ottenuto con l&#8217;app web Skletch2Code basata sull&#8217;intelligenza artificiale che pu\u00f2 convertire disegni scritti a mano da una lavagna in siti Web HTML con un semplice clic di un pulsante.<\/p>\n<p>Sketch2Code pu\u00f2 convertire qualsiasi layout disegnato a mano di un sito web in HTML in pochi secondi. Lo strumento utilizza il servizio Computer Vision AI di Microsoft per rilevare oggetti HTML in un disegno, quindi utilizza il riconoscimento del testo per estrarre il testo scritto a mano nel disegno per combinare e creare frammenti HTML di tutti gli elementi di design nell&#8217;immagine.<\/p>\n<p>Ci\u00f2 rende incredibilmente veloce per i web designer e gli sviluppatori creare prototipi HTML di un sito Web in molti stili diversi in pochi secondi. Se sei interessato a sapere come funziona nel backend, assicurati di leggere i dettagli tecnici su Sketch2Code sul sito Web di Microsoft.<\/p>\n<p>Di seguito \u00e8 riportato un breve tutorial per mostrarti quanto \u00e8 semplice utilizzare Sketch2Code per convertire i disegni del layout del sito Web in vere e proprie pagine HTML.<\/p>\n<p>Prima di tutto, disegna un layout del tuo sito web su una lavagna o un foglio bianco. Quindi, scatta una foto e salvala sul tuo computer. Successivamente, fai clic sul pulsante in basso per aprire l&#8217;app Web Sketch2Code nel tuo browser.<\/p>\n<figure class=\"wp-block-image\"><\/figure>\n<p>Una volta aperto il sito web, fai clic sul pulsante <strong>Carica design<\/strong> e seleziona l&#8217;immagine del layout del sito web che hai disegnato su una lavagna o un foglio bianco.<\/p>\n<figure class=\"wp-block-image\"><figcaption>Seleziona e carica il layout del tuo sito web disegnato a mano<\/figcaption><\/figure>\n<p>Dopo aver caricato il design del sito web disegnato a mano, rilassati e guarda Sketch2Code utilizzare l&#8217;intelligenza artificiale per generare automaticamente una pagina HTML basata sul layout dell&#8217;immagine caricata.<\/p>\n<p>Una volta terminato il processo, ti verr\u00e0 mostrata un&#8217;anteprima della pagina HTML appena generata insieme all&#8217;opzione per scaricare il codice completo. Fare clic sul pulsante <strong>Scarica il codice HTML<\/strong> per ottenere il file. html del layout del tuo sito web disegnato a mano in modo da poterlo testare e visualizzare in anteprima localmente nel tuo browser web.<\/p>\n<figure class=\"wp-block-image\"><figcaption>Clicca sul pulsante \u201cScarica il tuo codice HTML\u201d.<\/figcaption><\/figure>\n<p>Questo \u00e8 tutto. Ci auguriamo che Sketch2Code ti faccia risparmiare tempo nella prototipazione del layout di una pagina web.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Ti sei mai chiesto quanto sarebbe bello disegnare qualcosa su un foglio e lasciarlo prendere vita nel mondo reale? Bene, questo \u00e8 solo qualcosa che Microsoft ha ottenuto con l&#8217;app web Skletch2Code basata sull&#8217;intelligenza artificiale che pu\u00f2 convertire disegni scritti a mano da una lavagna in siti Web HTML con un semplice clic di un [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[130,176],"class_list":["post-1517","post","type-post","status-publish","format-standard","hentry","category-how-to","tag-microsoft","tag-web"],"acf":[],"_links":{"self":[{"href":"https:\/\/howtogeek.blog\/it\/wp-json\/wp\/v2\/posts\/1517","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/howtogeek.blog\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/howtogeek.blog\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/howtogeek.blog\/it\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/howtogeek.blog\/it\/wp-json\/wp\/v2\/comments?post=1517"}],"version-history":[{"count":1,"href":"https:\/\/howtogeek.blog\/it\/wp-json\/wp\/v2\/posts\/1517\/revisions"}],"predecessor-version":[{"id":1518,"href":"https:\/\/howtogeek.blog\/it\/wp-json\/wp\/v2\/posts\/1517\/revisions\/1518"}],"wp:attachment":[{"href":"https:\/\/howtogeek.blog\/it\/wp-json\/wp\/v2\/media?parent=1517"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/howtogeek.blog\/it\/wp-json\/wp\/v2\/categories?post=1517"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/howtogeek.blog\/it\/wp-json\/wp\/v2\/tags?post=1517"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}