Coming Soon Machine - Animated HTML5 Template
This is one of my flash animations re-designed to HTML5 with help of CreateJS. Hand-drawn animated letters “coming soon” with customizable logo integrated on tv-screen, jQuery countdown timer, 2 skins (light and dark). Cartoon retro-styled mechanism animation centered in browser window. Your logo is clickable with custom URL.
Download free Flash version
on my website:
Features:
- Classic cartoon frame-by-frame animation with countdown timer.
- Ready to upload index.html page with animation centered in browser.
- 2 Skins (light and dark).
- Archive include original flash animation .FLA and photoshop .PSD sources.
- Dummy page with static picture for IE8 and older versions.
- Detailed help file and commented code.
Notes:
Due to CreateJS requires the HTML5 Canvas, which is not available for IE8 and other older browsers, in this theme I add dummy fallback page with non-animated .jpg machine picture and alert message.
Hope you enjoy this file, and take a few seconds to rate and share this item.
Thanks!
Credits:
Fonts Roboto and Sniglet from Google Fonts http://www.google.com/fonts/
CreateJS http://www.createjs.com/
jQuery Countdown Plugin by Keith Wood http://keith-wood.name/countdown.html
http://yepnopejs.com/
CHECK ALSO THIS GREAT PRODUCTS FROM OUR TEAM:
Premium Multi-Purpose
Wordpress Theme – TheGem:
Premium Multi-Purpose
Wordpress Theme – SCALIA:
Premium Multi-Purpose
Wordpress Theme – CODEUS:
Sorry, preview not possible now due to my hosting server temporary down, hope it will fixed soon…
ReplyDeleteFixed and working now, welcome to preview!
ReplyDeleteYou are one seriously clever guy !
ReplyDeleteThanks, Australia!
ReplyDeleteThis is amazing man!!!! Respect. Just VideoHive and CodeCanyon left for Envato to be ruled by you You rock.
ReplyDeleteThanks, Rameau, share it!
ReplyDeleteThat takes the cake=) Stunning template and genious animations/illustration. GLWS, zemlyak
ReplyDeleteP.S. And welcome to TF
Regards,
Evgeny
Thanks a lot, Evgeny, share if you can!
ReplyDeleteSure
ReplyDeleteLooks awesome!
ReplyDeleteThanks, djjeep!
ReplyDeletehi i am trying to use this inside a div tag and seems like it breaking up
ReplyDeletebasically i don’t want to display this as a stand alone page but as a section of a page
i.e to show that a certain feature of a website is coming soon (hence i would not like it to colour my whole background and appear in a fixed section)
any clue on how i can achive that
all the help will be highly apperciated
I’m trying to open the “index.html” in my browser, but the only thing that appears is the background.
ReplyDeleteHi! You need to upload this to server, not locally, read documentation before, please.
ReplyDeleteCool mate!
ReplyDeleteThe drunken needle of the first “o” in the word soon is nicely done.
And the rest as well of course.
Cheeeeers
Yeah, thanx, UJ-pro!
ReplyDeleteAwesome. I saw this before in activeden.
ReplyDeleteCould you please tell me how you convert that flash to html5? do you use any kind of program to do this? or what ?
Hello, thanx, I use CreateJS for this.
ReplyDeleteand Flash Toolkit For CreateJS
ReplyDeleteGreat Look Great Work;
ReplyDeleteThanks!
ReplyDeleteHi I have just purchased this theme, it’s amazing! But I was just wondering if there’s anyway of uploading it onto Wordpress as a Zip file?
ReplyDeleteHi! I don’t know about wordpress zip uploading, this is html template.
ReplyDeleteHello! I purchased this, I was wondering how can I integrate it to my Wordpress theme?
ReplyDeleteHello, I have not tried to set up this html template into wordpress, please search info about creating custom 503 pages for wp, for example here http://zoerooney.com/blog/tutorials/easy-branded-downtime-using-maintenance-mode-503-php-in-wordpress/ or may be without plugins using .htaccess, I don’t know exactly.
ReplyDeleteThank you!
ReplyDeleteHey I couldn’t figure out a way to upload it to my WP since it’s not installing successfully. So I decided to upload it on Youtube with my logo. However, the Adobe Flash CS6 is opening broken graphics (with one compressed layer). Is that normal?
ReplyDeleteHi this is not flash, this is themeforest HTML5 template made with createjs, please read file description carefully. Flash version you can find at activeden here http://activeden.net/item/coming-soon-machine-xmlcustomizable/124807
ReplyDeleteThank you for this! Can I kindly request the Flash version then? I will not use the HTML5, nor do I have the intention or the capacity to do so. Of course I can re-purchase it (it’s $5!). But given the misunderstanding from my part, it would be a sign of goodwill if you grant me this switch. Please advise
ReplyDeleteOk, contact me via form in my profile
ReplyDeleteReceived! Thank you so much for your understanding and professionalism.
ReplyDeletehi how do i change inside color of tv box cause my logo is not visable properly and tell ,me how to change day and time
ReplyDeleteHi, to change color open logo.psd from folder ‘Sources’, then change color of layer ‘Back’, then save logo as png to folder ../For_Upload/Light(or Dark)/Images/.. To change day and time please refer to documentation:
ReplyDeleteSetup countdown timer in script.js (lines 204-209):
austDay = new Date(2013, 3 – 1, 6);
or:
austDay = new Date(austDay.getFullYear() + 1, 3 – 1, 6);
See full description of countdown timer plugin here on author’s site: http://keith-wood.name/countdown.html
can u make this Template for arabic language ?
ReplyDeleteSorry, this is not in near plans
ReplyDeletei mean make it right to left
ReplyDeleteI want to buy this theme but I want an email sign up form. Does it come with one or do the HTML files come with the purchase of the theme along with the ability to post the social media icons? Please answer soon, wanna buy NOW!!!
ReplyDeleteHello, I love your work!
ReplyDeleteI was not able to set the contdown, I just can not understand.
how do I set that every 48h start over?
I know that this is the guide:
http://keith-wood.name/countdown.html
here I do not understand anything … sorry.