Video players both HTML5 and flash-based are becoming more popular. Faster Internet connections are leading towards a full technological breakthrough all around the world. We are now able to share content with people in almost every country – and streaming video is one of the cornerstones to Internet media.
I want to look into just a few video player styles from some popular social networking websites. Of course YouTube is known as one of the titans in the industry. But there are some other savvy companies and startups which are pushing the boundaries for online video players. The user interface design is a very important concept and it is worth a deeper study.
The Romanian social networking website Trilulilu has been online for a long time. Their features allow users to upload photos, audio, and video contents which are stored and streamed out of their servers. What I especially like about their webpage design is the custom media player styles which match up perfectly to the website’s branding.
If you check out the bottom interface buttons you will see they are all flush and square with each other. Everything is organized very neatly and precise. Some videos will come with an HD button for streaming in high definition. You also have access to a side menu for swiping between similar videos or other types of popular media.
I do not think Trilulilu has found the perfect video player solution. But I greatly admire their current design because it just works. And that is all you can ever ask for when building & launching your new projects online. You just need everything to work properly and stay online, then update as you go along. Trilulilu is a good example of stability when crafting a working video player.
The video player styles on Dailymotion are more familiar and related to the general format of other similar Flash players. Each video page will have a small lightbulb icon for dimming the background – just like we used to have on YouTube. This is nice if you do not want to make the player fullscreen since all the text and featured videos will be hidden in contrast.
All of the buttons and icons are translucent for being hidden over the player. I also like how these videos are naturally bigger than other sources. Just because you can put something fullscreen doesn’t mean that the player itself should be resized smaller than natural. What I like most about Dailymotion is their modern design essence. You can look and understand what theme their designers are going for. Dailymotion is an excellent choice for mirroring videos hosted on other places, since they can stream out to a worldwide audience.
The niconico Japanese video network is extremely popular overseas. Quite obviously the majority of content is from Japan and features Japanese users, music, pop culture, and other similar references. My biggest problem with the website is that you must sign up for an account to watch any videos.
Obviously the signup process is completely free. But it can still be a major annoyance when you consider that other similar networks do not require such restrictions. The video player itself is made for the user. Each of the buttons is very large, making it easy to click and easy to determine what it does. The video scrubber bar is a bit smaller than the other icons. But it is still easy to access and skip along to different parts in the video.
I think it is worth considering all of the different features on a video player before determining which are worthwhile and which are not. You have to think about your own needs and how your website can function at its best. Unfortunately I have yet to find the perfect answer, but just keep trying and you are bound to figure out a great UI design for your next project.
Not every web developer will need to manage videos. The Internet is a very diverse place with lots of different types of media. But for those who are interested you have to keep yourself digging for better ideas and better design concepts. I hope this article may introduce just a few ideas to help on future projects. Also feel free to share other web video players & resources in the post comments.