What better way to begin the new year here on Beautiful Pixels by showcasing this absolutely mind-blowing example of intricate CSS3 craftsmanship by Pedro Ivo Hudson. ‘The Good Man’ is a project undertaken by the 24-year-old Brazilian for his final year as a Graphic Design major.
About the project, Pedro writes:
The Good Man is about visual transcription of a narrative.
Transformed into HTML elements and animated in CSS3, this project aims its efforts to build an animation, in a web browser.Without images, just web fonts and shapes, it’s intended to run smoothly in modern web browsers and to be as scalable as possible.
The project uses the track of the same name by Husky Rescue and presents a stunning, mesmerizing portrayal of some of the best CSS3 animations that I’ve ever come across. These aren’t any random animations put together in CSS. The animations follow the lyrics of the song and Pedro has done an amazing job illustrating what is being said in the lyrics and showing them on the screen. It manages to push the boundaries of what kinds of animations today’s modern browsers are capable of running.
The project is so good, it’s insane. Go ahead and check it out here.