John Ryding | Projects

Shakespeare's Playground

An exploration I made to experiment with HTML5 syntax and @font-face.

Nocturnal Blacksburg

An experiment with CSS3 gradients and masks

OpenGL Animation Tool

An animation engine I wrote for an OpenGL class I took during college.

< Back

Shakespeare's Playground

Demo
Source Code

As of 11/2011, Shakespeare's Playground if best viewed in Webkit (Chrome or Safari) or Firefox browsers.

This project was my first real foray into playing with HTML5 and CSS technologies. Shakespeare's Playground was started as an assignment from a college class to explore what type of interactions we could come up with given a set of Shakespeare's plays compiled into an XML format.

The UI of the project was influenced by the use of the Essays-1743 font in Mark Pilgrim's Dive into HTML5 web site. I also tried to mimic the "coda slider" effect used on a number of different websites to try to give the page a "wow" factor when I presented the page to my class.

< Back

Nocturnal Blacksburg

Demo
Source Code

The original concept for this project was to view how the town of Blacksburg, VA changes from day to night.

To achieve the mouseover effect, I used a combination of webkit's CSS3 support for masks and gradients. As such, this demo will only work in Chrome and Safari.

< Back

OpenGL Animation Tool

Source Code

This is an OpenGL-based animation engine I wrote for one of my college classes. I designed it to use the technique of capturing keyframes of a robot and interpolating the position of the robot's limbs during playback. To help with the interpolation, I use Hermite Curves to determine the position of points.