"Hacking" Αρχή: 9 πράγματα που νομίζατε ότι δεν θα μπορούσατε να κάνετε

Αρχή έχει περάσει από το να είναι το νέο παιδί στο μπλοκ στο go-to εργαλείο για το animation-heavy prototyping. Πιστεύουμε ότι το κλειδί για την επιτυχία του είναι ότι μιλάει την ίδια γλώσσα με τους σχεδιαστές. Είναι πολύ παρόμοιο με το Sketch, Keynote και After Effects που κάνουν να αισθάνεται αμέσως εξοικειωμένο όταν το ανοίγει για πρώτη φορά.

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

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

Η Αρχή της κοινότητας του Facebook έχει δημοσιεύσει μερικά εξαιρετικά παραδείγματα για αυτό, και κάναμε και κάποιους "hacking" οι ίδιοι. Τσέκαρέ το:

3D

Το 3D δεν υποστηρίζεται, αλλά μπορείτε σίγουρα να το ψεύσετε χρησιμοποιώντας έξυπνα προγράμματα οδήγησης, όπως καταδεικνύει ο André Goncalves.

από τον André Gonçalves

Ζωντανέψτε τα οργανικά σχήματα

Τα σχήματα στην αρχή βασίζονται σε ορθογώνια με στρογγυλεμένες γωνίες. Ενώ αυτό λειτουργεί καλά στις περισσότερες περιπτώσεις, μπορεί να είναι δύσκολο να επιτευχθεί ένα κινούμενο σχέδιο με μια οργανική αίσθηση σε αυτό. Σε αυτό το παράδειγμα το Σκίτσο χρησιμοποιήθηκε για να δημιουργήσει τα οργανικά σχήματα. Με την τροποποίηση αυτών στην Αρχή, χρησιμοποιώντας προγράμματα οδήγησης, μπορείτε να προσομοιώσετε ένα φαινόμενο jello.

από το Hike One | PRD

Θόλωμα φόντου πάνω από το βίντεο

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

από το Hike One | PRD

Ολίσθηση με άκρη

Το χτύπημα άκρων δεν είναι επίσημο γεγονός στην Αρχή. Μπορείτε, ωστόσο, να τοποθετήσετε μια αόρατη λωρίδα (πλάτους περίπου 10px) στην άκρη του artboard σας. Είναι αρκετά μικρό ώστε να μην παρεμποδίζει οποιαδήποτε άλλα διαδραστικά στοιχεία στη σελίδα. Χρησιμοποιήστε αυτό το στοιχείο για να οδηγήσετε τις σελίδες που πρέπει να μεταφερθούν και να προσθέσετε ένα συμβάν DragEnd για να προωθήσετε την άλλη οθόνη.

από το Hike One | PRD

Περιορίστε ένα draggable στρώμα

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

από τον Carl BI

Δημιουργήστε μια εμπειρία τηλεόρασης μεγάλης οθόνης

Δυστυχώς, δεν υπάρχει ακόμα υποστήριξη για τα βασικά γεγονότα τύπου. Αυτό καθιστά δύσκολη τη δημιουργία ενός πρωτοτύπου για ένα UI τηλεόρασης. Ένα εύκολο εναλλακτικό είναι να δημιουργήσετε μια απομακρυσμένη οθόνη και να την τοποθετήσετε δίπλα στο πρωτότυπο σας. Αν θέλετε να δοκιμάσετε το πρωτότυπο σας σε μια πραγματική τηλεόραση απλά ανοίξτε το πρωτότυπο σε ένα iPad και AirPlay σε μια τηλεόραση Apple. Τώρα σπρώξτε πίσω και χρησιμοποιήστε το iPad ως απομακρυσμένο κατά την προβολή του πρωτοτύπου στην τηλεόραση. Φυσικά, το UI θα είναι επίσης ορατό στο iPad σας ενώ το τηλεχειριστήριο είναι ορατό στη μεγάλη οθόνη. Θα τα ξεχάσετε πιο γρήγορα από ό, τι νομίζετε.

από το Hike One | PRD

Διπλό κλικ συμβάν

Το διπλό κλικ δεν είναι ένα επίσημο γεγονός στην Αρχή, αλλά είναι πραγματικά πολύ εύκολο να το δημιουργήσετε μόνοι σας όπως φάνηκε από τον Daniel Hooper. Επειδή είναι ένα έθιμο με διπλό κλικ μπορείτε να ρυθμίσετε ακόμη και την ταχύτητα.

από τον Daniel Hooper

Δημιουργήστε έναν κυκλικό φορτωτή

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

από τον Kieran Black

Μεταβείτε στα συμβάντα που βασίζονται

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

από το Hike One | PRD

Μελανοταινίες

Οι κυματισμοί μελάνης, όπως χρησιμοποιούνται στο Σχεδιασμό Υλικού της Google, επιβεβαιώνουν την εισαγωγή των χρηστών, επεκτείνοντας άμεσα το εξωτερικό από το σημείο επαφής. Δυστυχώς, η Αρχή δεν είναι σε θέση να αναγνωρίσει ποιο μέρος του κουμπιού σας χτυπήσει. Μπορείτε να ψεύσετε αυτό το φαινόμενο όμως με την τοποθέτηση πολλαπλών εξαρτημάτων κυματισμού μέσα σε ένα κουμπί. Ένα συμβάν Down touch στο εσωτερικό του εξαρτήματος θα ενεργοποιήσει την κυμάτωση που είναι πιο κοντά στην είσοδο αφής σας. Χρησιμοποιήστε το κουμπί Επάνω στο κουμπί (ομάδα) για να μεταβείτε στον πίνακα σχεδίων στόχου.

από το Hike One | PRD

Άρθρο από τον Jimmy Goedhart, το Design Lead στο Hike One