O Simple – Free Website PSD Template

I love freebies and when it is useful – I just download that. So here we have a very clean website template in psd format as a freebie today.

O Simple - PSD Template

My purpose

I have designed this template to write a step-by-step tutorial on how to convert a PSD into HTML5 CSS3 Website. So you can expect the same within few days.

I will be adding more views, like inner page & responsive view. So finally we will learn PSD to HTML5/CSS3 Responsive Website coding. You might want to keep your eyes around us for that.

For now, download the PSD Template and have fun.

Download

PS: Video player PSD credit to PSDHome

Top 5 Articles on HTML5 Audio Video

Learn HTML5 Audio Video

1. Everything you need to know about HTML5 video and audio

Here, Simon Pieters, from Opera, will walk you through everything basics you needed to know about HTML5 Audio & Video features. He says:

This article aims to provide all the nitty-gritty details of HTML5 media, the DOM API, events, and so forth, so you can implement your own HTML5 player with fallback to old browsers.

2. HTML5 Audio and Video: What you Must Know

Bruce Lawson talks on Nettuts+ about must know facts regarding HTML5 Audio/Video.

3. Getting started with the HTML5 Audio Video API

Very quick & a short article to get you started on making your own media players on HTML5 Video.

4. Using HTML5 Video and Audio in Modern Browsers

This time, in-depth learning on API, learn about browser fall back & how to handle those legacy browsers – from SitePoint.

5. How to Make Your Own Video Player On HTML5 Video

Once again very depth article. This article will take you thoroughly on how you can create your very own media player using HTML5 Audio & Video.

That’s it. Hope you will learn from very basic to creating your own full functional media players. Happy coding!

PS: Image used in this post banner is taken from 356PSD.com

Learning Gamification

Learning Gamification

Applying game design principles & techniques to non-game elements to increase user engagement is Gamification.

Wikipedia says:-

Gamification is the use of game design elements, game thinking and game mechanics to enhance non-game contexts.

The very best example of Gamification is FourSquare app & Nike+.  It is very very new concept so it’s a kid in our era.

Here are lists of very good place to learn more about Gamification, how you can use it today & what is the future of Gamification.

  1. Gamification –  Coursera Class
  2. Gamification & UX – Smashing Magazine article.
  3. Gamification by Designbook
  4. The Purpose of Gamification – O’Really
  5. Five Rules of Gamification – Forbes
  6. Fun is the Future – Mastering Gamification – Google TechTalks video

Hope the list above going to help you readers get more insight & details on Gamification. Have you come across any good  articles similar? Comment it down below, I will read it.

5 Beautiful Full Screen jQuery Slideshow

I have come across 5 beautiful websites that has full screen jQuery slideshow. This websites incorporates quite different & unique sliders that covers whole screen & contents are presented so nicely. I liked them all.
So, thought of sharing them with you for inspiration. Have fun folks.

1. Square

SquareUp

2. Humaan

Humaan

3. Vegas Slider

VEGAS Slideshow

4. CSS3 FullScreen

CSS3 Fullscreen Slideshow

5. Redarktorerna

Redalktorerna

Have you come across anything similar? Let me know in comments.

A blog about internet!