Tag Archives: interface

10.08.10
by

HTML5, touch and new interfaces for news

I feel like Keanu Reeves in The Matrix. Woah. When Zee at Next Web posted this HTML5 news timeline from AP Labs, I was blown away. It’s such an intuitive, rich interface for exploring news from multiple angles, and after a lot of years of stagnation in terms of interface design, I’m really excited to see HTML5 and touch interfaces motivating designers and coders to explore some new ideas.

You can explore stories by time, choosing different subjects as you go. The stories drop into the timeline with colours related to their topics.

AP HTML5 Timeline News Reader

Clicking on a story in the timeline opens up a small preview window.

AP HTML5 Story Preview

You can then open the full story that brings up this three-pane window in which you can make adjustments to the text, see additional information about the image with the story and read the story itself.

AP HTML5 Story Preview

Now, as Conrad Quilty-Harper says on Twitter, it “runs like a dog on the iPad”. I was viewing it in Chrome on a four-year old, much-repaired MacBook. It was very fluid on the MacBook. I should probably try it in Safari and see if it has something to do with Safari’s support for HTML5. That might explain why it’s slow on the iPad. However, Conrad has a point. Creating a site in HTML5 should allow it to run on an iPad, but it looks like it might take some optimisation. However, designing the interface is half the battle. As a first effort, it’s an excellent starting place, and it’s very exciting to finally start seeing some experimentation with interface like this. HTML5 might not be production ready, according to the W3C, but it’s very promising to see this level of sophistication at this stage.

05.22.10
by

Al Jazeera Unplugged: Robin Sloan of Twitter

Robin Sloan works for Twitter with their media partnerships. He started off with a few statistics.

  • Twitter has 105m users worldwide.
  • 30% of users are mobile.
  • Growing faster internationally than in the US.
  • 1bn SMS per day.
  • 60m tweets a day.

Robin said that inventors don’t always understand why their inventions work or how people use it. However, they do believe that there are some reasons why it does work.

We think that Twitter works because it’s an information network not a social network.

Many people are using it for ‘one-way’ relationships, such as following news organisations or TV shows. It is much like a traditional broadcast network.

They believe that Twitter works because there is “less friction”. They believe that this allows people to use Twitter in moments when they are waiting, interstitial time. What if news presented itself with no friction, without entering “news mode”. To read The New York Times or watch Al Jazeera, you have to enter this headspace, this focus, “news mode”. What happens if you could get information without entering “news mode”?

We just figured out websites, but he said: “Am I saying that news websites have too much information? Yes.” I think this is about presenting information in the flow of life without friction. This reminds me a lot like TV. In some ways, this becomes the new programme guide. They don’t look at the EPG; they look at Twitter.

Google just released Google TV this week. TV is still the world’s biggest medium. It has an audience of 4bn people. Google want to change the operating system of TV. Twitter and TV, these things really do go together.

How does this argument mean for news? How can you present information in context, in the interstitial moments in people’s lives. How can you make consuming news ridiculously simple? How can you present pure information, pure message? Real-time information happens when that friction approaches zero. This is the challenge. As a platform, as a medium, TV is behind in some ways. It’s ahead in many ways, TV needs no interface.

At Twitter, we still think that it’s way too complicated. There is too much friction.

10.01.09
by

New York Times: More innovation in commenting

As I wrote recently, news organisations have only begun to scratch the surface in terms of innovative interfaces that could encourage readers to explore the rich content on their sites and also increase and improve reader interaction. When I wrote that post, the Washington Post had debuted a Django-based commenting system called WebCom that reminded me of ThinkMap’s Visual Thesaurs. WebCom reflects comment popularity, which can become a self-reinforcing cycle. I will be interested to see if they might add another layer to the interface that allows people to explore the conversation based on themes or topics. This could be easily achieved by using Thomson-Reuter’s Calais semantic analysis system to expose themes in the comments.

Now the New York Times has debuted a new visual commenting tool. It’s debut is being used to help people discuss and explore some of the issues regarding the healthcare (some might argue the health insurance) debate in the US. The boxes all relate to an issue in the debate, and a drop-down menu allows you to jump to that topic and see a brief overview of the issue. The relative size of the boxes reflect the number of comments, and hovering over the people icons at the bottom of the boxes allow you to quickly see a bit of the comment. You can also also easily jump to replies to comments that you have left. It appears that the topics aren’t generated organically by the discussion but are created by the New York Times editorial staff. In some ways, it’s a slightly advanced, and somewhat stilted form of threading. It’s almost more of a discussion system than it is strictly a commenting system. nytimesdebate.gif

At the time of writing this post, there are few comments so it’s difficult to see how it will work both conversationally and technically as the volume of comments increases. That will be the real test of the system because one of the reasons why news sites need interface innovation in commenting systems is because of the volume of comments on media sites.

Here on Strange Attractor, the comments tend to be more off-site, posts written in response to what Suw and I write. Very rarely do we have a high volume of comments on the blog, which makes it easy for us to manage and for our readers to engage with. We don’t write about politics or hot button social issues. Rather, we write about a very specialist, niche topic. The conversations tend to be pretty high level, and we love our readers because of the level of intelligence that they bring.

On news sites, the volume of comments on the posts is much, much higher, and it quickly becomes difficult for journalists and readers to follow the discussion and have any meaningful interaction. The comments tend not to respond to each other but rather are usually a string of unrelated statements. Most of the current solutions all have their drawbacks. Threading has its issues because it tends to fragment the discussion, which is what I fear this New York Times interface will do. Voting up, or down, Digg-style helps in some ways but suffers from the same issues of the self-reinforcing popularity that WebCom faces. Again, a few criticisms don’t mean I think these experiments aren’t worthwhile. Far from that, I think it’s great to finally see some interface exploration in terms of commenting and not just content presentation by news websites. Hopefully, this is a sign of things to come. It’s long past time that news organisations realise that the volume of comments they receive requires something more than flat, linear comment threads below blog posts or articles. Done right, it will help increase participation, user experience, interaction and maybe even the quality of the conversation.

09.09.09
by

Visualisation for news and community discovery

I think that visualisations and interface innovation hold great untapped potential for journalism, not only helping journalists and audiences to see trends and understand complex sets of data but also as a tool that will dramatically improve news site usability. The last few years have seen a lot of innovation in visualising data with the advent of mash-ups and easier visualisation tools from Google, Many Eyes from IBM, etc., but there has been too little interface innovation for news websites.

By and large, news websites still reflect their print heritage. They make the classic mistake of rigidly reflecting their own structure while ignoring the semantic connections that cross desks and departments. Most news web site interfaces obscure the vast amounts of information we produce as journalists. Good interfaces go beyond design and search to issues of information architecture, user experience and discovery.

I believe that interface innovation can unlock the power of technologies, helping them break out of a small group of technically adept early adopters to a much wider audience. The Windows-Icon-Mouse-Pointer interface helped open up computers to a much wider audience than when command line interfaces were dominant. The graphical web browser helped unleash the power of the world wide web. In 1990, when I first used the internet, I had to learn arcane Unix commands to even read my e-mail. In August 1993, I used the seminal web browser Mosaic for the first time in a student computer lab at the University of Illinois, where I was studying journalism and where that groundbreaking browser was created. I instantly realised that the web browser would become a point-and-click window to a world of information, communications and connection.

I’ve been interested in interface innovation since the late 1990s when I first saw the Visual Thesaurus from a company then called Plumb Design, now called Thinkmap which showed the connections between related words. The company did even more impressive work for Sony Music and EMPLive, an online exhibition for Microsoft co-founder Paul Allen’s Experience Music Project. In many ways, the work was way ahead of its time and sometimes ahead of the capability of the internet. The projects used advanced interface concepts more often found in CD-ROM projects of the day than the internet. One of the things that impressed me about especially the EMPLive project was that it allowed virtual visitors to the navigate the music collection a number of ways, whether they were interested in time, genre or a particular artist. The presentation also showed relationships between elements in the collection. I like Robin Good’s description on the Master New Media blog of Plumb Design’s work:

The original goal at Plumb Design was to create dynamic interfaces to information systems that reveal interrelationships often obscured by conventional methods of navigation and information display.

In many ways, Plumb Design showed what was possible with data, semantic analysis and rich interfaces more than a decade ago.

While interface innovation has not been an area of focus for most news sites, thankfully we’re seeing some tentative steps forward after a post-dot.com crash period of stagnation. Slate has launched a service called News Dots. Chris Wilson describes it like this:

Like Kevin Bacon’s co-stars, topics in the news are all connected by degrees of separation. To examine how every story fits together, News Dots visualizes the most recent topics in the news as a giant social network. Subjects—represented by the circles below—are connected to one another if they appear together in at least two stories, and the size of the dot is proportional to the total number of times the subject is mentioned.

Like EMPLive and the Visual Thesaurus, News Dots helps show the interconnection between stories. The feature uses Calais, “a service from Thompson Reuters that automatically “tags” content with all the important keywords: people, places, companies, topics, and so forth”. Slate has built its own visualisation tool using the open-source ActionScript library called Flare.
Slate's News Dot project
It’s a good first stab, but Slate admits that it is a work in progress. I like that the visualisation clearly links to articles and sourcing information. I like that the dots are colour-coded to show whether the dot represents a person, place, group, company or ‘other’. I think there might be a possibility to better show the correlation between the tags, but as I said, this is a good launch with a lot of possibility for improvement and experimentation.

Another project that I think shows the potential of improved interfaces is the Washington Post’s visual commenting system called WebCom. As Patrick Thornton explains, it is a visual representation of comments n the site. As new comments are posted the web expands. Those comments rated highly by other commenters or those that spur the most responses appear larger in the web. The web not only allows for navigation and discovery, but users can comment directly from within the visual web interface.

Thornton says:

The commenting system was built in two weeks by two developers at washingtonpost.com. A front-end developer worked on the user interface, while a back-end developer created the database and commenting framework in Django. Because the user interface was built in one language — Flash’s ActionScript 3 — and the back-end in another, the Post can take this technology and put it on different parts of washingtonpost.com with different user interfaces.

Wow, that’s impressive in terms of turnaround time. Django is quickly becoming an essential tool for the rapid development of journalism projects.

Thornton points out that it doesn’t work on mobile browsers or older computers. I might quibble with the focus on most popular comments or comments that spur the most response; comments that draw the most responses can often be the most inflammatory or intemperate. Likewise, popularity often becomes self-reinforcing, especially when it drives discoverability as it does in an interface like this. I would suggest that a slider that weights other factors might be useful. A simple search or tagging system might help commenters to find threads in the discussion that interest them. Again, this is a good first attempt and, with the development time only taking a few weeks, it shows how rapidly innovations like this can built and tested in the real world.

It’s exciting to see these kinds of developments. News organisations are struggling during the Great Recession, but often these times of crisis spur us to try things that we might otherwise think too risky. Whatever the motivation, it’s good to see this kind of innovation. If this can happen during the worst downturn in memory, just think what we can do when the recession eases.