Sådan konverteres håndtegnede webstedslayouts til HTML-kode ved hjælp af Sketch2Code af Microsoft

Har du nogensinde spekuleret på, hvor fedt det ville være bare at tegne noget på et papir og lade det komme til live i den virkelige verden? Nå, det er bare noget, Microsoft har opnået med den AI-drevne Skletch2Code-webapp, som kan konvertere håndskrevne tegninger fra et whiteboard til HTML-websteder med et klik på en knap.

Sketch2Code kan konvertere ethvert håndtegnet layout af en hjemmeside til HTML på få sekunder. Værktøjet bruger Microsofts Computer Vision AI-tjeneste til at detektere HTML-objekter i en tegning og bruger derefter tekstgenkendelse til at udtrække den håndskrevne tekst i tegningen for at kombinere og bygge HTML-uddrag af alle designelementerne i billedet.

Dette gør det sindssygt hurtigt for webdesignere og udviklere at bygge HTML-prototyper af en hjemmeside i mange forskellige stilarter i løbet af få sekunder. Hvis du er interesseret i at vide, hvordan dette fungerer i backend, skal du sørge for at læse de tekniske detaljer om Sketch2Code på Microsofts hjemmeside.

Nedenfor er en hurtig vejledning til at vise dig, hvor nemt det er at bruge Sketch2Code til at konvertere hjemmesidelayouttegninger til rigtige HTML-sider.

Først skal du tegne et layout af din hjemmeside på en tavle eller et hvidt ark. Tag derefter et billede af det og gem det på din computer. Klik derefter på knappen nedenfor for at åbne Sketch2Code-webappen i din browser.

Start Sketch2Code Web App

Når du har åbnet hjemmesiden, skal du klikke på Upload design knappen og vælg billedet af hjemmesidens layout, som du har tegnet på en tavle eller et hvidt ark.

Efter at have uploadet det håndtegnede webstedsdesign, læn dig tilbage og se Sketch2Code bruge AI automatisk generere en HTML-side baseret på layoutet i det billede, du uploadede.

Når processen er færdig, vil du blive vist en forhåndsvisning fra den nygenererede HTML-side sammen med muligheden for at downloade den fulde kode. Klik på Download din HTML-kode knappen for at få .html-filen til dit håndtegnede webstedslayout, så du kan teste og forhåndsvise det lokalt i din webbrowser.

Det er det. Vi håber, at Sketch2Code sparer dig tid med at lave prototyper til et websidelayout.

Kategori: Web