Εισαγωγή στο Figma: Το Buddy μετατρέπει τις εικόνες, το HTML, το σχέδιο Claude, τα πρωτότυπα Claude και τους ιστότοπους σε επίπεδα

Reading Time: 6 minutes

Οι εργασίες σχεδιασμού δεν ξεκινούν πλέον από ένα μέρος.

Μερικές φορές η πρώτη ιδέα είναι ένα πρωτότυπο Claude Design. Μερικές φορές είναι ένα τεχνούργημα του Claude. Μερικές φορές είναι ένα πείραμα HTML, ένα στιγμιότυπο οθόνης, μια σελίδα προορισμού που αγαπάτε ή ένας ζωντανός ιστότοπος από τον οποίο θέλει να μάθει η ομάδα σας.

Το πρόβλημα δεν είναι η τεχνητή νοημοσύνη ή ο ιστός να δημιουργήσουν κάτι ενδιαφέρον. Το πρόβλημα είναι να επαναφέρουμε αυτήν την ιδέα στο μέρος όπου ο σχεδιασμός του προϊόντος συμβαίνει στην πραγματικότητα: Figma.

Το Buddy σάς επιτρέπει να εισάγετε σχεδόν οτιδήποτε στο Figma και να το μετατρέψετε σε επεξεργάσιμα επίπεδα σχεδίασης στον καμβά. Όχι ένα επίπεδο στιγμιότυπο οθόνης. Δεν είναι στατική εικόνα αναφοράς. Πραγματικά επίπεδα που μπορείτε να επεξεργαστείτε, να οργανώσετε, να βελτιώσετε και να παραδώσετε.

Install Buddy Figma Agent →

Εισαγάγετε οτιδήποτε στο Figma με το Buddy και, στη συνέχεια, συνεχίστε να σχεδιάζετε στο Figma

Το Buddy είναι ο σχεδιαστής Figma AI της Anima. Ζει μέσα στο Figma, διαβάζει τον καμβά σας και σας βοηθά να δημιουργείτε, να επεξεργάζεστε και να οργανώνετε σχέδια μέσω συνομιλίας.

Τώρα το Buddy λειτουργεί επίσης ως γέφυρα μεταξύ της εξωτερικής έμπνευσης και της ροής εργασίας Figma. Επικολλήστε ένα τεχνούργημα, εικόνα, στιγμιότυπο οθόνης, HTML ή URL και το Buddy το μετατρέπει σε επεξεργάσιμα επίπεδα Figma, ώστε να μπορείτε να συνεχίσετε τη διαδικασία σχεδίασης χωρίς να ανακατασκευάζετε χειροκίνητα κάθε καρέ.

Αυτό σημαίνει ότι μπορείτε να ξεκινήσετε από:

Αντικείμενα Claude Design, όταν θέλετε να φέρετε μια διεπαφή που δημιουργείται από AI στο Figma.
Αντικείμενα του Claude, όταν δημιουργήθηκε ένα πρωτότυπο, οθόνη ή διαδραστική ιδέα στο Claude.
Αντικείμενα HTML, όταν η σχεδίαση ξεκινά από το δημιουργημένο HTML ή ένα κωδικοποιημένο mockup.
Εικόνες και στιγμιότυπα οθόνης, όταν θέλετε να επικολλήσετε μια οπτική αναφορά και να λάβετε επεξεργάσιμα επίπεδα Figma.
Ιστότοπος URLs, όταν θέλετε να κλωνοποιήσετε έναν δημόσιο ιστότοπο στο Figma ως σχέδιο, μπορείτε να επιθεωρήσετε και να ανακατέψετε.

Η ροή εργασίας είναι απλή: φέρτε την πηγή στο Buddy, αφήστε το Anima να ερμηνεύσει την οπτική δομή και, στη συνέχεια, συνεχίστε να σχεδιάζετε απευθείας στον καμβά Figma.

Γιατί αυτό έχει σημασία: Η τεχνητή νοημοσύνη σας δίνει το πρώτο σχέδιο, το Figma σας δίνει τον έλεγχο

Τα εργαλεία AI είναι πολύ καλά στη δημιουργία πρώτων σχεδίων. Μπορούν να δημιουργήσουν έννοιες εφαρμογών, σελίδες προορισμού, πίνακες ελέγχου, ροές ενσωμάτωσης, σελίδες τιμολόγησης, εσωτερικά εργαλεία και πειράματα προϊόντων μέσα σε λίγα λεπτά.

Αλλά η επαγγελματική σχεδίαση δεν τελειώνει στο πρώτο σχέδιο. Συνήθως ξεκινάει από εκεί.

Οι ομάδες πρέπει ακόμα να επεξεργαστούν το αντίγραφο, να διορθώσουν την ιεραρχία, να εφαρμόσουν την επωνυμία, να ευθυγραμμίσουν τα κενά, να χρησιμοποιήσουν στοιχεία, να ελέγξουν τις περιπτώσεις άκρων και να προετοιμάσουν ένα αρχείο με το οποίο μπορούν πραγματικά να εργαστούν άλλοι σχεδιαστές, PM και μηχανικοί.

Γι’ αυτό έχει σημασία η εισαγωγή. Εάν μια ιδέα που δημιουργείται από την τεχνητή νοημοσύνη παραμένει κλειδωμένη μέσα σε ένα παράθυρο συνομιλίας, ένα πρόγραμμα προβολής τεχνουργημάτων, ένα στιγμιότυπο οθόνης ή μια καρτέλα προγράμματος περιήγησης, είναι δύσκολο να μετατραπεί σε μια πραγματική ροή εργασίας σχεδιασμού προϊόντος.

Το Buddy επαναφέρει αυτή την εργασία στο Figma ως επεξεργάσιμα επίπεδα, έτσι ώστε η έξοδος AI να γίνει κάτι που μπορεί να διαμορφώσει η ομάδα σας.

Εισαγάγετε τεχνουργήματα Claude Design στο Figma

Το Claude Design είναι εξαιρετικό για γρήγορη εξερεύνηση ιδεών διεπαφής χρήστη και διαδραστικών εννοιών. Μπορείτε να περιγράψετε ένα προϊόν, ένα χαρακτηριστικό ή μια σελίδα προορισμού και να αποκτήσετε γρήγορα ένα γυαλισμένο τεχνούργημα.

Αλλά αν το επόμενο βήμα είναι η αναθεώρηση σχεδίασης, η βελτίωση της επωνυμίας ή η παράδοση, η ομάδα σας χρειάζεται συνήθως το αποτέλεσμα στο Figma.

Με το Buddy, μπορείτε να φέρετε ένα τεχνούργημα Claude Design στο Figma και να συνεχίσετε από εκεί. Το Buddy αναδημιουργεί τη διεπαφή ως επεξεργάσιμα επίπεδα, ώστε να μπορείτε να προσαρμόσετε τη διάταξη, την τυπογραφία, τα χρώματα, τα κενά, τα εικονίδια και το περιεχόμενο στον καμβά.

Αυτό είναι χρήσιμο όταν ένας ιδρυτής, PM, έμπορος ή μηχανικός δημιουργεί πρώτα ένα πρωτότυπο AI και μετά θέλει ένας σχεδιαστής να το κάνει ποιοτικό στην παραγωγή.

Εισαγάγετε αντικείμενα Claude και πρωτότυπα τεχνητής νοημοσύνης

Τα τεχνουργήματα Claude μπορούν να περιλαμβάνουν περισσότερες από μία οθόνη. Μπορούν να περιέχουν καταστάσεις, πίνακες, μενού, φόρμες, πίνακες, κάρτες, κενές καταστάσεις και έννοιες πλήρους διεπαφής χρήστη.

Αντί να τραβάτε με μη αυτόματο τρόπο στιγμιότυπα οθόνης και να παρακολουθείτε το σχέδιο, επικολλήστε το τεχνούργημα στο Buddy. Το Anima το μετατρέπει σε ένα δομημένο σχέδιο Figma που μπορεί να επεξεργαστεί η ομάδα σας.

Μόλις βρεθεί στον καμβά, μπορείτε:

Διαχωρίστε τις οθόνες σε πλαίσια.
Επεξεργασία κειμένου και αντιγράφου προϊόντος.
Βελτιώστε την απόσταση και την ιεραρχία.
Αντικαταστήστε τα γενικά γραφικά με στοιχεία επωνυμίας.
Εφαρμόστε το σύστημα σχεδιασμού σας.
Προετοιμάστε το σχέδιο για αναθεώρηση ή μεταβίβαση μηχανικής.

Το πρωτότυπο της τεχνητής νοημοσύνης γίνεται το σημείο εκκίνησης και όχι ένα αδιέξοδο.

Εισαγάγετε τεχνουργήματα HTML στο Figma

Πολλά εργαλεία τεχνητής νοημοσύνης δημιουργούν πλέον το HTML ως αποτέλεσμα σχεδίασης. Αυτό μπορεί να είναι χρήσιμο για γρήγορες προεπισκοπήσεις, αλλά το HTML δεν είναι πάντα το καλύτερο μέρος για την αξιολόγηση του σχεδιασμού του προϊόντος.

Οι σχεδιαστές χρειάζονται έλεγχο καμβά. Πρέπει να μετακινήσουν επίπεδα, να συγκρίνουν επιλογές, να επιθεωρήσουν την ιεραρχία και να ευθυγραμμίσουν την εργασία με ένα σύστημα σχεδίασης.

Το Buddy βοηθάει φέρνοντας τα τεχνουργήματα HTML πίσω στο Figma. Μπορείτε να χρησιμοποιήσετε την έξοδο HTML ως πηγή και, στη συνέχεια, να τη μετατρέψετε σε επεξεργάσιμα επίπεδα Figma που μπορούν να καθαριστούν, να αναδιοργανωθούν και να γυαλιστούν.

Αυτό είναι ιδιαίτερα χρήσιμο για ομάδες που δημιουργούν πρωτότυπο κώδικα πρώτα και μετά χρειάζονται ένα κατάλληλο αρχείο σχεδίασης για συνεργασία.

Επικολλήστε μια εικόνα ή ένα στιγμιότυπο οθόνης και αποκτήστε επεξεργάσιμα επίπεδα Figma

Τα στιγμιότυπα οθόνης είναι παντού στην εργασία προϊόντων.

Ένας χρήστης στέλνει ένα στιγμιότυπο οθόνης μιας ροής που του αρέσει. Ένας συμπαίκτης μοιράζεται μια σελίδα ανταγωνιστή. Ένας PM ρίχνει μια πρόχειρη ιδέα διεπαφής χρήστη στο Slack. Ένας ιδρυτής σκιαγραφεί μια σελίδα προορισμού με ένα άλλο εργαλείο AI.

Κανονικά, αυτό το στιγμιότυπο οθόνης είναι απλώς μια αναφορά. Μπορείτε να το τοποθετήσετε στο Figma, αλλά θα πρέπει να δημιουργήσετε ξανά τη διεπαφή χρήστη με μη αυτόματο τρόπο, εάν θέλετε να το επεξεργαστείτε.

Με το Buddy, μπορείτε να επικολλήσετε μια εικόνα ή ένα στιγμιότυπο οθόνης και να το μετατρέψετε σε επεξεργάσιμα επίπεδα Figma. Το κείμενο, η διάταξη, η οπτική δομή και τα στοιχεία διεπαφής χρήστη γίνονται κάτι με το οποίο μπορείτε να εργαστείτε στον καμβά.

Αυτό εξοικονομεί το πιο ενοχλητικό μέρος της διαδικασίας: την αναδημιουργία αυτού που ήδη υπάρχει για να μπορείτε να κάνετε αλλαγές.

Κλωνοποιήστε οποιονδήποτε ιστότοπο επικολλώντας ένα URL

Η έμπνευση του ιστότοπου είναι ένα από τα πιο κοινά σημεία εκκίνησης για νέα προϊόντα και εργασίες μάρκετινγκ.

Ίσως σας αρέσει η δομή μιας αρχικής σελίδας SaaS. Ίσως θέλετε να μελετήσετε μια σελίδα τιμολόγησης. Ίσως χρειαστεί να καταγράψετε μια διάταξη πίνακα εργαλείων, μια ροή ενσωμάτωσης ή μια ενότητα σελίδας προορισμού.

Με το Buddy, μπορείτε να επικολλήσετε έναν ιστότοπο URL και να φέρετε τη σελίδα στο Figma ως επεξεργάσιμο σχέδιο. Αντί να αποθηκεύσετε ένα στιγμιότυπο οθόνης, το Buddy σάς βοηθά να αναδημιουργήσετε την οπτική δομή ως στρώματα στον καμβά.

Χρησιμοποιήστε το για να μάθετε από μοτίβα, να εξερευνήσετε εναλλακτικές, να δημιουργήσετε moodboards ή να επιταχύνετε την πρώτη έκδοση μιας νέας σελίδας. Στη συνέχεια, κάντε το δικό σας με το αντίγραφο, τα στοιχεία, την επωνυμία και την ιστορία του προϊόντος σας.

Τι παίρνετε στον καμβά Figma

Η βασική διαφορά είναι η δυνατότητα επεξεργασίας.

Το Buddy δεν τοποθετεί απλώς ένα bitmap στον καμβά. Ο στόχος είναι να σας δώσουμε ένα λειτουργικό σχέδιο Figma που μπορεί να επεξεργαστεί, να ελεγχθεί και να βελτιωθεί.

Μετά την εισαγωγή, μπορείτε να συνεχίσετε με την κανονική εργασία Figma:

Επεξεργαστείτε απευθείας το κείμενο.
Μετακίνηση και αλλαγή μεγέθους επιπέδων.
Προσαρμόστε τα χρώματα, τις γραμματοσειρές, τα κενά και την ιεραρχία.
Οργανώστε πλαίσια και τμήματα.
Εφαρμόστε Auto Layout όπου χρειάζεται.
Αντικαταστήστε τα ακατέργαστα στοιχεία με πραγματικά εξαρτήματα.
Ευθυγραμμίστε το αποτέλεσμα με το σύστημα σχεδίασής σας.

Αυτό είναι το σημείο του Buddy: ταχύτητα χωρίς απώλεια ελέγχου.

Καλύτερη ροή εργασίας για σχεδιασμό που δημιουργείται από AI

Η παλιά ροή εργασίας έμοιαζε ως εξής:

Δημιουργήστε μια ιδέα σε ένα εργαλείο AI.
Τραβήξτε στιγμιότυπα οθόνης.
Επικολλήστε στιγμιότυπα οθόνης στο Figma.
Χειροκίνητη ανακατασκευή του σχεδίου από την αρχή.
Ξεκινήστε την πραγματική εργασία σχεδιασμού.

Η ροή εργασίας Buddy είναι μικρότερη:

Δημιουργήστε ή βρείτε την πηγή: τεχνούργημα, HTML, εικόνα, στιγμιότυπο οθόνης ή URL.
Επικολλήστε το στο Buddy.
Αποκτήστε επεξεργάσιμα επίπεδα Figma.
Συνεχίστε να σχεδιάζετε στον καμβά.

Αυτό έχει σημασία γιατί περισσότερες ομάδες ξεκινούν από την τεχνητή νοημοσύνη και την έμπνευση στον ιστό, αλλά εξακολουθούν να χρειάζονται μια επαγγελματική ροή εργασίας σχεδιασμού. Το Buddy συνδέει αυτούς τους κόσμους.

Για ποιον είναι αυτό;

Το Import Anything στο Buddy είναι χρήσιμο για όποιον χρειάζεται να κινηθεί γρήγορα χωρίς να χάσει τη ροή εργασίας του Figma.

Σχεδιαστές μπορεί να μετατρέψει τις εξόδους AI και τα στιγμιότυπα οθόνης σε επεξεργάσιμα σημεία εκκίνησης.
PMs μπορεί να φέρει τεχνουργήματα του Claude ή αναφορές ιστότοπου στο Figma για σαφέστερες συζητήσεις σχετικά με τα προϊόντα.
Ιδρυτές μπορεί να μετακινηθεί από το αρχείο ιδέας σε αρχείο σχεδίασης χωρίς να αναδημιουργήσει τα πάντα χειροκίνητα.
Διαφημιστές μπορούν να κλωνοποιήσουν την έμπνευση της σελίδας προορισμού και να την προσαρμόσουν στην επωνυμία τους.
Μηχανικοί μπορεί να δημιουργήσει πρωτότυπο σε εργαλεία HTML ή AI και, στη συνέχεια, να παραδώσει το αποτέλεσμα πίσω στο σχεδιασμό.

Δεν πρόκειται για αντικατάσταση σχεδίου. Πρόκειται για την αφαίρεση του βαρετού έργου ανακατασκευής μεταξύ μιας ιδέας και ενός επεξεργάσιμου καμβά.

Δοκιμάστε να εισαγάγετε την επόμενη ιδέα σας στο Buddy

Η επόμενη εξαιρετική οθόνη προϊόντος μπορεί να ξεκινήσει σε Claude Design, ένα τεχνούργημα Claude, ένα πρωτότυπο HTML που δημιουργήθηκε, ένα στιγμιότυπο οθόνης ή έναν ιστότοπο URL.

Με το Buddy, αυτό το σημείο εκκίνησης μπορεί να γίνει επεξεργάσιμο σχέδιο Figma στην υπάρχουσα ροή εργασίας σας.

Επικολλήστε το στο Buddy, βάλτε τα στρώματα στον καμβά και συνεχίστε να σχεδιάζετε.