Jak przekonwertować ręcznie rysowane układy witryn internetowych na kod HTML za pomocą Sketch2Code firmy Microsoft?

Czy zastanawiałeś się kiedyś, jak fajnie byłoby po prostu narysować coś na papierze i pozwolić mu ożyć w prawdziwym świecie? Cóż, to jest właśnie coś, co Microsoft osiągnął dzięki aplikacji internetowej Skletch2Code opartej na sztucznej inteligencji, która jednym kliknięciem może konwertować odręczne rysunki z tablicy na strony HTML.

Sketch2Code może przekonwertować dowolny ręcznie narysowany układ strony internetowej na HTML w zaledwie kilka sekund. Narzędzie wykorzystuje usługę Computer Vision AI firmy Microsoft do wykrywania obiektów HTML na rysunku, a następnie wykorzystuje rozpoznawanie tekstu do wyodrębnienia odręcznego tekstu z rysunku, aby połączyć i zbudować fragmenty kodu HTML wszystkich elementów projektu na obrazie.

To sprawia, że ​​projektanci stron internetowych i programiści niesamowicie szybko mogą tworzyć prototypy HTML witryny w wielu różnych stylach w ciągu kilku sekund. Jeśli chcesz wiedzieć, jak to działa w backendzie, koniecznie przeczytaj szczegóły techniczne dotyczące Sketch2Code na stronie Microsoftu.

Poniżej znajduje się krótki samouczek, który pokaże Ci, jak proste jest użycie Sketch2Code do konwersji rysunków układu witryny na prawdziwe strony HTML.

Najpierw narysuj układ swojej witryny na tablicy lub białej kartce. Następnie zrób mu zdjęcie i zapisz na swoim komputerze. Następnie kliknij poniższy przycisk, aby otworzyć aplikację internetową Sketch2Code w przeglądarce.

Uruchom aplikację internetową Sketch2Code

Po otwarciu witryny kliknij Prześlij projekt i wybierz zdjęcie układu strony, które narysowałeś na tablicy lub białej kartce.

Po przesłaniu odręcznego projektu strony internetowej usiądź wygodnie i obejrzyj, jak Sketch2Code używa AI automagicznie generuje stronę HTML na podstawie układu w przesłanym obrazie.

Po zakończeniu procesu zostanie wyświetlony podgląd świeżo wygenerowanej strony HTML wraz z opcją pobrania pełnego kodu. Kliknij na Pobierz swój kod HTML przycisk, aby pobrać plik .html z ręcznie narysowanym układem witryny, dzięki czemu można go przetestować i podglądać lokalnie w przeglądarce internetowej.

Otóż ​​to. Mamy nadzieję, że Sketch2Code zaoszczędzi czas na prototypowaniu układu strony internetowej.