Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld...

35
Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems
  • date post

    19-Dec-2015
  • Category

    Documents

  • view

    216
  • download

    0

Transcript of Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld...

Page 1: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Zoetrope:Interacting with the Ephemeral Web Eytan Adar, Mira DontchevaJames Fogarty, Dan Weld

University of Washington & Adobe Systems

Page 2: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

The Dynamic Web

WWW

Page 3: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

The Now WebSee the web through a browser of “now” Access services through

an index of “now”

Temporally insensitive(ignore temporal context and historical values)

Page 4: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Is this really a good price?

Page 5: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Is this really a good price?

When is really the right time to buy?

Page 6: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

What is the relationship between weather and traffic in Seattle?

Page 7: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

What is the relationship between traffic and temperature in Seattle?

Now what?

Manually collect, page by page

Page 8: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

traffic and temperature in Seattle?an alternative…

t

t

Temp

Travel time

Page 9: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Related Work

• Evolution of the Web [Fetterly et al., WWW ‘03][Ntoulas et al., WWW ‘04] Internet Archives

Photo

Page 10: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Related Work

• Evolution of the Web • Monitoring

[Sugiura & Koseki, UIST ’98][Greenberg & Boyle, GI ‘06]Photo

Page 11: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Related Work

• Evolution of the Web • Monitoring• Clipping & Aggregating

[schraefel et al., WWW ‘02][Dontcheva et al., UIST ‘07]

Photo

Page 12: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Our Approach

Page 13: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Zoetrope Architecture

CrawlerWeb

Data StoreXML/Images/Text/…

Zoetrope Engine … …O1 O2 O3

Zoetrope Front End

R1 R2 R3

Page 14: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Content Streams & Operators

{… <Ti , Ci> , <Ti+1 , Ci+1> , …}

Time stamp

Content (typed, but can be anything: HTML, images)

Page 15: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Content Streams & Operators

{… <Ti , Ci> …} Transform Operator

Filter Operator

Render Operator

Output: Content stream with modified data payloads (Ci’)

Input: Content Stream

Output: Subset of Content StreamOutput: “Visual” Output

Page 16: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Construct everything from operators

Lens, locked to coordinate

{… <Ti , Ci> …} Generate Images

Crop to Rectangle

Pick image based on

slider

Render into lens

Page 17: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Construct everything from operators

{… <Ti , Ci> …} Select DOM forest

Extract numerical

value

Render into time series

<…> $49.10 <…><…> $4310 <…><…> $44.10 <…><…> $50.20 <…> 49.10 43.10

44.10

50.20

Page 18: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

LENSES

Page 19: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Visual (same place on screen)

Page 20: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Structural (same place in HTML)

DOM Structure

Page 21: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Content (same text)

Page 22: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Filters

Page 23: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

RENDERERS

Page 24: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.
Page 25: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.
Page 26: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.
Page 27: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Binding Lenses

Page 28: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Demo

Page 29: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Contributions

• Visual programming toolkit for temporal Web content• Semantics for temporal data streams• Operators for fast processing of temporal

data streams• Indexing structures for fast processing and

interaction with Web content over time

Page 30: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Future Work

• Evaluation– User Study– Performance

Page 31: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Future Work

• Evaluation– User Study– Performance

• Data gathering

Page 32: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Information Arbitrage

• Combine observations to improve granularity

cnn.com

Weather.com

time

Page 33: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Future Work

• Evaluation– User Study– Performance

• Data gathering• Scaling up

Page 34: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Possible Distributed Architecture

• Server collects snapshots• Client collects finer resolution– Gaps?

• DHT for collected data (good for intervals)• Query: operator chain + data– Release on similarity threshold– Repeat

Page 35: Zoetrope: Interacting with the Ephemeral Web Eytan Adar, Mira Dontcheva James Fogarty, Dan Weld University of Washington & Adobe Systems.

Thanks!

Jaime Teevan, Susan Dumais, Rob Miller , GRAIL, DUB

NSF Graduate Fellowship, ARCS, WRF/TJ Cable Professorship

?