Αναρωτηθήκατε ποτέ πόσο ωραίο θα ήταν να σχεδιάσετε κάτι σε ένα χαρτί και να το αφήσετε να ζωντανέψει στον πραγματικό κόσμο; Λοιπόν, αυτό είναι ακριβώς κάτι που έχει επιτύχει η Microsoft με την εφαρμογή Ιστού Skletch2Code με τεχνητή νοημοσύνη, η οποία μπορεί να μετατρέψει χειρόγραφα σχέδια από έναν πίνακα σε ιστότοπους HTML με ένα κλικ ενός κουμπιού.
Το Sketch2Code μπορεί να μετατρέψει οποιαδήποτε διάταξη ενός ιστότοπου που σχεδιάστηκε με το χέρι σε HTML μέσα σε λίγα δευτερόλεπτα. Το εργαλείο χρησιμοποιεί την υπηρεσία Computer Vision AI της Microsoft για τον εντοπισμό αντικειμένων HTML σε ένα σχέδιο και στη συνέχεια χρησιμοποιεί την αναγνώριση κειμένου για την εξαγωγή του χειρόγραφου κειμένου στο σχέδιο για να συνδυάσει και να δημιουργήσει αποσπάσματα HTML όλων των στοιχείων σχεδίασης στην εικόνα.
Αυτό καθιστά εξαιρετικά γρήγορο για τους σχεδιαστές και τους προγραμματιστές ιστοσελίδων να δημιουργούν πρωτότυπα HTML ενός ιστότοπου σε πολλά διαφορετικά στυλ μέσα σε λίγα δευτερόλεπτα. Εάν ενδιαφέρεστε να μάθετε πώς λειτουργεί αυτό στο backend, φροντίστε να διαβάσετε τις τεχνικές λεπτομέρειες σχετικά με το Sketch2Code στον ιστότοπο της Microsoft.
Παρακάτω είναι ένα γρήγορο σεμινάριο για να σας δείξει πόσο απλό είναι να χρησιμοποιήσετε το Sketch2Code για να μετατρέψετε σχέδια διάταξης ιστότοπου σε πραγματικές σελίδες HTML.
Αρχικά, σχεδιάστε μια διάταξη του ιστότοπού σας σε έναν πίνακα ή σε ένα λευκό φύλλο. Στη συνέχεια, τραβήξτε μια φωτογραφία και αποθηκεύστε την στον υπολογιστή σας. Μετά από αυτό, κάντε κλικ στο κουμπί παρακάτω για να ανοίξετε την εφαρμογή Ιστού Sketch2Code στο πρόγραμμα περιήγησής σας.
Εκκινήστε την εφαρμογή Ιστού Sketch2Code
Μόλις ανοίξετε τον ιστότοπο, κάντε κλικ στο Μεταφόρτωση σχεδίου και επιλέξτε την εικόνα της διάταξης του ιστότοπου που σχεδιάσατε σε λευκό πίνακα ή λευκό φύλλο.
Αφού ανεβάσετε τη σχεδίαση του ιστότοπου με το χέρι, καθίστε αναπαυτικά και παρακολουθήστε το Sketch2Code να χρησιμοποιεί το AI να δημιουργεί αυτόματα μια σελίδα HTML με βάση τη διάταξη στην εικόνα που ανεβάσατε.
Μόλις ολοκληρωθεί η διαδικασία, θα εμφανιστεί μια προεπισκόπηση από τη σελίδα HTML που δημιουργήθηκε πρόσφατα μαζί με την επιλογή λήψης του πλήρους κώδικα. Κάνε κλικ στο Κατεβάστε τον κώδικα HTML σας κουμπί για να λάβετε το αρχείο .html της διάταξης του ιστότοπού σας που σχεδιάστηκε με το χέρι, ώστε να μπορείτε να το δοκιμάσετε και να το κάνετε προεπισκόπηση τοπικά στο πρόγραμμα περιήγησής σας.
Αυτό είναι. Ελπίζουμε το Sketch2Code να σας εξοικονομήσει χρόνο στη δημιουργία πρωτοτύπων διάταξης ιστοσελίδας.