Students Save 30%! Learn & create with unlimited courses & creative assets Students Save 30%! Save Now
Advertisement
  1. Web Design
  2. Figma
Webdesign

Συμβουλές για Διανυσματικά Στοιχεία στο Figma

by
Difficulty:BeginnerLength:ShortLanguages:
This post is part of a series called Figma Tips and Tricks.
Figma Image Tips
Figma Component Tips

Greek (ελληνικά) translation by Iris Diakoumi (you can also view the original English article)

Συμβουλές για Διανύσματα στο FigmaΤα διανύσματα είναι ένα σημαντικό μέρος οποιασδήποτε εφαρμογής σχεδιασμού UI ή προτυποποίησης και το Figma έχει το δικό της ισχυρό και μοναδικό σύνολο από εργαλεία για διανύσματα. Εδώ είναι μερικές γρήγορες συμβουλές και κόλπα για να σας βοηθήσουν να τα χρησιμοποιήσετε πιο αποτελεσματικά.

Παρακολουθήστε τις Συμβουλές

1. Χρησιμοποιήστε Δίκτυα Διανυσμάτων για Πολύπλοκα Σχήματα

To Figma έχει ορισμένα εξαιρετικά και μοναδικά χαρακτηριστικά για διανύσματα, ένα από τα οποία είναι τα "δίκτυα διανυσμάτων" του.

Για παράδειγμα, αν έχετε ένα σύνθετο πολύγωνο σαν ένα αστέρι, επιλέξτε το, στη συνέχεια, πατήστε το κουμπί Edit Object για να επεξεργαστείτε τους κόμβους και μονοπάτια του. Κανονικά, σε όλες τις άλλες εφαρμογές σχεδίασης διανυσμάτων, ένας κόμβος μπορεί να έχει όχι περισσότερο από δύο γραμμές που προέρχονται από αυτό. Το Figma, ωστόσο, μας επιτρέπει να χρησιμοποιήσουμε το εργαλείο Pen για να σχεδιάσουμε επιπλέον γραμμές από κάθε σημείο, ίσως ακόμη και να ενώσουμε δύο σημεία. Ρίξτε μια ματιά στο screenshot παρακάτω για να δείτε πώς κάθε ένας από τους εσωτερικούς κόμβους έχει τρεις γραμμές που προέρχονται από αυτό, δημιουργώντας ουσιαστικά ένα πρόσθετο σχήμα εντός του αρχικού πολυγώνου.

Use Figmas Vector Networks for Complex Shapes

2. Επικολλήστε Κώδικα SVG Άμεσα

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

Paste SVG Code Directly
Επικολλήθηκε

3. Αντιγράψτε Διανύσματα ως Κώδικα SVG

Επιλέξτε οποιοδήποτε διανυσματικό στοιχείο μέσα στο σχέδιό σας και, στη συνέχεια, κάντε δεξί κλικ για να εμφανιστεί ένα αναδυόμενο μενού. Πηγαίνετε στο Copy as > Copy as SVG και, στη συνέχεια, θα έχετε τον κώδικα SVG στο πρόχειρο σας, έτοιμο να τον επικολλήσετε σε οποιοδήποτε web project σας.

Copy Vectors as SVG Code in Figma
Αντιγράφηκε

Πόροι Μάθησης για το Figma

Αυτές ήταν μερικές γρήγορες συμβουλές για να δουλέψετε με διανυσματικά στοιχεία στο Figma. Για να σας βοηθήσουμε να πάτε τις γνώσεις σας στο επόμενο επίπεδο έχουμε μια σειρά μαθημάτων για το Figma στο Tuts+:

Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.