Δημιουργήστε Web Animation και σχέδια αλληλεπίδρασης σε HTML 5 με το Adobe Edge

Τα πιο πρόσφατα πρότυπα ιστού, HTML5 και CSS3 σε συνδυασμό με το JavaScript έχουν μειώσει πραγματικά τον χρόνο και την προσπάθεια που απαιτείται για τη δημιουργία ιστοτόπων πλούσιων σε γραφικά, κείμενο και κινούμενα σχέδια. Χρησιμοποιώντας τις δυνατότητες του HTML5, δεν χρειάζεται πλέον να γράφετε χειροκίνητα κώδικα για την ενσωμάτωση περιεχομένου πολυμέσων, ενώ το CSS3 καθιστά τα στοιχεία διεπαφής χρήστη ιστού σας πιο ευέλικτα, στιβαρά και σημαντικά πιο εύκολο στη χρήση. Εάν αναζητάτε ένα εργαλείο σχεδίασης ιστού που σας επιτρέπει να αξιοποιήσετε στο έπακρο τα πιο πρόσφατα πρότυπα ιστού χωρίς να σας υποχρεώνει να εισαγάγετε μη αυτόματα κωδικό για κάθε στοιχείο διεπαφής χρήστη, το οποίο κυκλοφόρησε πρόσφατα Adobe Edge είναι πιθανώς ακριβώς αυτό που χρειάζεστε.

Το Adobe Edge έχει γραφτεί ιδιαίτερα για σχεδιαστές οπτικών, διαδικτύων και αλληλεπιδράσεων που συχνά αγωνίζονται με τη δημιουργία διαδικτυακής κίνησης και κινούμενου περιεχομένου χρησιμοποιώντας πρότυπα ιστού HTML5, CSS3 και JavaScript. Είναι βασικά ένα εργαλείο σχεδίασης κίνησης και αλληλεπίδρασης ιστού για τη δημιουργία κινούμενου περιεχομένου χρησιμοποιώντας HTML5, CSS3 και JavaScript. Ενώ ενσωματώνει όλα τα βασικά εργαλεία για τη δημιουργία, επεξεργασία, τροποποίηση και σχεδίαση των στοιχείων διεπαφής χρήστη Ιστού, αυτό προσφέρει έναν διαισθητικό χορογράφο κινουμένων σχεδίων για να δημιουργείτε και να προσαρμόζετε εύκολα κινούμενο περιεχόμενο στον ιστό σας σελίδα. Επιπλέον, δεν σας υποχρεώνει να ξεκινήσετε ένα νέο έργο από το μηδέν, μπορείτε να εισαγάγετε το αρχείο HTML σε αυτό για να συμπεριλάβετε νέο UI συνθέσεις και αναπαράσταση με υπάρχοντα στοιχεία διεπαφής χρήστη, όπως, πίνακας, στυλ κειμένου, αποχρώσεις εικόνας, θέση, γραμματοσειρά, κοντέινερ ευθυγράμμιση και άλλα.

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

Το παράθυρο Elements σάς επιτρέπει να εμφανίσετε / αποκρύψετε το επιλεγμένο στοιχείο και να το κλειδώσετε για να αποτρέψετε την περαιτέρω επεξεργασία. Όταν επιλέγετε ένα στοιχείο από την κύρια οθόνη, το επισημαίνει αμέσως στο παράθυρο Elemen, καθιστώντας ευκολότερο να το αποκρύψετε ή να το κλειδώσετε. Όταν τοποθετείτε το δείκτη του ποντικιού πάνω από ένα στοιχείο που αναφέρεται στο Elements, σας λέει τα αρχικά της κατηγορίας με το όνομα, ώστε να μπορείτε εύκολα να το αναγνωρίσετε στο αρχείο CSS.

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

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

Εκτός από τη δημιουργία συμβατού με προγράμματα περιήγησης κινούμενου περιεχομένου για όλα τα ευρέως δημοφιλή προγράμματα περιήγησης ιστού, συμπεριλαμβανομένου του Firefox, Το Chrome, ο Internet Explorer 9, το περιεχόμενο ιστού που δημιουργείται μέσω αυτού του εργαλείου θα λειτουργεί απρόσκοπτα σε πλατφόρμες iOS και Android πολύ. Σύμφωνα με την επίσημη κοινότητα, το Edge Preview βρίσκεται σε ενεργή ανάπτυξη και σύντομα θα ενημερωθεί με πολλές δυνατότητες. Το Adobe Edge λειτουργεί σε Windows Vista και Windows 7.

Λήψη του Adobe Edge