01 από 05
Προσθήκη του βίντεο στο Adobe Muse
Η πολύ ενδιαφέρουσα πτυχή του Adobe Muse είναι ότι σας επιτρέπει να δημιουργείτε ιστοσελίδες χρησιμοποιώντας μια παρόμοια ροή εργασίας με εκείνη που χρησιμοποιείται για τη διαμόρφωση των εκδόσεων. Δεν χρειάζεστε μια βαθιά κατανόηση του κώδικα που δημιουργεί έναν ιστότοπο ή μια σελίδα, αλλά η εξοικείωση με HTML5, CSS και JavaScript δεν θα βλάψει.
Παρόλο που το παραδοσιακό βίντεο web προστίθεται συνήθως μέσω της χρήσης του HTML5 Video API, το Adobe Muse ολοκληρώνει το ίδιο πράγμα με αυτό που ονομάζει "widgets". Τα widgets δημιουργούν το HTML 5 που απαιτείται για συγκεκριμένες εργασίες, αλλά χρησιμοποιούν μια διεπαφή απλής γλώσσας στο Muse για να γράψουν τον κώδικα όταν δημοσιευτεί η σελίδα.
Σε αυτή την άσκηση, πρόκειται να χρησιμοποιήσουμε ένα widget που μπορείτε να το κατεβάσετε δωρεάν από το Muse Resources. Όταν κάνετε λήψη του γραφικού στοιχείου, το μόνο που χρειάζεται να κάνετε είναι να ανοίξετε το αρχείο .zip και να κάνετε διπλό κλικ στο αρχείο .mulib στο φάκελο βίντεο πλήρους οθόνης. Αυτό θα το εγκαταστήσει στο αντίγραφο του Adobe Muse.
02 του 05
Πώς να προετοιμάσετε μια σελίδα για το βίντεο φόντου στο Adobe Muse CC
Με το widget εγκατεστημένο, μπορείτε τώρα να δημιουργήσετε τη σελίδα που θα χρησιμοποιήσει το βίντεο.
Πριν ξεκινήσετε, δημιουργήστε ένα φάκελο για τον ιστότοπό σας Muse. Μέσα σε αυτόν τον φάκελο δημιουργήστε έναν άλλο φάκελο - χρησιμοποιώ " media " - και μετακινήστε τις mp4 και webm εκδόσεις του βίντεο σε αυτόν το φάκελο.
Όταν εκκινήσετε το Muse, επιλέξτε Αρχείο> Νέα τοποθεσία . Όταν ανοίγει το παράθυρο διαλόγου Διάταξη, επιλέξτε Επιφάνεια εργασίας ως αρχική διάταξη και αλλάξτε τις τιμές του πλάτους σελίδας και του ύψους σελίδας σε 1200 και 900 . Κάντε κλικ στο κουμπί OK .
Κάντε διπλό κλικ στην Κύρια Σελίδα στην προβολή Πλάνου για να ανοίξετε τη Βασική σελίδα. Όταν ανοίγει η κύρια σελίδα, μετακινήστε τους οδηγούς κεφαλίδας και υποσέλιδου στην κορυφή και στο κάτω μέρος της σελίδας. Δεν χρειάζεστε πραγματικά Header και Footer για αυτό το παράδειγμα.
03 του 05
Πώς να χρησιμοποιήσετε το Widget οθόνης φόντου πλήρους οθόνης στο Adobe Muse CC
Η χρήση του γραφικού στοιχείου είναι απλή. Το πρώτο πράγμα που πρέπει να κάνετε είναι να επιστρέψετε στην Προβολή Πλάνου επιλέγοντας Προβολή> Λειτουργία Προγραμματισμού . Όταν ανοίξει η προβολή σχεδίου, κάντε διπλό κλικ στην Αρχική σελίδα για να την ανοίξετε.
Ανοίξτε τον πίνακα Βιβλιοθήκη - εάν δεν είναι ανοιχτό στη δεξιά πλευρά του παραθύρου επιλέξτε Παράθυρο> Βιβλιοθήκη - και σύρετε προς τα κάτω τον φάκελο βίντεο [MR] πλήρους οθόνης . Σύρετε το γραφικό στοιχείο στο φάκελο στη σελίδα.
Θα παρατηρήσετε ότι οι Επιλογές σας ζητούν να εισαγάγετε τα ονόματα των εκδόσεων mp4 και webm των βίντεο. Εισαγάγετε τα ονόματα ακριβώς όπως είναι γραμμένα στο φάκελο όπου τα τοποθετήσατε. Ένα μικρό τέχνασμα για να βεβαιωθείτε ότι δεν κάνετε λάθος είναι να αντιγράψετε το όνομα του βίντεο mp4 και να το επικολλήσετε στις περιοχές MP4 και WEBM του μενού Επιλογές .
Ένα άλλο τέχνασμα: Αυτό το widget κάνει είναι να γράψετε τον κώδικα HTML 5 για εσάς. Μπορείτε να το πείτε επειδή βλέπετε το <> στο γραφικό στοιχείο. Σε αυτήν την περίπτωση, μπορείτε να τοποθετήσετε το widget της ιστοσελίδας στο πακέτο και θα συνεχίσει να λειτουργεί. Με αυτόν τον τρόπο δεν παρεμβαίνει σε κανένα περιεχόμενο που θα τοποθετήσετε στη σελίδα.
04 του 05
Πώς να προσθέσετε βίντεο και να δοκιμάσετε μια σελίδα στο Adobe Muse CC
Παρόλο που έχετε προσθέσει τον κώδικα που θα αναπαράγει τα βίντεο, η Muse εξακολουθεί να μην έχει ιδέα για το πού βρίσκονται αυτά τα βίντεο. Για να το διορθώσετε, επιλέξτε Αρχείο> Προσθήκη αρχείων για μεταφόρτωση . Όταν ανοίξει το παράθυρο διαλόγου Upload, μεταβείτε στο φάκελο που περιέχει τα βίντεό σας, επιλέξτε τα και κάντε κλικ στην επιλογή Άνοιγμα . Για να βεβαιωθείτε ότι έχουν μεταφορτωθεί, ανοίξτε τον πίνακα "Ενεργές" και θα πρέπει να δείτε τα δύο σας βίντεο. Απλώς αφήστε τα στον πίνακα. Δεν χρειάζεται να τοποθετηθούν στη σελίδα.
Για να δοκιμάσετε το έργο, επιλέξτε Αρχείο> Προεπισκόπηση σελίδας στο πρόγραμμα περιήγησης ή, επειδή πρόκειται για μία σελίδα, επιλέξτε Αρχείο> Προεπισκόπηση τοποθεσίας στο πρόγραμμα περιήγησης . Το προεπιλεγμένο πρόγραμμα περιήγησης θα ανοίξει και το βίντεο - στην περίπτωσή μου μια τροπική καταιγίδα - θα αρχίσει να παίζει.
Σε αυτό το σημείο, μπορείτε να επεξεργαστείτε το αρχείο Muse ως κανονική ιστοσελίδα και να προσθέσετε περιεχόμενο στην Αρχική σελίδα και το βίντεο θα αναπαραχθεί κάτω από αυτό.
05 του 05
Πώς να προσθέσετε ένα πλαίσιο αφίσας βίντεο στο Adobe Muse CC
Αυτός είναι ο ιστός που μιλάμε εδώ και, ανάλογα με την ταχύτητα σύνδεσης, υπάρχει μια καλή πιθανότητα ο χρήστης να ανοίξει τη σελίδα και να κοιτάξει σε κενή οθόνη ενώ φορτώνει το βίντεο. Αυτό δεν είναι καλό. Εδώ είναι πώς να ασχοληθεί με αυτό το κομμάτι της επιδείνωση.
Είναι μια "Βέλτιστη πρακτική" για να συμπεριλάβετε ένα πλαίσιο αφίσας του βίντεο, το οποίο θα εμφανιστεί ενώ φορτώνεται το βίντεο. Αυτό είναι συνήθως ένα στιγμιότυπο οθόνης πλήρους μεγέθους ενός πλαισίου από το βίντεο.
Για να προσθέσετε το πλαίσιο αφίσας, κάντε κλικ μία φορά στην επιλογή " Περιηγητής πληρώστε" στο επάνω μέρος της σελίδας. Κάντε κλικ στο σύνδεσμο Εικόνα και μεταβείτε στην εικόνα που θέλετε να χρησιμοποιήσετε. Στην περιοχή Συνδυασμός , επιλέξτε Κλίμακα για να συμπληρώσετε και κάντε κλικ στο κεντρικό σημείο στην περιοχή Θέση . Αυτό θα διασφαλίσει ότι η εικόνα θα κλιμακώνεται πάντα από το κέντρο της εικόνας όταν αλλάζει το μέγεθος του παραθύρου προβολής του προγράμματος περιήγησης. Θα δείτε επίσης ότι η εικόνα συμπληρώνει τη σελίδα.
Ένα άλλο μικρό τέχνασμα είναι τουλάχιστον να έχει ένα στερεό-όχι λευκό-πλήρωση χρώμα μόνο σε περίπτωση που το πλαίσιο αφίσα χρειάζεται λίγο χρόνο για να εμφανιστεί. Για να το κάνετε αυτό, κάντε κλικ στο τσιπ χρώματος για να ανοίξετε το Muse Color Picker. Επιλέξτε το εργαλείο σταγονόμετρου και κάντε κλικ σε ένα κυρίαρχο χρώμα στην εικόνα. Όταν τελειώσετε, κάντε κλικ στη σελίδα για να κλείσετε το παράθυρο διαλόγου Browser Fill.
Σε αυτό το σημείο, μπορείτε να αποθηκεύσετε το έργο ή να το δημοσιεύσετε.