NS Music Video Awards 2009 Screenshot

I’ve been working on another award show for one of the sites I own and run; N-S.Net. This time it’s an award show for music videos created by the fans of Chlex (Chloe Sullivan and Lex Luthor pairing from the TV series Smallville).

On the website you can see a list of nominees, read and comment on news articles, nominate a video or video maker, vote on your favourites and see the winners in each category.

Most of the action happen backstage, in the administrative control panel. The entire site, including the frontend which the normal users see, is based upon a PHP and MySQL script I’ve built from scratch by the help of tutorials and online code bits.

When an user sends in a nomination or comments on a news article, it ends up in the control panel for approval.

N-S Music Video Awards 2009 Admin Panel

Here I can easily see all the nominations, in the case of the screenshot to the left, the author/maker of the video, the category in which they have been nominated in, when they were nominated and some quick controls for approved/hidden, edit and delete the entry.

All of this is stored in a mySQL database, which allows me to work more freely online, without having to manually edit files. This also allows me to have staff helping me with the day-to-day tasks such as approval of nominees and comments.

All of this is made in PHP and MySQL, and I’m always trying to make the script better, more secure and more user friendly in hopes that I can use it for more projects than just my hobby-based projects.

Pixel Perfect is a Firefox/Firebug extension that allows web developers and designers to easily overlay a web composition over top of the developed HTML.

By toggling the composition on and off, the developer can visually see how many pixels they are off in development. Pixel Perfect also has an opacity option so that you can view the HTML below the composition. By being able to see both the composition and the HTML you can now simultaneously use Firebug while Pixel Perfect is still in action.

I have yet to test it out, but it sounds awesome, especially for designers to make sure their design is properly implemented. And you can check your own design, to make sure all of your margins and paddings are exactly as Photoshop’ed! Simply brilliant!

Check it out and download the plugin if you’re interested from http://www.pixelperfectplugin.com!

Paper prototyping (from wiki):

Paper prototyping is a widely used method in the user-centered design process, a process that helps developers to create software that meets the user’s expectations and needs -- in this case, especially for designing and testing user interfaces. It is throwaway prototyping and involves creating rough, even-hand sketched, drawings of an interface to use as prototypes, or models, of a design.

www.youtube.com/watch?v=WFDq95zHJIg