Come convertire layout di siti Web disegnati a mano in codice HTML utilizzando Sketch2Code di Microsoft

Come convertire layout di siti Web disegnati a mano in codice HTML utilizzando Sketch2Code di Microsoft

Ti sei mai chiesto quanto sarebbe bello disegnare qualcosa su un foglio e lasciarlo prendere vita nel mondo reale? Bene, questo è solo qualcosa che Microsoft ha ottenuto con l’app web Skletch2Code basata sull’intelligenza artificiale che può convertire disegni scritti a mano da una lavagna in siti Web HTML con un semplice clic di un pulsante.

Sketch2Code può 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’immagine.

Ciò 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.

Di seguito è riportato un breve tutorial per mostrarti quanto è semplice utilizzare Sketch2Code per convertire i disegni del layout del sito Web in vere e proprie pagine HTML.

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’app Web Sketch2Code nel tuo browser.

Una volta aperto il sito web, fai clic sul pulsante Carica design e seleziona l’immagine del layout del sito web che hai disegnato su una lavagna o un foglio bianco.

Seleziona e carica il layout del tuo sito web disegnato a mano

Dopo aver caricato il design del sito web disegnato a mano, rilassati e guarda Sketch2Code utilizzare l’intelligenza artificiale per generare automaticamente una pagina HTML basata sul layout dell’immagine caricata.

Una volta terminato il processo, ti verrà mostrata un’anteprima della pagina HTML appena generata insieme all’opzione per scaricare il codice completo. Fare clic sul pulsante Scarica il codice HTML 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.

Clicca sul pulsante “Scarica il tuo codice HTML”.

Questo è tutto. Ci auguriamo che Sketch2Code ti faccia risparmiare tempo nella prototipazione del layout di una pagina web.

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *