Monday, March 04, 2013

For web developers that swim and read this blog: virtual lane graphics for swimming with css3

CSS is an acronym for Cascading Style Sheets which are nothing more than a text document or two created by web developers to explicitly detail how a users web browser should present the content. HTML is about structure, CSS is about presentation. That is the easiest way I can explain it; hope I did not lose you.

Here is a tutorial on how to do this effect for you own local meet using CSS3.

From XYK: 
Pretty cool stuff. These 'virtual graphics' for sports always intrigue me because there is practically zero time to edit it into the shot. Everything has to be done in real-time. Graphics like this also appear in many other high-profile sporting events like the Super Bowl and the World Series, where the ball is tracked three-dimensionally live.

Now, my school just happened to be hosting a swimming meet between several other schools. We were going to broadcast and record it anyway, so I thought I might as well try to recreate the graphics. In the end, what I came up with was pretty much visually the same as the one you see in the Olympics.


No comments: