Monday, March 9

Designing a 'news-filtering' website


I was emailed from out of the blue by a news filtering website that was about to go public -veri.com- and, based on my other reviews in my blog, they asked me to give them constructive feedback. What follows are some high concepts about, not just their site in particular, but about news-filtering sites in general. I've asked their permission to blog my feedback and, bar some side comments about minor bugs and issues, here it is...

(My re-designed news filtering website for Veri.com)


FEEDBACK

I can't comment on the technology behind Veritocracy as that would take a period greater than two weeks to really study, but I've commented extensively in other areas.

When I looked at your site I immediately made comparisons to digg and google news, and since you won't be able to escape this comparison it's better to embrace it and go from there. It appears as though Veritocracy is a blend of these two sites, but I don't think it elevates itself higher than either, mostly because it doesn't take advantage of its strengths. But more on that later...

ABOUT DIGG
Digg has the enormous advantage in that it has established itself and, in this time, has expanded its product to include video and image results. People know what digg is, how to use it, and what it can do for them. It does Amazon-like recommendations, and has a strong user-based community. It appeals to a younger, more frivolous youtube crowd. It's mainstream, popular, and garish. It's very easy to go there with noble purpose, but end up wasting time.

ABOUT GOOGLE NEWS
Google is a diverse behemoth, yet the news arm of its website is as impressive as it is bland. It resembles what you would imagine an information-dispensing machine to look like, rather than a beautiful and intuitive news filter that is a joy to interact with. It's simplicity to a fault. More so, it is purely functional, but it delivers its intended function better than anything else on the web.

ABOUT VERITOCRACY
Veritocracy cleverly groups stories together into focused collections of interest. The way it packages information is its strength, but it looks clunky and ugly in a blog-like way and doesn't provide pictures or video like its competitors. Veritocracy also invites you to write and submit articles, but who's got time to write an article about every article they read, let alone go to the extent of copying and pasting urls to sites that it should pick up in the first place. What's wrong with a comments section? And what is a veritocracy anyway?

This is what I would imagine you'd expect to get from the blogosphere's quick reviews / comparisons...


(Veritocracy website - unchanged)

I do believe veritocracy's strength is the way it groups information, and in that sense it has a natural appeal to a more intelligent crowd. Readers, basically. People genuinely interested in news, but more so to get a broader perspectives on specific subjects. People who want to gain a deeper understanding of an issue rather than be satisfied by the first article they see. To appeal to this group and present yourself as a serious university/business-level news filter (and then broaden out from there) I believe will be key to creating a long and happy future for veritocracy. Unless you can introduce images and videos though (along with a sensible and accessible comments section) I doubt you will ever be as popular as digg, which, conversely, means that digg need only to incorporate key features of veritocracy to then make veritocracy far less valuable, if not redundant. This underlines the need to distance your appeal to a specific audience. There's the digg crowd and then there's the veri crowd.

I never got into digg because I never found it appealing as a source of information. I personally use iGoogle with gadgets from The Guardian, BBC, Google Technology, etc, for my immediate news and will visit dedicated news sites like crooksandliars.com or
guardian.co.uk for a strong stream of focused news when I want to indulge. The bulk of my news information though, comes from a mixture of podcasts (of democracynow/ countdown/ rachelmaddow/ realtime) or online videos from the same shows' websites- mostly because I listen to them as I work.

As mentioned, I genuinely like the way veri collates its news stories and could see myself giving veritocracy a good period of time as my regular first news site to visit, which could possibly establish itself as that if it were to fulfill my news-gathering needs (producing focused clean easy-to-navigate information, be visually satisfying, and continually evolving. The fact that right now I don't have a news site like this tells you there is room in the market for veritocracy, and therefore opportunity). Unfortunately there's no escaping the fact that a good part of a site's satisfaction, for me at least, is visual. An image goes a very long way sometimes, but I'll address this further into my feedback. Right now, even without the images, Veritocracy has areas where it could be improved- so let's get into some of them right now...


VOTING
I don't know why people vote on things. Maybe if I had a personal investment in an article I would vote on it, but for 99.9% of articles- I just don't see the point if I don't need to. I'm certainly not against it, I'm just not motivated to do it myself.

It's like Google Images wanting me to provide keywords for the images it finds, not for my benefit, but for Google's- so that in the end their technology can improve and eventually give me a more accurate and fulfilling user experience. Ok, I get the reason, but on a practical and immediate level I don't feel the need to give it the energy. Same goes with voting on articles, images, comments, whatever. (There are some comments I make an exception for though, but this is because I'm assuming the positive feedback will get back to them- which is very different from voting on an article/url/etc). So my point is: Why would I go out of my way to take the time, even if it's the smallest amount of time, to tick either yes or no, to something. After all, most of the stuff I read is fairly complex, so for me to expend even one thought to simplify an article's concepts down to a black or white yes or no conclusive answer ends up being too much energy for too little reward. What do I get out of voting 'up' or 'down' on an article? I've just finished the article. It's over. The only energy I'm going to expend on it is to close its window. And that's it! From the perspective of Veritocracy- I'm a free loader. A filthy non-voter. A blight on any system designed around the quality of user input.

So how would a website convince me to do something I don't want to do and yet still keep me happy? That's one of the tasks I've decided to tackle. In fact, most of this feedback will be about trying to increase ways people can provide feedback, which can be done primarily by rearranging your User Interface. My self-imposed guidelines here is that any change should either: retain the quality of my overall user experience; or improve the quality of my overall user experience.

It is also important to tell you that this feedback will be completely without restraint or sympathetic in any way to the efforts you have already made. If I was being paid for this feedback you'd get a more tailored opinion, but as it stands, this is free in every meaning of the word. :)


ENERGY RETURNED ON ENERGY INVESTED
What I love most about Veritocracy (visually) is the way it opens up a separate window within it's window, all complete with a tidy drop shadow and a close tab at the top. Lovely. Bravo. I also really like the idea of reading an entire article within this window.

The main problem with voting (and corollary to this- the article's window) is that you really need to keep the reader within the veri window to have the process of voting make sense and not be burdened by clumsy steps of going backwards or as afterthoughts to the event. This is made even more difficult when you get incredibly good articles like this one which divide the article into two pages. You actually need to go to the original article to read the whole thing- necessitating the need leave the veri site (and therefore veri's article window).

This prompts me to think of new solutions (for those that like to vote): Could veri take a snapshot of the window it's going to open up and use this as a thumbnail in a new (small) pop-up window with a ratings bar there. Could this pop-up ratings window close upon the main veritocracy window closing? And be grouped together with other pop-out windows so that the user doesn't have a patchwork of pop-outs over their screen, but just the one with other ratings windows in its history? I'm sure there's some solution there somewhere, and it would be interesting to play with ideas about getting there, keeping in mind never to cross the line where something gets annoying enough to the point where the user goes somewhere else. There is definitely some leeway with users, they'll put up with a little, but not too much. In that space is room to experiment.

Right now, on the current veritocracy site, if I were to vote on an article I had just read in a veri.com window, I have to scroll up to the top of the article, find the small up and down arrows, make my decision, then choose the next article, or close the window to get back to the list of subjects.

That's more work than it needs to be, when all I'm there for is to read about something and, in this particular case, to vote on it. It's one click and one scroll up too many and by only rearranging the UI so that the rating box is at the bottom of the article, or better still- outside the scrollable window- is all it would take to minimise the hassle of this simple task and make each experience of reading and voting smoother.

As mentioned earlier, I'm looking to expend as little energy as possible once I'm done with an article, which usually equates to finding out how to close its window. One of the ideas I played with in my mock-ups is to rate the article in order to actually go to the next article. By that I mean: When you go to click on the 'Next Article' button, the button will disappear, and appearing in its place will be a rating box. Rate it and you get automatically sent to the new article. It's the same for the Previous button. Rate the article to perform a function. This does not happen if you want to go Back however. If you click Back you are simply taken back. (There's got to be some free way out at least). It may sound annoying, but it's the same amount of clicks- one. You rate the current article to go to the next article and the only tax you've been given is a momentary deliberation about something you've just read- therefore you're already primed to rate it anyway. (And this, coming from a non-voter such as myself, is really saying something. In fact, it would actually be saving time for people who do vote, and promoting people who don't vote to vote, so... Huzzah!)


MOCK-UPS
I have strung together a few mock-up images to explain my ideas much more clearly, however these will not be what I would consider "definitive". They are first steps, albeit visual steps, towards various UI solutions. The are not necessarily the solution itself. The idea I would most like to emphasise through these images, however, is one principal concept: If the user can comprehend how the tech underneath works just by looking at the UI then s/he will more likely use it to their maximum benefit. Ie. If I understand how the website works, then I can help it do what I need it to do better- to help me better. Win:Win. Right now I don't know how the tech underneath Veri.com works.

DISCLAIMER: It's also very important to note here (again) that these mock-ups are completely unrestrained. Be prepared to see your website wildly different to the one you've nurtured and bravely allowed me access to. So with that let me now walk you through what I've come up with in the last few days: (Deep breath...)




(Login screen)


(Think of this as a slide show). You'll see a few immediate differences in my design, but the first thing you'll probably notice is the...


TAG CLOUD
For a website dedicated to focusing and refining information you need more than just a row of general subjects to choose from. A tag cloud provides a visually beautiful block of information about things directly related to what it's receiving. For the user it's like having a live feed about what's happening just beneath the skin of the website. And it's also something users can interact with, but more on that shortly...

(Side comment: The "Skip Login" option shown here is for people who want to use Veritocracy without logging in. Perhaps they want to try it and see what it's like before signing up- how many other sites let you do that, eh?)



(Instructions - page one)



(Instructions - page two)


TRANSPARENCY
These images should be self-explanatory, but the idea here is that you can further refine your search with the tag cloud and, visually, it's immediately identifiable what's happening, what veri is picking up, how popular the topics are that appear in the news stories, etc. (You'll see more of this in the next image). At a glance I can see that everything red is me.

(Side comment: The small maximise button (down arrow) at the right of the top row, when clicked, reveals a list of sub-topics. It will push the page elements down to allow space for the sub-topics list. I didn't have time to complete this mock-up)


(Main screen)


REFINEMENT PLUS
The fact that I have a regularly updating tag cloud (daily) that I can interact with to provide new content into my information stream is enough to warrant long term use of such a website, but the further refinement of stories that can appear from using the 'My Topics' tag cloud *really* personalises my search. (I'm from Australia. That's how we spell personalise). Again, they concept here is: "Everything red is me". A user will understand how this news refining website works simply at a glance, which means that they know exactly what the result would be by filling out the My Topics tag cloud. The simple satisfaction of seeing an article appear that has one of your keywords in red in the subject heading will gain not just a great deal of affection towards the website, but a deep sense of ownership toward it as well- and that's powerful stuff.

(Side comment: If a topic is selected in the Popular Topics tag cloud, but it drops in popularity enough to not be included in the tag cloud anymore- it will automatically be moved to the My Topics tag cloud. You can deselect topics as simply as you can to select them- by clicking on them).


THE SLIDER
This is probably my favourite idea I came up wit through this process. It's my favourite because it solved a lot of things I overlooked previously, and solves them better than I had anticipated. So... If you look along the top row of subjects where it says: Chosen, World, Nation, Politics, etc. you'll see a small box around the word: Chosen. This is what I call The Slider. Notice the left and right arrows on it? That's to tell you that you can slide this little guy left or right along the top row. Right now The Slider is on 'Chosen'. This means that everything you've chosen that appears in red will be coming up in the articles section. Ie. You're saying to the website: show me articles about the subjects I've "Chosen". If you then slide The Slider to any individual subject, then the website will only show articles to do with that individual subject- no matter if that individual subject is red or black! It will give you complete access to any subject with impacting on your preferences. This is a much better solution than usual tabs because it doubles the functionality of the same row of information without cost to space or aesthetics.


IMAGES & VIDEO
By now you would have spotted the link that says: " news | images | video | all " This is a direct reference to digg, but it's one that needs to be included here. I've not put any images in these mock-ups, mostly due to time restrictions, however it would be interesting to see what it would be like with "all" selected. (I'll leave that one for your art dept). As you can see the design still stands up without the need for images, but it's something to account for in future versions of veri.com.


(Subject opened)


EVERY ACTION CARRIES VALUE
If I receive my groupings of news as just their subject headings (pictured in this mock-up) and not immediately exposing their related articles below it, this will do two things: 1. It cleans up the information on the screen by a country mile. And 2. it gives the website a measurable action. The website knows that if I select that Subject Heading then I must think it's interesting- and so it can be measred as being more popular than those I didn't select. That can be considered a one point increase to all articles inside this selection. If I then click on one of those articles then that article gains two points- one for being clicked on and another for being the first one I clicked. If I look at the article and scroll down its page- it receives another point (for being interesting enough to scroll down). If I have chosen a general subject, like Politics, (in the top row) then this adds five points to the popularity of an article with politics in it. If it has a topic that I selected in the Popular Topics tag cloud (on the right) it receives 10 points. And if it contains a keyword I typed in to the My Topics tag cloud that increases it a whopping 50 points!!! And taking the time to vote on an article gives it -5 to +5 points depending how you rate it, etc, etc... The idea here, which I have clearly over-explained, is that the website should be paying very close attention to everything the user does because- from the website's perspective -the user is the centre of the universe. (That's how Aussie's spell centre).

(Side comment: This idea of how important the subjects, pop.topics and my topics are to the popularity of articles that appear in the articles column would be explained (with images) by hitting the "How veri works" button under the My Topics tag cloud).

This is an opportunity to again stress the importance of a clever UI. If you were to [rearrange your UI] so it will take advantage of [the minimum number or clicks a user must make] to allow the technology underneath the website to [measure the level of interest associated with each action] then you could effectively find new and more complex ways to measure the popularity of articles- thereby improving the information that "finds you"- without taxing the experience of the user.

Or in other words: Get the user to work more for you without them even knowing it, and do this simply through a clever use of UI design.

(Side comment: Right now, when I click on a link from the main page, Veritocracy brings up the list of articles from the main page again, even though I've already selected the story I wanted to read first. This means I have to click a story twice to read it. That's one click too many).



(Article opened)


This is the only time I've really remained faithful to your original website. Kind of. I really like the shadowed window, and the thought of viewing news articles from across the web from one single website- especially one I've tailored to suit my interests.


(Side comment: In the current veri website, I'll click on an article to read the whole thing, but instead it will only register the heading and sub-heading as the full article (which is exactly what I read right before opening it), and will have no body of text to it. I'm guessing that's because the website it's referring its information from has not named the body of the text correctly so that it's reading the subheading as where the main body of text should go. Since this is a surprisingly regular occurrence would it not be crucial to find a way around this? Perhaps with people who have syndicated their content to your website you could have a way their website information is always tailored to be read by veritocracy).

(Side comment: What worries me is how an article can be voted on from the main page with only a sentence or two displayed (and sometimes not even that) with just as much credibility as a vote made by someone who has read the entire article)



(Rate article)


THE EASY RATE
Note the lack of a close button here. By clicking on the Subject Heading for all the articles (in this case it's: "Spending on War in Iraq continues to escalate") will take you back to the previous list of articles- this essentially acts exactly the same as your 'close' button, or a 'back' button- It does the same thing. In my mock-ups, you don't have to rate anything if you click this 'subject heading' link. You simply click on the Subject Heading and it will take you back cleanly and without hassle. But... If a user were to click on the Next button (if the article hasn't been rated yet) this action will hide the Next button and, instead, a rating bar will appear! It sounds counter-intuitive, but hear me out... The user must rate the current article in order to go to the next article. The only way the user can avoid this is by clicking on the Subject Heading (to go back) and open up the article they want. It is only the Next and Previous functions that have the 'rate first' feature. By making a rating selection you are automatically taken to the next article- you do not have to click Next again. It's one click only. Note that the centre circle of the ratings bar matches the centre of where the word, "Next", used to be. If someone rates it only to see the next article (without caring what rating they are giving) they will most likely hit an average score, which reads as zero points anyway. To understand this idea in terms of your current veri.com website: This would be exactly the same as if you surrounded your 'Next' button with a 'Vote Down' and an 'Vote Up button' on either side of it. All buttons (Down, Next & Up) in this case would do the same thing (take you to the next article), however two buttons (up & down) would also apply a rating. Since they're right next to each other, and no extra clicks are needed, then the task of rating something would be made very easy and simple to do. In this case (in the mock-up) the Up and Down arrows are replaced by a neat little rating bar, and the Next button disappears behind this bar. (Note how the most positive rating symbol- the full red dot -also appears in the veri logo in the corner).

(Side comment: This is not the official way to rate an article in my mock-ups. The official way to rate an article is by putting your cursor over the Unrated circle near the centre-bottom. A ratings bar will appear just like if you were to hold it over the Next or Previous buttons. The only difference between rating an article here or via the Prev/Next buttons is that under the official rating bar would be a small link saying: More which is explained in the next paragraph).


A DEEPER RATING SYSTEM
If you were to adopt a "measure everything" approach then you could really go to town with people who genuinely want to give a website useful information. They're out there, I'm sure. People like that would be a blessing to websites like yours. To take full advantage of this you could have a small link near each ratings bar that simply said: "More", then it could extend the bottom of the window to reveal what would look like another tag cloud. To the right of this 'rectangle of words' may have descriptions like: Inspiring. Beautiful. Poetic. Exciting. Motivating. Insightful. Moving. Hilarious.
Towards the middle may have adjectives like: Funny. Witty. Decent. Interesting. Plain. Inoffensive. Dull.
And finally, towards the left would have words like: Ignorant. Uninformed. Biased. Offensive. Racist. Sexist. Gross. Depraved. Inarticulate.
By clicking any number of these words will give you an extra level of depth and complexity by which to narrow down articles' popularity. If I keep looking at articles that others have deemed, "Motivating", then they can be given higher popularity in my article results. At some point in the future, depending on the popularity of this "deeper rating system", it may necessitate including an additional subject along the top row of subjects called: "Special". Expand the top row menu list to reveal the descriptions beneath and you would see the words below "Special" to be- Inspiring, Poetic, etc... all the way to ...Depraved. Inarticulate. (You would need to have all of them available to choose as filters because some people might be actually be interested to read articles tagged as "Offensive", etc. Weird, but hey, whatever flicks your switch, I guess).


(Side comment: On the current veri.com website, on the Reason Watcher- the option 'Sort By', when choosing between Newest and Oldest, gave me the same results. Personally I
don't know why this option is even there. Who would ever need this for a site like veri.com? This option box is taking up a whole row of very precious screen space. Perhaps I am missing the value of this feature, but right now I don't see why it needs to stay).


NO COMMENTS
I will be particularly honest here and own up to the fact that I couldn't actually find where other people's articles are stored. And I tried. I wrote an article just to test this function, and once sent- I couldn't find where it went. I think this points to something larger though. I think the lack of a comments section is an oversight. Thanks to the influence of the internet, comments sections are now an integral part of the overall experience of reading an article. More often than not, comments in a comments section can be just as revealing as the article itself- if for no other reason than to gauge public reaction to it. This subtlety is lost on veritocracy's current up or down arrow voting scheme.

Even though the comments section I have included in this mock-up nas not been fully worked out, it does offer a basic visual as to how a comments section might be incorporated into the veritocracy website. In this mock-up, by clicking the "view comments" link, it would snap the top of the comments list to the top of the scrollable window. By clicking the "add comment" link would snap the bottom of the comments list to the bottom of the window (where the comments entry fields are).

(Side comment: Using the current veri.com website, at the list of articles, I did a search for the name of the author whom I knew wrote one of the 5 stories in the list. Even though it appears very clearly on the actual story itself (just under the headline) it wasn't found by the search. In fact, other searches didn't pick up very obvious keywords. Under the subject heading titled: "Spending on War in Iraq continues to escalate" there were 5 articles. A search for the word "war" revealed only 3 articles as having matches).



(Pop-up window)


EVERY NON-SOLUTION...
...paves the way towards a real solution. This would have to be my least favourite idea I came up with, however, I thought it would be at least fun to see what it looked like when mocked-up. As mentioned earlier, there will be times where the rating process will be interrupted by a user being forced to leave the veri site. The pop-up menu is one way that may keep them connected, entice them back, or at the very least band-aid a broken rating process. The back button in this pop-up window shows that there are other sites the user has opened from veri that are waiting to be rated.

(Side comment: These mock-up images are uploaded onto my blog site, however I haven't put out a blog about them. Ie. They are saved there, but have not been published).



THE FUTURE
I very much enjoy watching the slow evolution of Gmail. Every month or so I find a new feature, or alteration to the UI, and they are always in very unobtrusive and subtle ways, but always making it better, cleaner and smarter. I would hope that veritocracy adopts the same strategy. It's a safe bet that you most likely will, however I'd still like to point you to two websites that I referenced when brainstorming ideas for this feedback, and I'll point to these sites if for no other purpose than for you to imagine with me where a news filtering site may go...

Newsmap - An incredible site that will be more popular as the internet connections of people around the world get stronger. This not only looks incredible, but it's clear, dynamic, informative ...and just flat-out cool!

OwnYourC - Reminiscent of the game You Don't Know Jack, this website is the most fun I've had filling out a questionnaire. Ever. Period. The fact that it is as informative as it is entertaining makes me giddy with possibilities of how you could use an interface like that in other applications.


And finally...


THE NAME
Drop the tocracy. Just keep it as Veri. It's veri.com. Just be Veri. The actual name Veritocracy carries with it a concept, and even though it's a clever concept, it's a halting thought. This is an exaggeration, but... when you read the title "Veritocracy" you are invited into a mental drama about the meaning of what a veritocracy is, and... if you approve of the concept. Whether you ever get to an understanding of an approval or not, it doesn't matter, but that's where you're going to end up if you look at that word. It carries a meaning, and by this association it also carries opinion, bias, interpretation, status, judgement, etc. It weighs down the idea of the website with other associative ideas. (And besides which, I keep reading it as Verocity).

Look at Hulu, Google, Wii and Digg. These are powerful names because they don't immediately mean anything. When I'm browsing through Hulu do I really care what Hulu means? I get a sense of what Hulu means when I'm browsing and watching and being entertained. Hulu, the word, means browsing, watching and being entertained. Even if it doesn't! The people behind Hulu chose the word because it's "short, easy to spell, easy to pronounce, and rhymes with itself." It's an empty word in which I'll inject my own meaning into it from the experience I have with the website. Simple. Empty. Free of meaning. Free of burden.

Veri. Veri short. Veri simple. Veri good. Keep Veri. Drop tocracy. That would be ...veri clever. :)

And now an addendum to my previous "And finally..."


THE TAGLINE
"Better information finds you". This, unfortunately, is way too long. You don't need to tell us all of that. Just put: Better information. That way you are saying much more, for example: Better information (period) tells us that no matter who comes up with another type of website like yours, or an older more established website like yours undergoes vast improvements, Veri will always have... Better information. Simple. When you stick the "finds you" on the end of it, you're already weakening the strength and simplicity of what you began with. "Better information finds you" is like saying: There's a whole bunch of information over here that's better and there's this process that we hope to give you in this website that will allow that information to find it's way to you. Immediately the reader is put into a position of thinking about the technology behind the information, instead of the information itself. By cutting off the fat and just having- Better information. -you're saying clearly and simply: This is better information here on this website than any other website. ...and that is exactly the message you want to be conveying.


CLOSING COMMENTS
I hope you have enjoyed my feedback. As I mentioned in my introduction, the feedback I provided had absolutely no sympathy to the work that has already gone into veri.com and approaches the concept as if we were both in the original design meeting with a blank whiteboard in front of us.

With only a week left before you release your Beta I don't expect to see any of my suggestions implemented, however, regardless of what I've written, I wish you the best of luck with the public launch of your site.

Best regards,

Mat Brady

1 comment:

imterx said...

very much enjoy watching the slow evolution of Gmail. Every month or so I find a new feature, or alteration to the UI, and they are always in very unobtrusive and subtle ways, but always making it better, cleaner and smarter. I would hope that veritocracy adopts the same strategy. It's a safe bet that you most likely will, however I'd still like to point you to two websites that I referenced when brainstorming mytrailerideas for this feedback, and I'll point to these sites if for no other purpose than for you to imagine with me where a news filtering site may go...