Unveiling the genius of multi-touch interface design | Jeff Han

Jeff Han zeigt seinen bahnbrechenden Touchscreen

Übersetzung: Dominik Weickgenannt Lektorat: Christian Mathias

I'm really excited to be here today.

Ich bin wirklich begeistert heute hier sein zu dürfen,

I'll show you some stuff that's just ready to come out of the lab,

was ich euch zeigen werde kommt frisch aus dem Labor.

literally, and I'm really glad that you guys

und ich bin froh, dass ihr mit die ersten seid,

are going to be among the first to see it in person,

die dies sehen werden. Ich glaube, es wird

because I really think this is going to really change

die Art wie wir mit Maschinen interagieren nachhaltig verändern.

the way we interact with machines from this point on.

Now, this is a rear-projected drafting table.

Dies ist ein von hinten bestrahlter Zeichentisch, er ist ungefähr 90 cm breit

It's about 36 inches wide

and it's equipped with a multi-touch sensor.

und mit einem Mehrfach-Berührungssensor ausgestattet. Normale Berührungssensoren

Normal touch sensors that you see,

wie in einem Kiosk oder interaktiven Whiteboard

like on a kiosk or interactive whiteboards,

can only register one point of contact at a time.

registrieren nur einen Kontakt.

This thing allows you to have multiple points at the same time.

Dieses Ding erlaubt mehrere auf einmal.

They can use both my hands; I can use chording actions;

Man kann beide Hände nutzen, simultane Aktionen ausführen

I can just go right up and use all 10 fingers if I wanted to.

oder einfach alle 10 Finger benutzen.

You know, like that.

Einfach so.

Now, multi-touch sensing isn't completely new.

Mehrfach-Berührungssensoren sind nicht komplett neu.

People like Bill Buxton have been playing around with it in the '80s.

Leute wie Bill Buxton spielen seit den 80ern damit herum.

However, the approach I built here is actually high-resolution,

Unser Ansatz ist jedoch hochauflösend,

low-cost, and probably most importantly, very scalable.

erschwinglich und am wichtigsten - skalierbar.

So, the technology, you know,

Die Technologie ist nicht das aufregendste,

isn't the most exciting thing here right now,

other than probably its newfound accessibility.

sondern die neue Zugänglichkeit.

What's really interesting here is what you can do with it

Es ist aufregend was man damit tun kann

and the kind of interfaces you can build on top of it.

und welches Interface man darauf aufbauen kann.

So let's see.

So, for instance, we have a lava lamp application here.

Hier haben wir ein Lava-Lampen Programm.

Now, you can see,

I can use both of my hands to kind of squeeze and put the blobs together.

Ich benutze beide Hände und kann die Tropfen zusammendrücken.

I can inject heat into the system here,

Ich kann Hitze in das System integrieren

or I can pull it apart with two of my fingers.

oder sie mit zwei Fingern auseinander ziehen.

It's completely intuitive; there's no instruction manual.

Es komplett Intuitiv, es gibt keine Bedienungsanleitung.

Das Interface ist quasi nicht existent.

The interface just kind of disappears.

This started out as a screensaver app

Am Anfang war das ein Bildschirmschoner eines Doktoranten in

that one of the Ph.D. students in our lab, Ilya Rosenberg, made.

unserem Labor, Ilya Rosenberg. Hier kommt jedoch die wahre Identität heraus.

But I think its true identity comes out here.

Now what's great about a multi-touch sensor is that, you know,

Das geniale an Mehrfach-Berührungssensoren ist,

I could be doing this with as many fingers here,

dass ich das mit so vielen Fingern wie ich will tun kann,

but of course multi-touch also inherently means multi-user.

logischerweise folgt daraus auch eine Mehrbenutzer Fähigkeit.

Chris could be interacting with another part of Lava,

Chris könnte also mit einem andren Teil der Lava-Lampe interagieren,

while I play around with it here.

während ich hier herumspiele. Man könnte sich eine neue Art an Bildhauerei Werkzeugen vorstellen,

You can imagine a new kind of sculpting tool,

where I'm kind of warming something up, making it malleable,

ich mache etwas warm, verformbar,

and then letting it cool down and solidifying in a certain state.

und lasse es dann abkühlen und in einem bestimmten Zustand verfestigen.

Google should have something like this in their lobby.

Google sollte so etwas in ihrer Eingangshalle haben. (Gelächter)

(Laughter)

I'll show you a little more of a concrete example here,

Ich zeige euch ein etwas genaueres Beispiel.

as this thing loads.

This is a photographer's light-box application.

Das ist ein Bilder-Schaukasten Programm.

Again, I can use both of my hands to interact and move photos around.

Auch hier kann ich mit beiden Händen interagieren und die Bilder bewegen.

But what's even cooler is that if I have two fingers,

Was aber noch cooler ist, dass man mit zwei Fingern

I can actually grab a photo and then stretch it out like that really easily.

ein Photo nehmen und sehr einfach vergrößern kann.

I can pan, zoom and rotate it effortlessly.

Ich kann es problemlos stauchen, vergrößern und drehen.

I can do that grossly with both of my hands,

Man kann das mit beiden Händen machen

or I can do it just with two fingers on each of my hands together.

oder mit nur zwei Fingern von jeder Hand zusammen.

If I grab the canvas, I can do the same thing -- stretch it out.

Man kann die Leinwand nehmen und die gleichen Dinge tun - es vergrößern.

I can do it simultaneously, holding this down,

Man kann dies gleichzeitig tun, eines festhalten

and gripping on another one, stretching this out.

ein anderes so vergrößern.

Again, the interface just disappears here.

Wie gesagt, das Interface ist quasi nicht existent.

There's no manual.

Es gibt keine Bedienungsanleitung. Es passiert genau was man erwartet,

This is exactly what you expect,

especially if you haven't interacted with a computer before.

speziell wenn man zuvor noch keinen PC bedient hat.

Now, when you have initiatives like the $100 laptop,

Mit Initiativen wie dem 100 Dollar Laptop,

I kind of cringe at the idea

kräuselt es mich beim Gedanken daran, dass wir eine ganze neue Generation

of introducing a whole new generation to computing

von Leuten in die alte Maus-Windows-Klick Computer Bedienung einführen.

with this standard mouse-and-windows-pointer interface.

This is something that I think is really the way

Von jetzt an sollten wir meiner Meinung nach

we should be interacting with machines from now on.

so mit Maschinen interagieren. (Applaus)

(Applause)

Now, of course, I can bring up a keyboard.

Natürlich kann ich eine Tastatur einblenden.

(Laughter)

And I can bring that around, put that up there.

Kann sie hierher bewegen.

Obviously, this is a standard keyboard,

Das ist eine Standard Tastatur,

but of course I can rescale it to make it work well for my hands.

die man natürlich an die Größe der Hände anpassen kann.

That's really important, because there's no reason in this day and age

Heutzutage gibt es keinen Grund,

that we should be conforming to a physical device.

dass wir uns an physische Geräte anpassen müssen.

That leads to bad things, like RSI.

Das führt zu schlechten Dingen wie RSI.

We have so much technology nowadays

Wir haben heutzutage so viel Technologie,

that these interfaces should start conforming to us.

dass sich die Benutzeroberflächen an uns anpassen sollten.

There's so little applied now to actually improving

Es ist so wenig umgesetzt, wie wir die Interaktion

the way we interact with interfaces from this point on.

mit Benutzeroberflächen von jetzt an verbessern können.

This keyboard is probably actually the really wrong direction to go.

Die Tastatur ist wahrscheinlich der falsche Ansatz.

You can imagine, in the future, as we develop this kind of technology,

Ihr könnt euch vorstellen, dass wir eine Art Technologie entwickeln,

a keyboard that kind of automatically drifts as your hand moves away,

eine Tastatur die quasi automatisch unserer Hand folgt

and really intelligently anticipates which key you're trying to stroke.

und intelligent vorausahnt, welche Taste man versucht zu drücken.

So -- again, isn't this great?

Ist das nicht genial?

(Laughter)

Zuhörer: Wo ist dein Labor?

Audience: Where's your lab?

Jeff Han: I'm a research scientist at NYU in New York.

Jeff Han: Ich bin Forscher an der NYU in New York.

Here's an example of another kind of app. I can make these little fuzz balls.

Hier ist noch eine Beispielanwendung: Ich kann diese kleinen Bälle kreieren.

It'll remember the strokes I'm making.

Es merkt sich die Bewegungen die ich mache. Natürlich ist es auch mit allen Fingern möglich.

Of course I can do it with all my hands.

It's pressure-sensitive.

Es ist Drucksensitive, wie man sieht.

What's neat about that is,

Was hübsch daran ist, ich habe euch zuvor die Zwei-Finger-Geste gezeigt

I showed that two-finger gesture that zooms in really quickly.

mit der man zoomen kann. Man muss nicht zum Hand-Werkzeug

Because you don't have to switch to a hand tool

or the magnifying glass tool,

oder Vergrößerungsglas-Werkzeug wechseln;

man kann immer weiter Dinge in verschiedenen Maßstäben machen, alles zur gleichen Zeit.

you can just continuously make things

in real multiple scales, all at the same time.

I can create big things out here,

Ich kann hier große Dinge kreieren und dann schnell zurückgehen

but I can go back and really quickly go back

to where I started, and make even smaller things here.

zum Anfang und noch kleinere Dinge dort machen

This is going to be really important

Das wird immer wichtiger in Dingen wie für z.B. die Datendarstellung

as we start getting to things like data visualization.

Ich denke uns hat allen Hans Rosling's Rede gefallen

For instance, I think we all enjoyed Hans Rosling's talk,

and he really emphasized the fact I've been thinking about for a long time:

und er hat den Punkt betont, über den ich auch schon lange Zeit nachdenke:

We have all this great data,

Wir haben diese großen Datenmengen, die aus irgendwelchen Gründen nicht benutzt werden.

but for some reason, it's just sitting there.

We're not accessing it.

Wir benutzen sie nicht wirklich. Einer der Gründe ist, denke ich,

And one of the reasons why I think that is

will be helped by things like graphics and visualization and inference tools,

- uns wird von Dingen wie Grafiken, Visualisierungen und Ableitungswerkzeugen geholfen.

but I also think a big part of it

Ein weiterer Brocken ist, dass wir bessere Benutzeroberflächen haben werden,

is going to be having better interfaces,

to be able to drill down into this kind of data,

mit der wir in die Tiefe dieser Daten eindringen können, dabei aber den Blick fürs Ganze nicht verlieren.

while still thinking about the big picture here.

Let me show you another app here. This is called WorldWind.

Hier eine weitere Applikation namens WorldWind.

It's done by NASA.

Von der NASA gemacht - eine Art Google Earth

We've all seen Google Earth;

this is an open-source version of that.

nur in Open-Source. es gibt Plugins

There are plug-ins to be able to load in different data sets

mit deinen man verschiedene Datensätze, die die NASA gesammelt hat, laden kann.

that NASA's collected over the years.

As you can see, I can use the same two-fingered gestures

Wieder die gleichen Zwei-Finger Gestiken

zum einfachen Rein- und Rauszoomen. Es gibt kein wirkliches Interface.

to go down and go in really seamlessly.

There's no interface, again.

It really allows anybody to kind of go in --

Es erlaubt einem hinein zu gehen - macht einfach was man erwarten würde.

and it just does what you'd expect, you know?

Noch mal - es gibt kein Interface.

Again, there's just no interface here. The interface just disappears.

I can switch to different data views.

Ich kann zwischen den verschiedenen Darstellungen wechseln.

That's what's neat about this app here.

NASA's really cool.

Bitteschön. Die NASA ist ziemlich cool. Es gibt Ansichten

These hyper-spectral images are false-colored so you can --

die eingefärbt sind - gut um die vegetative Ausnutzung zu ermitteln.

it's really good for determining vegetative use.

Well, let's go back to this.

Das gute an diesen Kartographieprogrammen -

The great thing about mapping applications --

es ist nicht wirklich 2D, es ist quasi 3D. Mit dem Mehrpunkt Interface

it's not really 2D, it's 3D.

So, again, with a multi-point interface, you can do a gesture like this --

kann man Gestiken wie diese machen um die Ansicht zu kippen.

so you can be able to tilt around like that --

(Surprised laughter)

Es ist keine starre 2D Verschiebung und Bewegung.

It's not just simply relegated to a kind of 2D panning and motion.

This gesture is just putting two fingers down --

Diese Gestik haben wir entwickelt, man legt 2 Finger so auf den Bildschirm,

it's defining an axis of tilt -- and I can tilt up and down that way.

und definiert die Ache für die Neigung und kann in so die Ansicht drehen.

We just came up with that on the spot,

Das fiel uns direkt ein;

it's probably not the right thing to do,

es ist wahrscheinlich nicht der richtige Weg

but there's such interesting things you can do with this interface.

aber es gibt so viele interessante Dinge die man mit dieser Art Interface machen kann.

It's just so much fun playing around with it, too.

Es macht so viel Spaß damit herumzuspielen. (Gelächter)

(Laughter)

And so the last thing I want to show you is --

Das letzte was ich euch zeigen wollte -

I'm sure we can all think of a lot of entertainment apps

uns fallen hier ohne ende Unterhaltungsapplikationen ein

that you can do with this thing.

die man damit machen kann.

I'm more interested in the creative applications we can do with this.

Ich bin mehr an kreativen Programmen interessiert die man damit machen kann.

Now, here's a simple application here -- I can draw out a curve.

Dies ist ein sehr einfaches Programm - Ich male eine Kurve.

And when I close it, it becomes a character.

Sobald ich sie schließe, wird daraus eine Figur.

But the neat thing about it is I can add control points.

Das coole daran ist, ich kann Kontrollpunkte hinzufügen

And then what I can do is manipulate them with both of my fingers at the same time.

Und sie mit beiden Fingern gleichzeitig manipulieren.

And you notice what it does.

Bei näherer Betrachtung

It's kind of a puppeteering thing,

sieht es aus wie Puppenspiel, bei dem man

where I can use as many fingers as I have to draw and make --

so viele Finger wie man hat zum Malen und Agieren nutzen kann.

Now, there's a lot of actual math going on under here

Dem liegt einiges an Mathematik zugrunde

for this to control this mesh and do the right thing.

um diese Gebilde zu kontrollieren damit es das richtige Tut.

This technique of being able to manipulate a mesh here, with multiple control points,

Die Technologie ein solches Gebilde mit mehreren Kontrollpunkten

zu kontrollieren, ist modernste Technologie.

is actually state of the art.

It was released at SIGGRAPH last year.

Sie wurde dieses Jahr bei der Siggraph veröffentlicht,

It's a great example of the kind of research I really love:

es ist ein klasse Beispiel für die Forschung, die ich liebe.

All die Prozessorleistung eingesetzt um Dinge richtig reagieren zu lassen,

all this compute power to make things do the right things,

intuitive things, to do exactly what you expect.

quasi intuitiv. Zu machen was man erwartet.

So, multi-touch interaction research is a very active field right now in HCI.

Mehrberührungsinteraktions-Forschung ist ein sehr aktives Feld in der Mensch-Computer-Interaktion.

I'm not the only one doing it, a lot of other people are getting into it.

Ich bin nicht der einzige der dies tut, einige Leute da draußen fangen damit an.

This kind of technology is going to let even more people get into it,

Diese Art von Technologie wird es immer mehr Leute ermöglichen sich dafür zu begeistern

I'm looking forward to interacting with all of you over the next few days

und ich bin wirklich gespannt mit euch allen in den nächsten Tagen zu reden

um zu sehen wo wir dies in euren Gebieten einsetzen können.

and seeing how it can apply to your respective fields.

Dankeschön.

Thank you.

(Applaus)

(Applause)