Media Cases

100% vector media cases exported as PNG and built into a simple, responsive HTML/CSS framework.

The v1 release of this project is available on GitHub.

A project I've been working on since about 2005-ish (off and on). This was initially intended for my own personal use to catalog my growing (400+) video game collection. Basically, a few years ago I built a website containing meta data and a simple list of games I own / pre-ordered (so I don't buy duplicates).

The master plan was to have a visually appealing way to display the games, so this project took off in the last few months.

It just so happened I had a growing collection of game cases I created in vector here and there. I then built a simple HTML/CSS framework to display cover art with the appropriate case overlay. I've been using a very early version of this framework on my personal site.

I figured I'd polish it up a bit and make it public so I can reference cover sizes with ease.

TODO for v2:

- Right now all the cases are exported to PNG @1x (because that's all that was supported back in the olden days - in fact, this framework used to use blank span's and 8-bit alpha PNG for IE 6 support). Eventually I'll export all the cases as SVG and redo the framework so it looks better in retina. Some of the cases have so many complex vectors they would take up far more disk space than a flattened PNG.

- I need to clean up my source Sketch file so I don't look like a total slob, then I might add it to the repo for all to use.

- As new systems are released and as long as physical media is a thing, I'll update this project.