18. Paradigmi di interazione uomo macchina (III)

Corso di Interazione Uomo MacchinaAA 2014-2015

Roberto Polillo

Corso di laurea in InformaticaUniversità di Milano BicoccaDipartimento di Informatica, Sistemistica e Comunicazione

Evoluzione dei paradigmi di interazione (III)

Edizione 2014-15

Le macro-fasi

1960 1970 1980 1990 2000

Teletype

Personal computer

Web

Terminali video

Mobiles

R.Polillo - Aprile 2015

3

Il World Wide Web

4

Tim Berners-Lee (1995)

"I just had to take the hypertext idea and connect it to the TCP Protocol and Domain Name System ideas and – Ta-da! – the World Wide Web!”

R.Polillo - Marzo 2015

Web 1.0

MS ExplorerAmazoneBayIPO Netscape

1990 1 2 3 4 5 6 7 8 9 2000 2001 2002

First web siteat

CERN

W3CNetscape NavigatorYahoo

Mosaic

GoogleMozilla

NapsterPaypal

R.Polillo - March 2015

Narrowband connection


Web 1.0 Typical applications

Corporate Web sites Portals and search engines eCommerce [Corporate portals]


Web 1.0 main success stories

http://www.amazon.com from 1995Current size:http://www.wolframalpha.com/input/?i=amazon.com

http://www.ebay.com from 1995Current size:http://www.wolframalpha.com/input/?i=ebay.com

http://www.yahoo.com from 1994, always among the first 5 more visited sites


Interfaccia nel Web׃ non solo Point & click

testo attivo immagini attive bottoni Tabs forms esecuzione di programmi client side


9

http://www.amazon.com/

Italy: the beginning


10

VideoOnLine (Grauso, 1994 → Tin.it, 1996)

(1996)

In sintesi…


link

BROWSER

File HTML

Virtualizzazone / globalizzazione della rete12

Da dove provengono i servizi?


Desktop vs Web

E’ dubbio che il modello desktop sia il più adatto al nuovo contesto (documenti locali vs pagine Web)

Varie proposte per risolvere il problema dell’affollamento dello schermo, es.: - immergere le pagine in uno spazio 3D, in cui vedo in lontananza le

pagine precedentemente aperte - usare per i siti web la metafora del libro (vedi WebBook e

WebForager) …


13

Esempio: WebBook & Web Forager

XEROX PARC, 1996 Interfaccia (prototipo) per web Obiettivo: ridurre i costi di accesso

all’informazione utilizzata più di frequente Metafora del libro

S.K.Card, G.G.Robertson, W.York, The WebBook and the Web Forager: An Information Workspace for the World Wide Web, 1996


14

Come cambia l’interfaccia con il web

1. dalla singola pagina web come unità di interazione, a un aggregato più ampio (metafora del libro: “WebBook”):- tutte le pagine del sito (raggiungibili dalla home page con URL relativi), pre-loaded per velocità di accesso

2. da un ambiente di lavoro contenente un singolo elemento a un ambiente contenente una pluralità di elementi (WebForager)


15

WebBook

link esterni al WebBook(chiude il libro e ne apre un altro)

link interni al WebBook(sfoglia il libro)


Sfogliare le pagine di un WebBook


Vedere un WebBook attraverso la “Document Lens”


Web Forager

Livello 1: Focus Place

per interazione direttacon il contenuto

Livello 2: Immediate Memory Place

per il materiale in uso(spostamento in 3D)Livello 3:

Tertiary Storage per WebBooks usati

di recenteR.Polillo - Marzo 201519

Il bookcase per i WebBook


IPO (Initial Public Offering) frenzy


21

dot.com frenzy started by Netscape IPO (Aug 9, 1995) Founded 18 months earlier 16 M$ revenues, no profit Market cap at IPO: 1 B$ (!)

Large venture capital, to bring startups to IPO Many irrealistic business models NASDAQ bubble, then fall (2000-2001) Silicon Valley stops completely

The "dot.com bubble”

MS ExplorerAmazoneBayIPO Netscape

1990 1 2 3 4 5 6 7 8 9 2000 2001 2002

First web site atCERN

W3CNetscape NavigatorYahoo

Mosaic

GoogleMozilla

NapsterPaypal

Max NASDAQ

9/11

MinNASDAQ

Nasdaq Composite Index

March 10 2000: index at 5132

March 10 2000: index at 5132

Oct 9 2002: index at 1114Oct 9 2002:

index at 1114


22

Web 2.0 key aspects

Social media:Not the hypertext pages, but the user is the leading actor User interaction throu the Web: one-to-many (blog), many-to-many (social media) Services to host User Generated Content (UGC), to be shared with other users Collective creation User rating in e-commerce "Market are conversations" (Cluetrain manifesto, 1999-2000)

The Web as a computing platform: Online services, virtualization Perpetuale beta Component and service mashups Rich Internet Applications (RIA) technologies


Web 2.0

2000 1 2 3 4 5 6 7 8 9 10 11 12

Twitter, Slideshare, ScribdGoogle DocsYouTube

, Joomla, NingFlickr,

Facebook

Skype WordPressBlogger LinkedIn iPhone

GrouponAndroid, Dropbox

FoursquareWhatsApp

iPad, PinterestInstagram

Google+

Wikipedia

(In red start of mobile Web)

Internet traffic

video


Xmas 2006

Media acknowledge the paradigm change


Another bubble?

Netscape IPO

Google IPOAug 19 2004

LinkedIn IPO(NYSE)

Facebook IPO

Twitter IPO(NYSE)

1994

1995

1997

1996

March 10 2000:5049

(Indice Nasdaq 1994-2013) R.Polillo - March 2015

In the meanwhile, telephony changes…


Firs

t Web

site

at C

ERN

Mos

aic (N

CSA)

W3C

; Net

scap

e Nav

igat

or

Netsc

ape

IPO,,

MS

Expl

orer

, Am

azon

, eBa

y

Boom

and

fall

of N

ASDAQ

G

oogl

e IP

O; Fac

eboo

k

91 92 93 94 95 96 97 98 99 00 01 02 03 04 05 06 07 08 0990 10 11 12

WEB 1.0 WEB 2.0crisisPre-history

Googl

e fo

unde

d9/

11; W

ikip

edia

Fina

ncia

l cris

i

iPho

ne, A

ndro

id

Twitt

er

iPad

FB IP

O

Nasdaq Composite Index

YouT

ube

Internet traffic

video


SMS

2 GNokia 5110

GSM (candybar)SMS, watch, sveglia, rubrica, calcolatrice, rubrica, giochi, suonerie

MMS

WAP

2.5 GMotorola V3 RAZR

"Feature phone"GPRS (candybar, clamshell) + MMS,,photocamera, email, (Internet)

Touch phone

iPhone+ multitouch, sensors, GPS, app, …

3 G

Blackberry

"Smartphone"+ alphanumeric kb, PDA, video, GPS, radio, MP3, OS, …Mobile telephony

TIM,

Omnitel

Firs

t Web

site

at C

ERN

Mos

aic

(NCS

A)

W3C

; Net

scap

e Nav

igat

or

Netsc

ape

IPO,,

MS

Expl

orer

, Am

azon

, eBa

y

Boom

and

fall

of N

ASDAQ

G

oogl

e IP

O; Fac

eboo

k

91 92 93 94 95 96 97 98 99 00 01 02 03 04 05 06 07 08 0990 10 11 12Goo

gle

foun

ded

9/11

; Wikip

edia

Fina

ncia

l cris

i

iPho

ne, A

ndro

id

Twitt

er

iPad

FB IP

O

YouT

ube

Internet traffic

video


IP telephony

Skype Internet based video-telephony, free Starting 2003, acquired by eBay in 2005, then by

Microsoft in 2011 (8,5 B$) 2012: 700 ml accounts; one third of all international calls

pass through Skype Jan 2013: 50 ml concurrent users

WhatsApp Free SMS via IP Started in 2009, acquired by Facebook in 2014 (19 B$)


Mobile cellular subscriptions (total and per 100 inhabitants)



Le macro-fasi

1960 1970 1980 1990 2000

Teletype

Personal computer

Web

Terminali video

Mobiles


33

"Guarda, parla, cammina"34


Video

Guardate come Nokia ipotizzava il cellulare del futuro nel 2006, e confrontatelo con ciò che esiste ora

http://it.youtube.com/watch?v=92uaW9K6QEk

http://it.youtube.com/watch?v=LN0vVf-a9V0


35

Apple iPhone and iPad

2007 2010


Multi-touch

https://developer.apple.com/library/ios/documentation/userexperience/conceptual/mobilehig/InteractivityInput.html


37

Android

Linux based mobile OS Initially developed by Android Inc., acquired by Google in

2005 Open-source First android phone: end 2008 Today the largest market share for mobile OS


Guarda, parla, cammina

Portabilità, piccole dimensioni Utilizzabile in movimento Context-aware Occhio sul mondo Sensori sul mondo

Comunicazione vocale


39

Mobile installed base (World)


40

Camera eyes: QRCODE


Augmented reality


Augmented reality


Augmented reality

https://www.youtube.com/watch?v=L9UPWPgVlDo

Non solo turismo e manutenzione:https://www.youtube.com/watch?v=NqUSfjTSLyo


44

But we cannot do everything with a small, portable device…

Mob

ile a

nd c

loud

com

putin

g ar

e st

rong

ly rel

ated

CLOUD

Tks Lara Ciccarelli per i disegni R.Polillo - March 2015

And now…

https://www.youtube.com/watch?v=ErpNpR3XYUw apr 2012

http://www.youtube.com/watch?v=fNATuCkRWFE feb 2013


Apple watch (2015)


https://www.apple.com/watch/guided-tours/

Smartphone voice assistant

Apple Siri: in iPhone 4S ott 2011, in iPad in set 2012Demo: https://www.youtube.com/watch?v=MtwVQhEXCcc

Google Voice Search/Google now: ottobre 2012, orientato al search

Microsoft Cortana: 2014 http://bgr.com/2014/04/14/cortana-vs-siri-vs-google-now

Il futuro anche nei sistemi di guida di autoveicoli


48

18. Paradigmi di interazione uomo macchina (III)

Education