Trang web HTML5 giới thiệu 48 bản demo giết chết tiềm năng
Vì vậy, bạn đã nghe tất cả các tin đồn về HTML5 sẽ chiếm lấy Adobe Flash. Mặc dù hầu hết cộng đồng web tranh luận rằng điều đó có thể xảy ra hay không, bạn phải đi lang thang điều gì làm cho HTML5 trở nên mạnh mẽ đến mức ngay cả công ty khổng lồ Apple cũng muốn sử dụng nó để thay thế Flash.
Đó là lý do tại sao bài đăng này tồn tại, chúng tôi sẽ không nói về những gì HTML5 có thể làm, nhưng hiển thị các bản demo trực tiếp về những điều kỳ diệu mà HTML5 có thể đạt được với ngôn ngữ khác như JavaScript, vì vậy hãy sẵn sàng để được truyền cảm hứng.
Lưu ý: Vì HTML5 không được hỗ trợ đầy đủ bởi một số trình duyệt web nhất định như Internet Explorer, bạn nên sử dụng trình duyệt Firefox để xem tất cả các bản trình diễn HTML5 bên dưới.
Hoạt hình
Phần tử canvas của HTML5 là yếu tố quyết định để HTML5 thay thế hoạt hình Flash nhất định. Nó cho phép bạn xây dựng kết xuất động, có thể tạo kịch bản của các hình dạng 2D và hình ảnh bitmap bằng Javascript, mà theo nghĩa khác là hoạt hình có thể điều khiển được.
Hoạt hình Audioburst
Một hình ảnh động thoải mái và tuyệt vời được tạo bằng thẻ canvas và âm thanh của HTML5.
Bể bóng
Được giới thiệu trong sự kiện I / O cuối cùng của Google, bản demo này cho bạn thấy HTML5 có thể năng động như thế nào.
Sallad Blob
Một sinh vật được sinh ra từ HTML5 sẽ làm hài lòng bạn.
Bomomo
Với Bomomo, bạn có thể quan sát chuyển động nguyên tử khác nhau được mô phỏng bằng HTML5.
Trình duyệt bóng
Hãy ngạc nhiên với quả bóng HTML5 'trình duyệt chéo' này.
Bong bóng
Hãy vui vẻ bằng cách tạo ra các bong bóng nổi vô tận với màu sắc khác nhau.
Phim hoạt hình Canvas
Một phim hoạt hình HTML5 đơn giản và hài hước giúp bạn hiểu được yếu tố canvas của HTML5 có thể làm gì.
Mát mẻ
Đồng hồ analog đẹp, có thể tùy chỉnh được xây dựng bởi HTML5 và JavaScript.
Trình chiếu Flickr PS3
Xem ảnh trên Flickr của bạn với trình chiếu kiểu PS3 trong trình duyệt web.
Polaroid tương tác
Một bản demo tương tác hoạt động khá giống với giao diện cảm ứng đa điểm.
Pháo hoa JS
Tận hưởng khoảnh khắc pháo hoa với trọng lực và tốc độ yêu thích của bạn, được cung cấp bởi HTML5 và Javascript.
kính vạn hoa
Kính vạn hoa HTML5 rất đẹp và tương lai.
Hạt lỏng
Hoạt hình hạt nhạy cảm phản ứng dựa trên chuyển động chuột của bạn.
Máy nghiền
Một bản demo HTML5 nhạy cảm và nổi bật khác cho thấy các yếu tố lân cận phản ứng với chuyển động chuột của bạn như thế nào.
Tinh vân đám mây
Bị lạc với tinh vân HTML5 tuyệt vời này.
Thị sai
Xem tất cả các hình dạng 2D trong phối cảnh song song.
Hoạt hình hạt
Một hình ảnh động HTML5 thanh lịch có thể tạo thành thông điệp ưa thích của bạn.
Lan tràn
Bị lạc với hoạt hình lây lan vô tận này.
Ngôi sao
Một hình ảnh động ngôi sao HTML5 rất thú vị sẽ thay đổi hướng và tốc độ dựa trên chuyển động chuột của bạn.
Phá hủy video
Một cú nhấp chuột để phát video đang phát.
Dạng sóng
Quan sát cách sóng canvas của HTML5 di chuyển bằng cách thay đổi biên độ, bước sóng, chiều rộng, v.v..
Hiệu ứng 3D
Ấn tượng bởi hoạt hình vải? Đó là yếu tố canvas hơn của HTML5 có thể làm được và nó được gọi là hiệu ứng 3D. Nhà phát triển có thể dựa vào yếu tố canvas, DOM và JavaScript để tạo hiệu ứng 3D, sau này có thể được phát triển thành hoạt hình hoặc trò chơi 3D.
Canvas3D và Flickr
Có trải nghiệm 3D hoàn toàn mới với photostream của Flickr.
Mô phỏng vải
Mô phỏng vải thực tế, dựa trên HTML5.
Quái vật tiến hóa
Quan sát một con quái vật tiến hóa thành một sinh vật phức tạp, một trong những người tạo ra nó là HTML5.
Hộp quà tặng của Google
Công cụ tìm kiếm khổng lồ Google được trình bày dưới dạng 3D, có thể chơi được.
Chạm vào JS
Chương trình giới thiệu '3D trên 2D Canvas' chất lượng cao và thực tế.
Trình bày dữ liệu
Mặc dù phần tử canvas của HTML5 có thể được sử dụng để tạo hiệu ứng động và hiệu ứng 3D, nhưng nó cũng có thể được triển khai để trình bày dữ liệu toán học.
Gnuplot
Gnuplot, một ứng dụng vẽ dữ liệu trong phiên bản HTML5.
Máy chiếu
RGraph cung cấp một loạt các bản trình bày dữ liệu như biểu đồ thanh, thanh tiến trình và biểu đồ radar truyền thống.
Ứng dụng web
Cuối cùng, bằng cách sử dụng tất cả các khả năng được kết hợp bởi HTML5 và ngôn ngữ khác, người ta có thể tạo ứng dụng tương tác hoặc trò chơi gần với ứng dụng Flash.
CanvasPaint
Chứng kiến anh trai của Microsoft Paint đi vào trình duyệt web của bạn và cha anh ta là HTML5.
CanvasMol
Một ứng dụng khoa học được xây dựng để giúp bạn hiểu cấu trúc của một số yếu tố trái đất.
Phim hoạt hình xây dựng
Vẽ hình ảnh hoạt hình thú vị với người xây dựng phim hoạt hình tối thiểu và tương tác này.
Kéo bất cứ điều gì ở đây
Kéo bất cứ thứ gì bạn có thể kéo trong bản demo để hiển thị chi tiết.
Phác thảo
Một ứng dụng HTML5 gốc cho phép bạn tạo một số bản vẽ cơ bản có thể được lưu thành các định dạng hình ảnh khác nhau như jpeg hoặc png.
Vật lý
Vẽ bất cứ thứ gì bạn thích và xem cách chúng phản ứng với trọng lực mô phỏng.
Bảng vẽ phác thảo
Một ứng dụng vẽ HTML5 mạnh mẽ cho phép bạn vẽ và chỉnh sửa hình ảnh của mình một cách chính xác.
Smalltalk
Một ứng dụng web xác nhận vị trí địa lý của thông điệp liên quan đến thời tiết có được từ Twitter, do đó hình thành chúng thành bản đồ 'thời tiết xã hội' dựa trên vải, khá tầm thường (như tác giả đã nêu) nhưng thú vị.
Trò chơi
3 chán
Bạn sẽ không bao giờ cảm thấy nhàm chán nếu bạn có thể tiếp tục trốn hàng trăm viên đạn HTML5 trong giây tiếp theo.
Đột phá
Đập bóng để phá vỡ tất cả các viên gạch.
Bức tranh vải
Không hẳn là một trò chơi, nhưng nó cho thấy cách HTML5 có thể được sử dụng để phát triển trò chơi trình duyệt First Person Shoot.
Bắt nó
Bạn có thể né được bao nhiêu quả bóng để có được hình vuông HTML5 chiến thắng của mình?
Phản ứng dây chuyền
Xâu chuỗi vụ nổ để đạt được mục tiêu, đừng nghiện.
Khối lập phương
Chơi Tetris ở chế độ 3D, từ trên xuống.
etchaPhysics
Vẽ vật phẩm để di chuyển quả bóng tới ngôi sao, đừng quên trọng lực.
Trò chơi lắp hình
Nhấp, xoay và thả các mảnh ghép để giải câu đố ghép hình dựa trên HTML5 này.
Trượt Puzzle
Trượt đến chiến thắng, một trò chơi HTML5 khác được xây dựng để vắt kiệt tâm trí của bạn.
Cùng một trò chơi
Xóa nhóm nhất định để nhóm khác được ghép cùng màu và cuối cùng bạn sẽ được trao chiến thắng.
Tetris
Một trong những trò chơi kinh điển nhất được đưa vào cuộc sống bởi HTML5.
Torus
Một trò chơi Tetris khác trong phiên bản giả 3D.
Phần kết luận
Giới hạn của HTML5 là gì? Tại thời điểm này, chúng tôi không thể quyết định, nhưng với video ấn tượng dưới đây, chúng tôi có thể biết HTML5 đã được đẩy bao xa:
Vâng, đó là Quake II trong trình duyệt web, vì vậy bây giờ rất rõ ràng rằng với HTML5, ứng dụng web đột phá hơn sẽ được sinh ra để phục vụ hàng tỷ người dùng internet. Nó nhanh, đang phát triển và nó đang thay đổi thế giới web. Câu hỏi là, bạn sẽ sử dụng HTML5 thay đổi trò chơi này như thế nào?
Chúng tôi muốn nghe ý kiến của bạn!
