I loved it, and I voted for you. Best of luck. You've inspired me.
Show HN: CSS3 animation
61–70 of 101 posts
Re: Show HN: CSS3 animation
#62Earlier quoted context omitted.
Your first difficulty is also my concern / question. Are there still no IDE that can do those animations? I know that there will be in the future. But I hope it will happen soon.
I've been making a HTML5 animation app called Radi: http://radiapp.com It's a free download. (Mac only, at least for now -- there's a rudimentary Windows port that I'm hoping to finish one day.) Unlike Edge, Hype and the rest of the animator apps, Radi uses the HTML5 Canvas element for rendering. The other apps basically do element-level animation using JavaScript + CSS3, whereas Radi renders frames from scratch. Thi…
quick question: how are you able to let users render sharp lines on the canvas elem?
when we allow people to draw freehand on a HTML5 canvas, the lines invariably come out fuzzy at the edges -- not nearly as sharp as drawing lines on a native app. it's not terrible, but it is noticeable.
here is some sample code: http://jsfiddle.net/NWBV4/10/
would you mind sharing how you overcame this issue?
thanks!
Re: Show HN: CSS3 animation
#63Whenever I see these fancy "HTML5" multimedia demos, I get a little sad that others are impressed by the fact that they were made with web technologies. I know that, practically speaking, we're stuck with the current web tech for a while, but they are, quite frankly, shit for the types of tasks that we demand from them. After decades of studying & practicing computer animation in film and games, we're barely scratching the surface on the web.
Re: Show HN: CSS3 animation
#64My first thought: Nice, well done, very clean, but compared to the stuff that was being done in Flash in 2001, the bar has been lowered so substantially it's as though Flash had never existed and no one has learned anything. The Anti-Flash bias tears down memory quite easily.
But since we ARE dealing with a JavaScript and CSS3 world....
I'm really impressed with what's being done here and the possibilities that it will bring forth:
http://radiapp.com/ (this looks very promising)
http://www.greensock.com/gsap-js/
http://www.greensock.com/css3/
http://www.greensock.com/js/speed.html
The performance is so good! Check out the Mountain Dew site to see it in action: http://mountaindew.com/
(You can tell the developers who worked on the site used to be Flash Developers; it has that sort of polished flair.)
Also this: http://www.createjs.com/#!/CreateJS
And a bit of self promotion, built for the above: https://github.com/damassi/Backbone.Create
Re: Show HN: CSS3 animation
#65Whenever I see these fancy "HTML5" multimedia demos, I get a little sad that others are impressed by the fact that they were made with web technologies. I know that, practically speaking, we're stuck with the current web tech for a while, but they are, quite frankly, shit for the types of tasks that we demand from them. After decades of studying & practicing computer animation in film and games, we're barely scratchi…
[deleted]
Re: Show HN: CSS3 animation
#66My first thought: Nice, well done, very clean, but compared to the stuff that was being done in Flash in 2001, the bar has been lowered so substantially it's as though Flash had never existed and no one has learned anything. The Anti-Flash bias tears down memory quite easily. But since we ARE dealing with a JavaScript and CSS3 world.... I'm really impressed with what's being done here and the possibilities that it wi…
CreateJS in many ways seems to bring Flash/ActionScript concepts to JavaScript. I used EaselJS and PreloadJS in my Win 8 project, and in a lot of ways it felt like I was back in ActionScript (except for worrying about which page on the timeline - for better or worse).
Re: Show HN: CSS3 animation
#67My first thought: Nice, well done, very clean, but compared to the stuff that was being done in Flash in 2001, the bar has been lowered so substantially it's as though Flash had never existed and no one has learned anything. The Anti-Flash bias tears down memory quite easily. But since we ARE dealing with a JavaScript and CSS3 world.... I'm really impressed with what's being done here and the possibilities that it wi…
CreateJS in many ways seems to bring Flash/ActionScript concepts to JavaScript. I used EaselJS and PreloadJS in my Win 8 project, and in a lot of ways it felt like I was back in ActionScript (except for worrying about which page on the timeline - for better or worse).
Agreed. What impresses me most about the CreateJS suite is the ease in which you can use and interact with sprite-sheets. That's the one thing that I feel has been missing from most of the newer open-source drawing / animation libs coming out for HTML5, and really sent me back to the days when I was first learning how to animate in Flash and the joy of seeing it 'simply work' in the browser without much development time.
Easy to use, performant, JSON based, and thus interoperable with many pre-existing tools. I hope it catches on.
Re: Show HN: CSS3 animation
#68Earlier quoted context omitted.
why you keep calling Chrome the new Internet Explorer?
Because developing sites that work only in Chrome is similar to how sites used to be tailored to IE users. If we're all about interoperability and openness, having something that only works for one subset of users isn't all that open. http://www.pcmag.com/article2/0,2817,2397158,00.asp is a year old, but its message is still true: "Sure, anyone can make a site that works in Chrome, so it is open in that sense. But if…
Chrome isn't at fault for this, though. It's a combination of people wanted to test out and play with the new stuff (a good thing), and not being thorough enough to add all the extra vendor prefixes where possible (which is a waste of time on some things if it won't work anyway).
I wrote a library to abstract the code needed to access the user's webcam through the browser. I had to hold off an experimental launch for around 3 months before I could say it was widely supported, and not just by Chrome.
For experimental stuff, I don't think it's reasonable to hold back like that. It's a great way to check the robustness of an implementation, or the viability of an idea, before it becomes mainstream.
Re: Show HN: CSS3 animation
#69Earlier quoted context omitted.
I've been making a HTML5 animation app called Radi: http://radiapp.com It's a free download. (Mac only, at least for now -- there's a rudimentary Windows port that I'm hoping to finish one day.) Unlike Edge, Hype and the rest of the animator apps, Radi uses the HTML5 Canvas element for rendering. The other apps basically do element-level animation using JavaScript + CSS3, whereas Radi renders frames from scratch. Thi…
quick question: how are you able to let users render sharp lines on the canvas elem? when we allow people to draw freehand on a HTML5 canvas, the lines invariably come out fuzzy at the edges -- not nearly as sharp as drawing lines on a native app. it's not terrible, but it is noticeable. here is some sample code: http://jsfiddle.net/NWBV4/10/ would you mind sharing how you overcame this issue? thanks!
You probably need to offset the line coordinates by (0.5, 0.5).
This is because the Canvas path coords describe the center points through which the stroke will be painted. So a vertical black line drawn through the coordinate (100, 100) wirh line width of 1 will render so that its minimum x coord is 99.5 and maximum x is 100.5. Since most render targets are 1:1 mapped to actual display pixels with antialiasing, what you get is two pixels of 50% black. To get one pixel of 100% black, the coordinate should fall right in the middle of the display pixel, i.e. 100.5 in this example.
Hopefully that makes some sense (typed on a phone...)
Re: Show HN: CSS3 animation
#70It crashed immediately on my browser (Firefox 17 on Win7).