Among German industry experts, Page also asked me for some input to the topic.

Unfortunately the article about the web is not on the web, but it is worth buying the magazine. The report gives you good insights about how people work on usability and describes many different methods. It is especially worthwhile, if you are new to the field.

Update: New media agency triplesense kindly uploaded a pdf-file of the article.

On the right you see the most common and intuitive gestural patterns to use with multitouch tables.

So to imitate a natural environment on the multitouch table any content element should be movable, rotatable and scalable with these gestures.

That is especially important for multi-user tables like the Microsoft Surface that allow multiple users to control the interface from any side of the table at the same time. Users could then just drag the element closer and rotate it to view it properly.

Some applications would work just like this without any buttons, scroll bars etc that you know from applications working with hardware interfaces like a mouse or a keyboard. Even people, who would use it for the first time, would intuitively know how to interact with it. Jeff Han explained that principle already 3 years ago at the TED conference. (Still worth watching)

However some applications can be so complex that they cannot be used with the standard gestures alone. You might want to hide extensive details somewhere or you need to give the user advanced controlling options to adjust tools or forms.

Then you would have to work either with gestures that have to be learned by users or with designs that tell users how to interact with the respective element. Users have usually no time for the former, unless it is a game or they really need/want to work with the application, so lets start with the latter.

Starting Interaction

How do you get users start interacting with a multitouch screen? People might still not be very familiar with gestural user interfaces, so just telling them in big letters to touch the screen with a big hand image next to it would be the most obvious solution. Then they know definitely how to use the screen, but will they actually do it?

Microsoft Surface Water Screensaver

A better call to action is to display a surface, which users cannot resist to touch. For example the animation of a water surface or colliding bubbles. This way you get users to use and understand the interface of the application at the same time.

Flip

You want to hide details of content element or you have several pages of content to place on the screen. Put it on the back of a content element and tell the users that they can flip it through dog-ears.

If the “details” are very important to you though, make sure you add a noticable button to the element.

Some applications use the round arrow to flip elements. I think it is not appropriate, because users know it also as an icon to refresh content.

Minimize

You have too many elements to show on one screen? Minimize them anywhere on the borders of the screen. Users can just toss them to the side, if they don’t need them or drag them back, if they do.

Click

By Infusion

Although everything on the screen is interactive, users still need to know which elements cause a special reaction. It might look old school, but button-like forms tell the users clearly what is clickable and what is not.

Glow

You want to combine two elements or drag one element into another? Give the user a visual feedback of some sort, that the elements are combinable. For example: A glow around the object or elements gravitating towards each other.

Switch

The user has to activate/deactivate options. With a keyboard/mouse interface this is usually solved by check boxes. On a multitouch screen however it feels strange to create checks with your finger. A switch is known to users from appliances and feels much more natural to use for that matter.

Sliders and knobs

By Design Affairs

If you want an option to be adjustable steplessly or with many steps, a slider would still be a good way to do that – as it is with a mouse-controlled interface.

A rotary-knob can do the same thing, but the spinning gesture can be inconvenient, especially on small objects. Tangible objects are the solution for this. Most multitouch systems can recognize the form and movement of tangible objects, if they touch their surface. For example, you could use a cylinder placed on the multitouch screen to imitate a rotary-knob. The system recognises the object anywhere on the surface and can arrange information around it.

In use the tangible rotary-knob turned out to be the feature with the highest joy of use.

By Neue Digitale

Further Links:

YouTube Playlist of Multitouch Applications

Bill Buxton: Multitouch systems that I have known and loved

Fast Company: 11 Killer Apps for Micrsosoft Surface

Recommended Reading: Designing Gestural Interfaces

Most Read

Guardian - Most Viewed Teaser

The most common ranking feature has a little weakness. What is most read by readers must not be the best article. Maybe it has got an interesting picture or the headline is thrilling. Then you click on it, but if you read on, the article is weak. By this time it has been already counted for the ranking. So articles, which are not interesting for most people, climb up the ranking and readers, who use the “Most Read” tool, become disappointed.

Most Recommended

A ranking is more trustful, when readers actively recommend articles. The whole concept of Digg depends on this. Users digg (recommend) articles, the best articles will climb the charts that are browsed by other users. This system has proofed effective, since Digg is very successful with it.

Digg - Massively digged article

Most Recommended by Authors

Wikia - Featured Topic

Online newspapers will not let their readers alone decide, which stories to put on top. The main expertise of newspapers is to know, what is important right now and many readers trust a professional more, than the opinion of the mass.
Actually every news homepage is a ranking of what is recommended by the authors. A “Most Recommended by Authors”-widget might still be a good function, if you want to keep articles on top beyond the actuality of the homepage or if you don’t have a very actual website at all.

Most Recommended by Peer-Group

With the New York Times application “Times People” users can follow other users and see what they recommend. If you had a very large group of people you follow, because you share the same interests with these people, a “Most recommended”-function within this group would possibly produce the most relevant results for you. Better results any journalist or system could ever produce.

Most Blogged

New York Times - Most Popular Teaser

A “Most Blogged” ranking is very similar to “Most Commented”. Articles, which are on top of this chart, will probably drive even a little bigger hassle.

Most Searched

“Most Searched” shows articles, which users are looking for through the search of the website or through Google search. It can dig up articles from the archives – for example if a certain topic that has been written about some time ago becomes relevant again for users, because of certain events.

Most E-Mailed

This feature is almost the same as “Most recommended”. People usually mail articles to recommend it to somebody else.

Most Commented

Techcrunch - Most commented articles ranking

This feature is perfect for users, who like to communicate with other users as it shows where the discussion is rolling. But also users, who do not like to comment, might like this ranking as it supports topics that polarise and might be interesting to read because of this.

Most Saved

“Most Saved” might be a good ranking, too. Users would only save an article, which had some kind of value to them. It is similar to bookmarking services like delicious.

All of these functions can be filtered by category, which makes it more useful for people, who are interested in a special topic. A “Most Popular”-teaser within a certain news department should show the best articles of that department only.

Depending on the article release frequency “Most Popular”-Teasers should display the best articles within a certain time range – last 24 hours or last week for instance. All time favourites will not change anymore after a while, since these articles are being viewed or commented even more because of the teasers.
A good way is to show recent articles on default and broader time ranges with tabs, so that people will get the best stories of the week or the month, if they missed something.

Digg - Time range tabs

At re:publica 09 I attended a very interesting workshop of Bicyclemark about Twitter and Journalism. I did some research by myself and here comes a short abstract on that topic.

Can Twitter be a substitute for professional journalism?

There have been some occasions when an event has been reported on Twitter before it has been reported by any other news source.

For example: Most people know about the landing of the airplane on the Hudson River in New York. Janis Krums saw the plane from a nearby ferry, took a picture and linked it on Twitter before TV stations or news agencies reported about it.
In theory, when everybody is tweeting, the mass will spread events earlier than the „old“ media“.
But there is a catch. People can only tweet what happened, but not how or why it happened. There still has to be somebody, who does the research after the event. Twitter is quick, but it can only scratch the surface of the things happening.

So Twitter will not be a substitute for professional journalism, but maybe it can be a great tool for journalists.

Journalists publish with Twitter

Publishers use Twitter already – but in different ways.

• Most online newspapers just link their articles on twitter (e.g. The Guardian), which makes it something like an RSS-Feed in a different environment.  It can be valuable, if there is a low tweet-frequency with articles of a special kind. A Twitter account with tweets for all articles of a big online newspaper can be very overwhelming.
• Some newspapers publish special content with Twitter.  For example the German Zeit Online runs a Twitter account with five Zeit journalists tweeting about anything they think is relevant for Zeit readers – a very athentic approach.
• More and more journalists also have private accounts. (f.e. David Pogue, NYT) Writing about themselves makes journalists more “human” for their readers and it can add a certain extra value besides their work for the newspaper.

Journalists doing research with Twitter

• Through the Twitter search and the #Hashtag you can get a pretty good idea about what moves people right now and what they think about the things happening. Twitter is a real time Zeitgeist machine that tells journalists, what people are interested in.
• Journalists, who have to do research for an article, can ask their followers, if anybody knows something about a special topic. If you have a thousand followers chances are good that there is one, who knows somebody else, who might know something.
  

A journalist, who also attended the workshop, told a nice story about this: He got information that the boy, who ran amok in Winnenden, announced it the day before on an imageboard called Krautchan. He didn’t know what Krautchan was, so he asked around through Twitter. He actually got feedback from a guy, who wrote his thesis about Krautchan. So they got in touch and soon after it became clear, that the announcement must have been a fake. Every other big newspaper in Germany – an even the authorities – accepted the announcement as true and wrote about it, just to call it off a day later.

• A pretty aggressive approach of doing research on Twitter comes from CNN. They try to recruit interview partners with Twitter. Again during the Winnenden tragedy – see @Clare20092009, though the account hasn’t been used since then.

Related articles:

Techcrunch – Plane Crashes In Hudson. First Pictures On Flickr, Tumblr, TwitPic

New York Times, David Pogue – Twitter? It’s what you make it.

The Guardian – Media Talk Podcast: Twitter @G20

ReadWriteWeb – How we use Twitter for Journalism

French company Ibernatus creates microsites for bands and film production as widgets, which users can embed on any website. The widget is 425 x 350 pixels and contains the information of a regular microsite. The interface is still clear and easy to handle and you are getting familiar with all widgets very quick as they are based on a similar navigation – like MySpace.

I think it is a nice and cheap alternative for music companies to spread out their content. Hope to see more from this.

via de:bug

WattzOn Chart

/

Recently some interesting concepts popped out about how consumers can save energy and carbon dioxide with tools on the web.

The basic idea is to gather data about your personal energy consumption and to draw conclusions from this.

/

WattzOn for example set up a database that covers the average energy need of most things you will use or benefit from in your life.  Users can help to add more things to the database or to improve existing data.

If you answer some questions about where you live, how you travel, which things you possess or what you eat, WattzOn will show you your energy consumption in total and by category. Then you can compare your result with the average energy consumption of people in other countries or WattzOn users.

WattzOn does not only calculate the amount of energy that is need to run your washing machine – like most energy tools do – it also adds the energy that is needed to actually create the washing machine.

In the end you get a pretty good idea about how you can reduce your carbon footprint most effectively.

Lately WattzOn announced cooperation with Wesabe, the online money management tool. Wesabe recommends users products based on price and user satisfaction, WattzOn adds energy consumption.

/

German energy provider E.ON started a closed pilot project to equip 10.000 households in Bavaria with an energy-tracking device that sends energy consumption data to an online portal. The portal than tells you when you spend how much energy, which will give you hints on what the biggest consumers are.  Unfortunately this offer is for E.ON customers only.

/

Google announced to start a very similar project (also still in closed beta) in cooperation with smart meter manufacturers. Google PowerMeter collects data from smart meters to show customers through an iGoogle widget when they spend how much energy.

Katie Fehrenbacher wrote a good article on Earth2Tech about the new market for saving energy.

What will the future of online journalism look like?

According to the New York Times – currently the benchmark for news-websites – quality news are soon going to be free and all over the web.

The NYT have been releasing a couple of open interfaces (APIs) to their database. With these APIs users are free to build applications that are fed with specific links and metadata from the NYT and spread it on the web. Giving away their content is actually supposed to lead users to the NYT website through these applications.

The idea is not new. There are many companies on the web that follow this strategy. Google for example lets users embed YouTube videos and maps on their websites, which raises the awareness of the brand and generates leads to Google’s own sites. But for publishers, which tend to protect their content, this is a pretty revolutionary step.

Hopefully it pays off for the NYT. Rumour has it that the paper is running into financial difficulties. But the strategy could increase their advertising income because of more visits, as well as establish new business models – commercial websites, who will pay for NYT content for instance.

The NiemanLab blog posted a review of the Times Open, the conference on which the APIs have been introduced to the public.

The Microsoft Office labs released a nice video presenting their vision of the year 2019.
It features multi-touch screens and sensors everywhere, interacting devices and amazing gadgets like electronic newspapers.
You will most likely find some inspiration even for designing today’s interfaces and interactions.
I would have loved to be part of one of these creative sessions. Must have been fun.

<br/><a href="http://video.msn.com/video.aspx?vid=a517b260-bb6b-48b9-87ac-8e2743a28ec5" target="_new" title="Future Vision Montage">Video: Future Vision Montage</a>

Comes via I started something, where you will find an extended version of the video.

Among German industry experts, Page also asked me for some input to the topic.

Unfortunately the article about the web is not on the web, but it is worth buying the magazine. The report gives you good insights about how people work on usability and describes many different methods. It is especially worthwhile, if you are new to the field.