Har du någonsin undrat hur coolt det skulle vara att bara rita något på ett papper och låta det komma till liv i den verkliga världen? Tja, det är bara något Microsoft har uppnått med den AI-drivna Skletch2Code-webbappen som kan konvertera handskrivna ritningar från en whiteboard till HTML-webbplatser med ett klick på en knapp.
Sketch2Code kan konvertera alla handritade layouter på en webbplats till HTML på bara några sekunder. Verktyget använder Microsofts Computer Vision AI-tjänst för att upptäcka HTML-objekt i en ritning, och använder sedan textigenkänning för att extrahera den handskrivna texten i ritningen för att kombinera och bygga HTML-utdrag av alla designelement i bilden.
Detta gör det vansinnigt snabbt för webbdesigners och utvecklare att bygga HTML-prototyper av en webbplats i många olika stilar på några sekunder. Om du är intresserad av att veta hur detta fungerar i backend, se till att läsa de tekniska detaljerna om Sketch2Code på Microsofts webbplats.
Nedan finns en snabb handledning som visar hur enkelt det är att använda Sketch2Code för att konvertera ritningar av webbplatslayout till riktiga HTML-sidor.
Rita först en layout av din webbplats på en whiteboard eller ett vitt ark. Ta sedan en bild av den och spara den på din dator. Därefter klickar du på knappen nedan för att öppna Sketch2Code-webbappen i din webbläsare.
Starta Sketch2Code Web App
När du har öppnat webbplatsen klickar du på Ladda upp design knappen och välj bilden av webbplatsens layout som du ritade på en whiteboard eller ett vitt ark.
Efter att ha laddat upp den handritade webbdesignen, luta dig tillbaka och se Sketch2Code använda AI automatiskt generera en HTML-sida baserat på layouten i bilden du laddade upp.
När processen är klar visas en förhandsvisning från den nygenererade HTML-sidan tillsammans med möjligheten att ladda ner hela koden. Klicka på Ladda ner din HTML-kod knappen för att få .html-filen för din handritade webbplatslayout så att du kan testa och förhandsgranska den lokalt i din webbläsare.
Det är allt. Vi hoppas att Sketch2Code sparar tid för dig när du skapar prototyper för en webbsidalayout.