I've been quiet for a while now. I've been quiet for a number of reasons; the end of my degree is one, and shifts in my personal life is another. I'm a very different person to how I was a year ago. But those aren't the reasons you're most interested in, are they? [smile]
Work on V5 has kicked up a notch. We've now contracted the services of a professional designer, with whom I'm meeting once a week - and these meetings are epic. He and I spent two hours just going over the top menu bar. At our last meeting, he showed me his first 'renders' of the site (actually mocking up how it will look in the browser). I'll be sharing bits of these renders with you today and in the coming days.
On the back end, not much has changed, but as the user experience solidifies it becomes clearer and clearer how the backend will support that. Search, for example, is not just going to have to be very flexible, but will actually be proactive - the results of common searches will be continually maintained and updated as content changes, instead of only updating in response to user requests. Content control will be increasingly decentralised. There will be an overall shift away from types of content - discussion threads, articles, and so on - and towards what the content actually is. The site will feel like more of an integrated whole, instead of a collection of different sections that are loosely tied together. And the site's content will be even less bound by the www.gamedev.net domain...
Anyway, that's enough blather for now. Let's get on with some pictures!
ShareThis, Tagging, Rating, and Notifications
Today I'm going to talk about the UI for tagging and rating content (plus a couple of other things). This is UI that will be present for every piece of content on the site - be it articles, forum threads, even user profiles - so it's important that we get it done both early and correctly. This is what we're thinking it might look like:
It'll sit in the top right corner of a page, below the banner ad at the top. There are four different parts here, so let's go through them in turn.
You've probably seen a button like this before - we're going to be integrating the ShareThis button into our pages. The button, if you've not seen it before, provides quick links to share whatever you're looking at with a large number of social networks and sharing sites - Facebook, Twitter, Digg, Delicious, Reddit, StumbleUpon, and more. There's something like 48 supported services in total, and they add more without us even having to do anything. So, this will make it a lot easier for you to share interesting threads, articles, journal entries, etc with people in your venue of choice.
We're going to integrate a five-star rating into every content item. In the diagram above it says 'User rating' - that's because my picture there was cropped from a User Profile render - but it'll be more useful for things like articles or forum threads (we may drop it from the user profiles). By default, the number of stars shown will be an aggregated figure drawn from across the whole community. If you click on the 'Rate them' button, it changes mode:
When popped-out like this, it'll display the rating you've assigned to the content item (if any), and will let you click on a star to assign a new rating.
This is an interesting one, as tagging's going to be such an important part of the new site usage patterns; we've spent a lot of time talking about it, asking questions, considering hypotheticals and so on. Let's look at the UI that pops up when you hit the 'Add Tag' button.
The top part of the panel displays tags that are presently applied. Tags in blue are tags that you yourself have applied, while tags in grey are tags that other people have applied - with different shades of grey indicating how many people have applied that tag. If you agree with a tag that other people have applied, you can just click it, and it'll turn blue to indicate that you're applying it too. If you change your mind about a tag, you can hit the cross on the right end of it, and it'll either fade back to grey (if other users are still applying it) or disappear (if nobody else was applying it).
The lower part of the panel is for adding other tags. You can type a tag name into the text box there (which will suggest tags based on what you're typing in), or click any of the 'recent tags' at the bottom - those are tags that you're recently applied to other content items.
The last part of the UI today is the Notifications panel. This is so simple that it doesn't even have a popout: you simply click on the tag-like things to toggle the relevant notifications - click 'EMAIL' to turn on email notifications, 'IM' to get instant messenger notifications, 'CHAT' to get IRC notifications, and so on. The exact options that will be available as notifications is still to be worked out, but you get the idea.
So, that's it for today. What do you think?
Next time I'll start talking about the top navigation bar.