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

Συμβουλές για Συστατικά (Components) στο Figma

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

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

To Figma μας επιτρέπει να σχεδιάσουμε με συστατικά (components). Eπαναλαμβανόμενα αντικείμενα τα οποία συμπεριφέρονται σύμφωνα με σύνολα κανόνων που εμείς ορίζουμε. Ας δούμε μερικές συμβουλές και κόλπα που θα σας βοηθήσουν να αξιοποιήσετε στο έπακρο τα συστατικά.

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

1. Συνδυάστε Στοιχεία για να Μεταφέρετε Εύκολα Αλλαγές

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

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

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

Combine Components to Propagate Changes Easily

2. Δημιουργήστε Συμμετρία Αντιστρέφοντας Στοιχεία

Αν θέλετε να δημιουργήσετε συμμετρία ή αντικατοπτρισμό, δημιουργήστε ένα στοιχείο από το μισό από ο,τιδήποτε θέλετε να φτιάξετε. Δημιουργήστε μια δεύτερη εκδοχή κρατώντας πατημένο το ALT και τραβώντας το αρχικό, έπειτα πατήστε SHIFT + H για να αντιστρέψετε το διπλότυπο, Τώρα, όποτε αλλάζετε το πρωτότυπο, το το διπλότυπο θα αλλάζει επίσης, αλλά αντίστροφα.

Create Symmetry by Flipping Components in Figma

3. Δημιουργήστε Επαναλαμβανόμενα Μοτίβα Κάνοντας Tile σε Στοιχεία

Μπορείτε να χρησιμοποιήσετε στοιχεία για να δημιουργήσετε άψογα φόντα και επαναλαμβανόμενα μοτίβα. Ξεκινήστε δημιουργώντας ένα μεμονωμένο συστατικό πλακίδιο σε ό, τι μέγεθος σας χρειάζεται και, στη συνέχεια, δημιουργήστε περισσότερες εκδοχές, κρατώντας πατημένο το πλήκτρο ALT και σύροντας το πρωτότυπο, κατά προτίμηση μια-δυο φορές κατά μήκος κάθε άξονα. Στη συνέχεια, αλλάξτε το αρχικό πλακίδιο για να δείτε τις αλλαγές σας σε όλα τα πλακίδια, μέχρι τα μοτίβα να ταιριάζουν άψογα.

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

Create Repeating Patterns by Tiling Components

Πόροι Μάθησης για το 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.