July 19, 2005: A challenge for socially-minded graphic designers: design the interface for new, open-source internet TV software. We are a non-profit organization building a software platform that will allow anyone to broadcast and watch channels of high-resolution internet video (learn more). We want to create a serious, independent alternative to commercial television that gives everyone access. If you believe that our technology and approach have a real chance to democratize mass media, then we need you to help us design our software at a level that rivals any proprietary, corporate media platform.
Just as coding open-source software lets us build on work that's been done by programmers around the world, we're hoping that this contest will let us bring together brilliant design ideas from many different contributors. With a healthy awareness of the risks of design-by-committee, we're hoping that this can be a successful experiment in open-source design. Your contribution could be a big part of making open source internet television engage millions of people while supporting and enhancing the work of independent video and filmmakers. Take a look at the categories below (click 'more info' for the details), we'd love to see what you think. Contest ends August 16th, 2005.
Win $200 by spreading the word. If you're not a designer you can still be a part of the contest, just by telling people about it. If you run a blog, have designer friends, want to broadcast this on your radio show, then reach out to all the designers you can think of about the contest and if one of them ends up winning the $1000 prize, we'll send you 200 dollars for helping to make the best design possible. So, get the word out, win money, and help make independent TV look awesome.
Get email updates about the contest and software:
The General Idea
We're looking for designs for the above screen. In some ways, we're actually pretty satisfied with how this looks now-- we think it's pretty decent basic application layout. But we're interested in the possibility of creating an interface that's much more physical in feel. Taking that leap to a physical interface metaphor usually goes badly for software, so we're nervous-- we don't want something that's really intense, complicated, or techy. At the same time, we don't want this to feel like another typical point-click application-- our goal is to make a TV machine and we want users to feel like they can lean back and watch. We don't necessarily require design submissions to be radically different, even subtle changes to the current design could be the thing that does the trick. What we're really hoping for is a subtle physicality. We hate to say it, but iPods are probably the best example of what we mean by that (for actual software that gets close to this feeling, see these widgets: iTunes Controller and flip clock).
The interface of the video player is cross-platform. Shown here is a screenshot of an alpha version of the OSX application. On Windows, the outer metal shell will look somewhat different, but the contents of the sidebar and main view window will be identical (except for font smoothing). These parts of the interface are written in XHTML / CSS / Javascript with a custom templating system that connects it to the backend. This makes it easy for non-programmers to play with the design, and it will be easy for us to put the winning design right into the application. If you want, you can also redesign the outer shell and go for something different than standard mac interface (even Apple does this with Garageband, for example). If you try for a physicality metaphor, this would definitely be something to consider.
In general, we've thought a lot about the layout and functionality of this main view, so you're going to have to trust us that all the parts we're presenting here is worth your time to design. We're probably going to be skeptical of designs that try to dramatically change this layout / UI model, and you'll definitely need to make sure that all the functionality elements are present.
The above screenshot is what a typical view of a channel inside the video player looks like. We expect that the majority of people's time outside of watching videos will be spent on a screen like this looking at videos that are available to download and ready to watch. Channels are listed on the left side of the video player. The main window to the right displays information pertaining to the channel that has been chosen and highlighted. For any given channel, there are three tabs at the top -- 'watch', 'browse' and 'library'. The 'browse' tab shows all the videos that the publisher has put on her channel. Once videos have been downloaded, they will appear in the 'watch' tab. The 'library' is another story and not worth getting into right now.
Channels Sidebar
The channels list on the left side is simple right now and may remind you of the left side of the finder window on OSX. Maybe you can find ways to make the channels feel more physical and solid, without getting to techno or unintuitive. When a channel is chosen, that Channel should be highlighted in some way.
There are two tabs at the top of the channel list -- a 'Channels' tab and a 'Collections' tab. These tabs should be fairly eye-catching but not take over the list of channels. We don't want them to look like tabs you see on webpages, but something more physical. The Channels tab shows you what Channels you are subscribed to and the Collections tab shows you your library of videos and any Collections you've compiled (like music playlists).
Main Window
The main window is to the right of the channels/collections list. This main window is where most of the action happens - choosing videos from the channel that you want to download ('browse' tab), selecting videos that you've have already downloaded and want to watch ('watch' tab), saving and deleting videos, and this window is where video plays (when not in full screen mode).
We like the current layout of the different elements of the main window (including the title of the channel, recommend to friend button, settings, search, watch, browse, library tabs, video list with thumbnails, description, download button, etc.) and we've placed them according to how we see their role in the user experience. Next to each video, all the way to the right of the main window (where you currently see a play button with an arrow inside of white circle), there will be a download button. Download buttons are not shown in the current screenshot, but please make sure the download button is a part of your design submission as it is an important part of video playing experience. Currently, the download button is an arrow pointing down, inside of a white circle. Feel free to make a nicer, but not too intrusive download button.
The 'play', 'fast forward', 'rewind' buttons at the bottom of the main frame could also use some work as they are a bit plain. We're also thinking about putting in a 'stop' button.
The Settings Page
Viewers can also get to the Settings page by clicking on 'Change Settings' at the top of any main view of a channel. Settings control whether all videos in a channel download automatically or whether users browse through videos and choose which ones to download manually.
Collection View
This is a screenshot of the "Collection" view in the main window. The "Colelction" tab at the top of the sidebar will be chosen (not shown here) and a collection in the list in the sidebar will also be chosen (channel chosen shown here). We would like to give people a chance to have a fancy view for seeing and organizing all the videos that they have on their computer. The closest thing to what we're thinking of is the consumer-dildonics machine known as Delicious Library, which lets you look at images of things you own. The point here is that they've made a very luscious display of images and something like this would work well for browsing through thumbnails of downloaded videos. Unlike the channel browse tab seen in the main interface screenshot, this screen would only need the image and the title. The images could be much larger and the background could be fancy.
Please submit image files of how this collection view could look. If you win, we'll need the component images like background, shadow, etc.
We need an icon for the video player software and a logo for the video player platform. Depending on what kinds of submissions we get, we might decide that these should be the same thing, but we're not sure yet. As far as the icon is concerned, we think that an image of a TV is likely to the best idea. It's a little too obvious and we were initially hoping to avoid it, but ultimately we want to give people a TV-esque experience and it's important to reinforce that feeling. Feel free to disagree and send in something completely different. Since we're not decided on the name for the internet TV software, you won't be able to work that into a design. If you must, you could work with the word "Depending" which is kind of similar to the name that we're leaning towards at this point. Then we can switch in the name when we settle on something...
We'll need high-resolution images for submissions of either of these (at least 168px square for the icon).