HTML5 Παρουσίαση Ιστοσελίδας 48 Δυνατότητες Δόσεων που Σκοτώνουν Φλας

Έτσι, έχετε ακούσει όλες τις φήμες για το HTML5 θα αναλάβει Adobe Flash. Ενώ η περισσότερη κοινότητα του ιστού υποστηρίζει ότι είναι πιθανή ή όχι, πρέπει να περιπλανηθείτε αυτό που κάνει το HTML5 τόσο ισχυρό ώστε ακόμα και η γιγαντιαία εταιρεία Apple να θέλει να το χρησιμοποιήσει για να αντικαταστήσει το Flash.

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

Σημείωση: Καθώς το HTML5 δεν υποστηρίζεται πλήρως από ορισμένα προγράμματα περιήγησης ιστού, όπως ο Internet Explorer, συνιστάται ιδιαίτερα να χρησιμοποιήσετε το πρόγραμμα περιήγησης Firefox για να δείτε όλες τις επίδειξη HTML5 παρακάτω.

Κινουμένων σχεδίων

Το στοιχείο καμβά HTML5 είναι ο αποφασιστικός παράγοντας για την αντικατάσταση HTML5 από κάποια animation Flash. Σας επιτρέπει να δημιουργήσετε δυναμική, σκηνοθετημένη απόδοση 2D σχημάτων και bitmap εικόνων με Javascript, η οποία με άλλο τρόπο είναι, ελεγχόμενη κινούμενη εικόνα.

Audioburst Animation

Μια άνετη και φανταστική κίνηση που δημιουργήθηκε με τον καμβά και την ετικέτα ήχου του HTML5.

Πισίνα μπάλα

Παρουσιάζοντας το τελευταίο συμβάν Google I / O, αυτή η επίδειξη σας δείχνει πόσο δυναμική είναι η HTML5.

Blob Sallad

Ένα δημιουργημένο με HTML5 πλάσμα που θα σας ικανοποιήσει.

Bomomo

Με το Bomomo, μπορείτε να παρατηρήσετε διαφορετική ατομική κίνηση που προσομοιώνεται με HTML5.

Μπάλα περιήγησης

Αποκτήστε έκπληξη με αυτή την μπάλα HTML5 με το "cross-browser".

Φυσαλίδες

Διασκεδάστε δημιουργώντας ατελείωτες επιπλέουσες φυσαλίδες με διαφορετικό χρώμα.

Κινούμενα σχέδια καμβά

Ένα απλό και αστείο κινούμενο σχέδιο HTML5 που σας βοηθά να καταλάβετε τι μπορεί να κάνει το στοιχείο καμβά HTML5.

Coolclock

Ένα ωραίο, προσαρμόσιμο αναλογικό ρολόι που κατασκευάστηκε από HTML5 και JavaScript.

Flickr PS3 Slideshow

Δείτε τις φωτογραφίες του Flickr με τη διαδοχική προβολή στυλ PS3 στο πρόγραμμα περιήγησης ιστού.

Διαδραστικό Polaroid

Ένα διαδραστικό demo που λειτουργεί αρκετά παρόμοια με το interface multi touch.

JS Fireworks

Απολαύστε τη στιγμή της πυροτεχνίας με την προτιμώμενη βαρύτητα και ταχύτητα, που τροφοδοτείται από HTML5 και Javascript.

Καλειδοσκόπιο

Ένα πολύ ωραίο και φουτουριστικό καλειδιοσκόπιο HTML5.

Υγρά σωματίδια

Ευαισθησία σε κινούμενα σωματίδια που αντιδρά με βάση την κίνηση του ποντικιού σας.

Υπνωτίζων

Ένα άλλο ευαίσθητο και εξαιρετικό demo HTML5 που δείχνει πώς τα παρακείμενα στοιχεία αντιδρούν με την κίνηση του ποντικιού σας.

Νεφέλωμα σύννεφο

Χαθείτε με αυτό το θαυμάσιο νεφέλωμα HTML5.

Παράλλαξη

Δείτε όλα τα σχήματα 2D σε παράλληλη προοπτική.

Κινούμενα σωματίδια

Ένα κομψό animation σωματιδίων HTML5 που μπορεί να διαμορφωθεί στο αγαπημένο σας μήνυμα.

Διάδοση

Χαθείτε με αυτό το απέραντο animation.

Starfield

Ένα πολύ cool animation starfield HTML5 που θα αλλάξει την κατεύθυνση και την ταχύτητα με βάση την κίνηση του ποντικιού σας.

Καταστροφή βίντεο

Ένα κλικ για να ανεβεί ένα βίντεο αναπαραγωγής.

Κυματομορφή

Παρατηρήστε πώς κινείται το κυματοειδές κύμα του HTML5 μεταβάλλοντας το εύρος, το μήκος κύματος, το πλάτος κλπ.

3D Effect

Εντυπωσιασμένος από κινούμενα σχέδια σε καμβά; Αυτό μπορεί να κάνει περισσότερο το στοιχείο καμβά του HTML5 και ονομάζεται εφέ 3D. Ο προγραμματιστής μπορεί να βασιστεί σε στοιχείο καμβά, DOM και JavaScript για να δημιουργήσει 3D αποτέλεσμα, το οποίο αργότερα μπορεί να εξελιχθεί σε 3D animation ή game.

Canvas3D και Flickr

Έχετε μια εντελώς νέα 3D εμπειρία με τη φωτογράφηση του Flickr.

Προσομοίωση πανιών

Μια ρεαλιστική, βασισμένη σε HTML5 προσομοίωση πανιών.

Εξέλιξη τέρας

Παρατηρήστε ένα τέρας που εξελίσσεται σε ένα περίπλοκο πλάσμα, ένας από τους δημιουργούς του είναι το HTML5.

Κουπόνι δώρου Google

Giant μηχανή αναζήτησης Η Google παρουσιάζεται σε προβολή 3D, με δυνατότητα αναπαραγωγής.

JS Touch

Μια υψηλής ποιότητας και ρεαλιστική προβολή 3D για 2D καμβά.

Παρουσίαση δεδομένων

Ενώ το στοιχείο του καμβά HTML5 μπορεί να χρησιμοποιηθεί για να δημιουργήσει κινούμενα σχέδια και εφέ 3D, μπορεί επίσης να εφαρμοστεί για να παρουσιάσει μαθηματικά δεδομένα.

Gnuplot

Gnuplot, μια εφαρμογή σχεδίασης δεδομένων σε έκδοση HTML5.

RGraph

Το RGraph παρέχει ένα ευρύ φάσμα παρουσίασης δεδομένων όπως το διάγραμμα ράβδων, την μπάρα προόδου και το παραδοσιακό διάγραμμα ραντάρ.

Εφαρμογή ιστού

Τελικά, χρησιμοποιώντας όλες τις δυνατότητες που συνδυάζονται με HTML5 και άλλα langauge, μπορεί κανείς να δημιουργήσει διαδραστική εφαρμογή ή παιχνίδι που βρίσκεται κοντά στην εφαρμογή Flash.

CanvasPaint

Μάρτυρας του αδελφού της Microsoft Paint έρχεται στο web browser σας, και ο πατέρας του είναι HTML5.

CanvasMol

Μια επιστημονική εφαρμογή που είναι κατασκευασμένη για να σας βοηθήσει να κατανοήσετε τη δομή ορισμένων στοιχείων του εδάφους.

Cartoon Builder

Σχεδιάστε μια ενδιαφέρουσα εικόνα κινουμένων σχεδίων με αυτόν τον ελάχιστο και διαδραστικό δημιουργό κινούμενων σχεδίων.

Σύρετε οτιδήποτε εδώ

Σύρετε οτιδήποτε μπορείτε να σύρετε στο demo για να εμφανίσετε λεπτομέρειες.

Gartic Sketch

Μια πρωτότυπη εφαρμογή HTML5 που σας επιτρέπει να κάνετε μερικά βασικά σχέδια που μπορούν να αποθηκευτούν σε διαφορετική μορφή εικόνας όπως jpeg ή png.

PhysicSketch

Σχεδιάστε ό, τι θέλετε και δείτε πώς αντιδρούν με προσομοιωμένη βαρύτητα.

Sketchpad

Μια ισχυρή εφαρμογή σχεδίασης HTML5 που σας επιτρέπει να σχεδιάζετε και να επεξεργάζεστε την εικόνα σας με τον ακριβή τρόπο.

Ψιλοκουβέντα

Μια εφαρμογή web που επιβεβαιώνει τη γεωγραφική θέση του μηνύματος που σχετίζεται με τις καιρικές συνθήκες, το οποίο αποκτάται από το Twitter, διαμορφώνοντάς το έτσι σε χάρτη με βάση τον καμβά «κοινωνικού καιρού», αρκετά ασήμαντο (όπως δηλώνει ο συγγραφέας).

Παιχνίδι

3Bored

Ποτέ δεν θα βαρεθείτε αν μπορείτε να παραβλέψετε εκατοντάδες σφαίρες HTML5 στο επόμενο δευτερόλεπτο.

Breakout

Αναποδογυρίστε την μπάλα για να σπάσετε όλα τα τούβλα.

Canvascape

Δεν είναι αρκετά ένα παιχνίδι, αλλά δείχνει πώς μπορεί να χρησιμοποιηθεί το HTML5 για την ανάπτυξη του προγράμματος περιήγησης πρώτου προσώπου.

Πιάστο

Πόσες μπάλες μπορείτε να αποφύγετε για να αποκτήσετε τη νίκη σας πλατεία HTML5?

Αλυσιδωτή αντίδραση

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

Cubeout

Παίξτε Tetris σε 3D, από πάνω προς τα κάτω.

etchaPhysics

Σχεδιάστε το στοιχείο για να μετακινήσετε την μπάλα στο αστέρι, μην ξεχάσετε τη βαρύτητα.

Παζλ

Κάντε κλικ, περιστρέψτε και ρίξτε τα κομμάτια του παζλ για να λύσετε αυτό το παζλ με βάση το HTML5.

Παζλ διαφάνεια

Σύρετε στη νίκη, ένα άλλο παιχνίδι HTML5 που έχει κατασκευαστεί για να αποσπάσει το χυμό του μυαλού σας.

Ίδιο παιχνίδι

Καταργήστε μια συγκεκριμένη ομάδα για να πάρετε μια άλλη ομάδα ζευγαρωμένη στο ίδιο χρώμα και τελικά θα απονεμηθεί μια νίκη.

Tetris

Ένα από τα πιο κλασικά παιχνίδια που έφερε πίσω στη ζωή το HTML5.

Βάση στήλης

Ακόμα ένα παιχνίδι Tetris σε ψευδο-3D έκδοση.

συμπέρασμα

Ποιος είναι ο περιορισμός του HTML5; Σε αυτό το σημείο δεν μπορούμε να αποφασίσουμε, αλλά με το εντυπωσιακό βίντεο παρακάτω μπορούμε να γνωρίζουμε πόσο μακριά έχει ωθηθεί το HTML5:

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

Μας αρέσει να ακούμε την ιδέα σας!