“This amazing feat in design comes to us thanks to HTML5 and CSS guru Vasiliy Zubach, also known as TjRus,” Drew Olanoff reports for TNW.
“I’m not sure if Zubach was just bored or someone dared him to do it, but he has rendered an iPhone 4 completely in CSS3,” Olanoff reports. “That means there are no images in his design whatsoever.”
Olanoff reports that Zubach used “3,395 lines of CSS and 335 lines of Javascript” to create his iPhone 4. See it here.
Read more in the full article here.
Apple is touting its Vision Pro spatial computing headset which was made available in the U.S. earlier this year to businesses…
Even if the iPhones looked good enough for resale, Apple’s contract with its recycler GEEP explicitly required that every product it sent be…
The “Delta” Nintendo game emulator launched Wednesday as one of the first officially approved iOS apps to emulate Nintendo consoles…
Apple TV+ announced Thursday that “Sunny,” its 10-episode mystery thriller with a darkly comic bent starring Rashida Jones, is set to…
Major Apple supplier TSMC, the world’s largest chipmaker and a major Apple and Nvidia supplier, forecast second-quarter sales may…
That is extraordinary! He has way too much time on his hands. He set the bar pretty high.
Good luck doing the same with Flash.
It would have been easy enough to do in Flash, by a Flash expert (as this CSS3 was done by an HTML5/CSS/JS expert). But, this proves that interactive content does not need to rely on that resource-hogging technology.
However, the question is whether this was hand-coded or built using an HTML5/JS/CSS application builder. I suspect hand-coded, which is impressive, but indicates that building interactive HTML5 is still not as easy as available Flash development tools.
There are quite few utilities which automate/convert designs into code — even from Adobe. So it is not necessary that this was done manually. However, I doubt that any software utility of today would allow to do this on this level, so the guy probably had to do a lot of manual fixing and fine tuning.
The linked article refers to the creator as an “HTML and CSS guru”. Web development is part of my repertoire too, I’ve seen some of the mess that code generation tools produce, and a quick glance at the relevant Javascript and CSS code (and his bio) on the page suggests that except for the jQuery libraries, he wrote most if not all of that code it by hand.
He should have made an iPhone 4s.
Or at least the 32gig model anyway.
siri doesn’t even work! wtf!
Good lord.
Don’t knock it. This is a good example that its possible to do this without FLASH! We all know that without exploring possibilities, we all go stagnant. Now the next step is to develop tools to allow engineers/coders/developers/designers to take it to the next level. Get rid of FLASH once and for all.
Sorry, It is still a power hog. Just tried interacting with this “iPhone 4” on my iPhone 4S. A very sucky. Try it out yourself.
Yeah, I tried opening it in Safari on my 4S and it crashed Safari, taking all my open tabs with it (I tried restarting, but it led me to Bookmarks instead of reopening my previously open tabs). I tried loading the page again when the only open tab had that on it and it crashed again.
Impressive, but WHY??? 😀
Just a demo of both CSS3/Javascrips (via JQuery) and his own professionalism.