Post on 09-Jul-2020
La Web 3.0 i el Mobile
Marketing
Montserrat Peñarroya i Farell
Barcelona, juny 2013
• Evolució de la xarxa • La Web 3.0 • Per què ens interessa el Marketing per Mòbil. • Breu història del mòbil. • Com saber quant passar-nos al Màrketing Mòbil. • El Marketing Mobile en aplicacions de tercers. • La publicitat. • Quin tipus d’aplicacions podem utilitzar. • Els codis de bidimensionals. • La realitat augmentada. • La NFC.
2
Avui veurem
La Web 1.0
Breu Història d’Internet
4
El primer módem
Neix ARPANET
Protocol TCP/IP i
la paraula Internet
1.000 ordinadors connectat
s
10.000 ordinadors connectat
s
100.000 ordinadors connectat
s
Neix el WWW
Neix Mosaic 1993
58 67 82 84 87 89 91 93
5
Les webs dels anys 90
La web 2.0
• No és una nova tecnologia, ni una forma de programació, és una altra forma d’entendre Internet: – Internet com a eina bidireccional de comunicació. – Espai ple d’aplicacions que ens permeten treballar
des de qualsevol ordinador. – Espai en el que les aplicacions interactuen entre
elles.
• També és una moda i una estètica: – Existeix el look 2.0
7
Les diferents dimensions de la Web
2.0
8
Neixen tots els Social Media
Sites
9
Neixen totes les xarxes socials
Web 3.0
• Les bases de dades són estàndards.
– Els programes interactuen bé entre ells i s’entenen.
– Es poden començar a aplicar algoritmes que simulen intel·ligència.
• Internet esdevé mòbil perquè tothom fa servir aplicacions al núvol.
– Els dispositius utilitzen la geolocalització.
– Apareix la realitat augmentada.
11
Els pilars de la 3.0
Per què ens interessa el
Marketing per Mòbil
• Es troba permanentment connectat.
• L’usuari el porta sempre a sobre.
• És un aparell més personal que un ordinador.
• Permet localitzar on es troba el consumidor.
• Segons Microsoft, al 2013 hi haurà més internautes navegant per dispositius mòbils que per ordinador. En realitat, ara = 55%
• El 86% dels internautes de mòbil ho fan mentre miren televisió (als EEUU [segons MS])
13
El mòbil és interessant com a
suport per:
Breu història de la
telefonia mòbil
• El primer mòbil el va crear Motorola durant la Segona Guerra Mundial.
15
Els orígens
• De nou, és Motorola qui crea el primer telèfon “mòbil”.
• Aquesta imatge és de Martin Cooper, al 1973.
16
Anys 70
• Al 1989 apareix el
primer telèfon
semblant als que fem
servir a l’actualitat.
17
Anys 80
• Al 1994 es comencen
a fabricar en sèrie els
telèfons amb GSM.
18
Anys 90
• Al 1993 IBM fabrica el
primer telèfon amb
PDA.
19
Anys 90
• Nokia presenta el primer Smartphone
20
1998
• Es fabrica el primer
mòbil amb pantalla
tàctil.
21
2000
• Microsoft crea el
primer tablet pc.
22
2000
• Tots els empleats
d’empreses
tecnològiques tenen
un mòbil i una PDA.
23
Entre el 2003 i el 2005
• Es popularitza
la Blackberry.
24
2006
• Neix el primer iPhone
25
2007
• Apple crea el primer iPad.
26
2010
• Cada vegada n’hi ha més.
• El iPad és el més extès però totes les marques d’ordinador o de mòbil van treure al mercat un tablet durant el 2012.
27
Els tablets
Els mòbils ara
29
Quins serveis s’utilitzen més
Font: Microsoft TAG
Font: Informe sobre Societat de la Informació de Telefònica – 2012
http://www.fundacion.telefonica.com/es/que_hacemos/convocatorias/detalle/25_
01_2012_amb_3432
30
Informe de Telefònica
31
Segons Google Public data
32
Segons Google Public Data
Com saber quan hem passar-
nos al Marketing mòbil?
• Analitzar quin percentatge de les visites al nostre lloc web actual ja venen des de dispositius mòbils.
• Analitzar quin rati de rebot tenen (si el tenen molt alt vol dir que no poden navegar bé pel nostre lloc web)
• Si tenim objectius configurats i veiem que ningú que entra per mòbil els acompleix, vol dir que hem de millorar la versió per mòbil del lloc web.
34
Al nostre Google Analytics
• Analitzar quin percentatge de les visites al nostre lloc web actual ja venen des de dispositius mòbils.
35
Al nostre Google Analytics
36
Marketing Mòbil a través
d’aplicacions de tercers
FOUR SQUARE
38
• Cada dia es realitzen
2 milions de Check-
in’s.
• Hi ha 10 milions
d’usuaris actius.
39
40
Creació d’ofertes
• https://es.foursquare.com/v/hotel-restaurant-diego/4db81c7e93a04a7c3078e1f6
41
• Check-in Special: és una promoció normal. • Especial per a grups: es dóna quan un nombre de
terminat de persones juntes fan un check-in. • Especial amics: es dóna quan més de 3 amics van
junts i fan un check-in. • Flash Special: (per exemple, als primers 10
clients que arribin a partir de les 9) • Especial nous clients: la primera vegada. • Especial Fidelització: (per exemple, la 3a vegada
que vens) • Mayor Special: descompte extra per al Major.
42
Diferents tipus de promoció
Incitar a fer el check-in
Indicar a la porta de l’establiment que es pot fer un check-in és una bona idea
43
44
Un munt de gent no sap que existeix
Cal reclamar el
compte
45
46
ALTRES SERVEIS DE
GEOLOCALITZACIÓ
47
48
Facebook Places
49
Google+
50
Concurs de fotos
http://web.stagram.com/n/nh_hoteles/
Els usuaris voten la
més maca a través
dels “like”.
Instagram Trip + Concurs +
Exposició
http://statigr.am/tag/catalunyaexperience#/grid
Agència Catalana de Turisme, amb el #CatalunyaExperience
• Concurs de fotos per
la imatge de ATO
Natura, a través de
Instagram i Facebook.
Marketing Col·laboratiu
• http://web.stagram.com/n/igersgirona
La publicitat als mòbils
55
Publicitat a les aplicacions de
tercers
• Les principals són: – Admob (de Google)
http://www.admob.com/
http://www.google.com/ads/admob/
– iAd (d’Apple) http://advertising.apple.com/brands/
• També hi ha agències especialitzades. http://www.reiniciate.es
http://www.antevenio.es
56
Les plataformes publicitàries
57
Integrat a les aplicacions
El cas Auto Week (revista de cotxes)
1. Crea aplicació per mòbil i la dóna a conèixer a través de les plataformes intermediaries (itunes, etc).
2. Contracta publicitat a Admob per donar a conèixer l’aplicació.
3. Esdevé suport de Admob per tenir anuncis de tercers en la seva aplicació i monetitzar la inversió.
58
Tipus d’aplicacions per a
mòbils
SMS
• L’objectiu és
alertar l’usuari
de noves
informacions.
• El cost és baix.
60
Webs primitives
• L’objectiu és proveir l’usuari amb informació de forma senzilla.
• El cost és baix.
61
62
Web no mòbil vs Web mòbil
• L’aplicació es
connecta a lloc web i
recull la informació a
través del RSS.
63
Aplicacions creades per RSS
64
Aplicacions natives
• Programes i aplicacions especialment creades per a telèfons mòbils, sense un equivalent en web.
• El cost és alt.
65
Jocs
• L’objectiu és entretenir (oci)
• El cost és molt alt.
• El lloc web: – Els podem trobar a través de Google. – Els usuaris hi accedeixen quan necessiten informació
immediatament. – Podem arribar-hi des d’un codi bidimensional. – Utilitzen web stantards. – Pots tenir una aplicació web en menys de 2 setmanes.
• Les aplicacions: – Permeten una millor usabilitat i una millor navegació. – Permeten utilitzar les eines del mòbil (càmera, llibreta de
direccions, etc.) – No necessiten connexió a Internet. – Existeixen mercats d’aplicacions on trobar-les.
66
Quina és la millor opció
Web i Web Mòbil:
Sol·lucions
• Si el teu lloc web utilitza Wordpress o altres CMS standard, en principi, s’ha de veure bé des d’un mòbil. Però a més:
– Existeixen plugins que adapten el CSS del teu lloc web a la pantalla de mòbil.
– Existeixen plugins que detecten quan el navegador és d’un mòbil i redirigeixen el lloc web a l’interface per mòbil.
68
Plugins
• Cal suprimir el flash, el javascript i el AJAX.
• El flash pot ser substituït per Jquery.
• Mirar de no utilitzar coses incrustades (alguns mòbils no les veuen bé)
• Cal seguir els estàndards de programació que marca l’W3C per a mòbil:
– http://validator.w3.org/mobile/
69
Adaptar la programació
70
71
• Cal crear un full d’estils especial per a mòbil: un CSS que s’activa quan el navegador és un navegador de mòbil.
• L’amplada ha de ser de 120 píxels màxim (cal tenir-ho en compte per les imatges)
• No es fan servir ni coordenades ni mides absolutes, només mides relatives.
72
Crear una web mòbil
• La capçalera ha de ser el més horitzontal i estreta que es pugui (mirar bé el logo).
• El contingut es posa en forma de llistat en una sola columna.
• Per navegar es fan servir les “molles de pa” (camí de navegació).
• El menú es posa al principi o al final de la pàgina.
73
Adaptar el disseny
• Gratis si ho fas tu mateix a mà.
• Gratis si utilitzes alguna eina que t’ho fa (Google en té una)
• 1.500 euros (aprox.) si ho fa una empresa especialitzada.
74
Quin cost té?
Les Webs responsive
76
77
El disseny “Responsive”
79
La programació
d’aplicacions
• Són aplicacions creades especialment per a telèfon mòbil.
• No disposen d’un suport web específic.
81
Aplicacions Natives
82
83
Tipus d’aplicacions
Millora de la
productivitat Utilitats Jocs Eines
Alguns exemples
84
85
Museització de la Roca dels Bous
• Desplegament de xarxa WIFI
a la Roca
• Creació d’aplicació per a la
visita guiada.
• Terminals iPad pels visitants.
• Continguts extres per a web i
per a mòbil.
• Aplicació específica per a clubs de Fitness.
• L’edita l’editorial Artic Outdoor (editors de la revista Evasión).
• Fins ara, creen revistes per a 16 clubs de fitness.
• Amb aquesta aplicació els usuaris poden guardar dades sobre els seus exercicis, i rebre les noticies i comunicacions dels seus clubs.
• Cost: des de 600€/mes fins a 1.800€/mes.
Fit Mag
86
• Permeten la compra
online i el pagament a
través de Pay Pal o de
Google Wallet.
87
Tendes per mòbil
Mòbil i carrer
89
• Hi ha diferents tipus de codis: – QR (Quick Response Barcode) i els Datamatrix.
• Cal descarregar-se un programa específic per a llegir-los.
• Informen sobre el producte o el servei que els està mostrant.
90
Com funcionen
91
Codi QR
• La més utilitzada: http://qrcode.kaywa.com/
• Per fer-la en colors i amb més opcions:
http://www.qrstuff.com/
• Recomanacions Impressió:
• 2x2 cm, o de 12x12 mm amb 300 ppp.
• Amb un espai mínim en blanc al voltant de 4 mm.
• Amb aquestes mides pot ser escanejat a 10 cm. A més distància, impressió més gran.
• Sobre superfície plana, no rugosa ni reflectant.
92
93
QR Personalitzat. Permet combinar
formes, colors i fotos.
http://www.unitaglive.es/q
rcode
94
Per què serveixen
• Per donar a conèixer
informació.
• Per realitzar ofertes.
• Per publicar la nostra
URL.
Publicitat en paper i QR
Serveix per ampliar la informació (cal que aporti alguna cosa més que un link a la web)
QR i Apps
Anunci en paper
per descarregar
una aplicació
QR i Web
Banner de
Meteocat a la web
de Gencat.cat
97
Traçabilitat dels
productes
Amb un QR s’ofereix informació sobre l’origen del producte
Tonyina 3.0 - l’Ametlla de Mar
Origen de les matèries primes
http://www.youtube.com/watch?v=ungNOZX9IkQ&feature=player_embedded
QR que porta a un vídeo on s’explica com es conrea el blat a la Plana de Vic
El Bibliotren
Publicitat en QR
Anuncien una botiga de eBooks a través de galetes amb codis QR
Compra online
Al metro de Seul, 10.287 clients van visitar la tenda online i les vendes van creixer un 130%
http://webhostinggeeks.com/blog/qr-codes-are-you-using-them-to-your-best-marketing-advantage/
QR per promoció del
destí
http://www.youtube.com/watch?v=_uEAfTrCYpk
http://www.youtu
be.com/watch?v=_
uEAfTrCYpk
Codis per donar més
informació en museus
http://www.museosdetenerife.org/eve_articulo.php?ID=2463&al_id_mus=5
Recorregut turístic/cultural
Joc i QR
http://www.youtube.com/watch?v=1N6EdgN3FUU
EL QR és una ombra que només es pot llegir de 12 a 13h i conté ofertes puntuals. Objectiu: incrementar les vendes al mig dia
Joc amb la creació del
QR
Construeixen un
QR amb llimones
http://www.youtube.com/watch?feature=player_embedded&v=Q_3iM3T0Bvc
QR amb imatges i vídeos
http://es.tendencias.yahoo.com/suite-porno-con-c%C3%B3digo-qr.html
Carta interactiva per a
Restaurant
Els clients poden veure els plats en 6 idiomes.
Consultable des del restaurant mateix o des de qualsevol altre lloc.
Connectat al lloc web / a un microsite / a una pàgina de Facebook...
Cost aprox. de 850 €
110
111
Control d’accés
Passbook:
entrades amb
codis bidi
112
Aplicacions per connectar amb el teu
públic
Campanya de Durex amb un bebé virtual que neix al fregar 2 mòbils
https://www.youtube.com/watch?v=ngFL7mVu838
QR + públic objectiu
Axe, creant un forat
a la paret del WC a
partir d’un QR
http://www.youtube.com/watch?v=VqBohMhOlL8
Empresa Valenciana que es dedica a
personalitzar QR
Al seu Facebook,
parlen de bones i
males pràctiques, i
inspiren.
https://www.facebook.com/QrTuning
La realitat augmentada
Aplicada a Turisme Cinematogràfic
Mostra les pel·lícules que s’han rodat en aquest indret.
Aplicada a enriquir la publicitat
A través d’una pantalla gegant, la gent interactua amb un personatge de realitat augmentada
https://www.youtube.com/watch?v=rFuUFeQIdpk
ídem
National Geogràfic permet interactuar amb animals prehistòrics
https://vimeo.com/32028559
També per publicitat en paper
Catàleg amb AR
d’Audi R8
Catàleg ampliat
https://www.youtube.com/watch?v=QQ8HNXtl7jQ
Catàleg 2013 del
IKEA, amb AR
Nous públics objectius
https://www.youtube.com/watch?v=lXsQrwYYzEU
Nova generació de
cromos de Panini
ídem
http://www.youtube.com/watch?v=4FlME__oeKg
Aplicació de Pringles
a través del mòbil i
un paquet de chips
123
Aplicació per provar
productes
Per emprovar-te
ulleres
Per emprovar-te joies
Descarregues
l’aplicació i retalles
les mostres
http://www.youtube.com/watch?feature=player_embedded&v=hBoEg1i6sHE
Informació turística
Info sobre destins
TMB - Virtual
Bus Turístic de Barcelona
Agenda Cultural
L’Agenda Cultural es pot veure en forma de capa de realitat augmenta amb Layar.
Realitat augmentada
controlada per la mirada
131 http://www.youtube.com/watch?v=A4pDf7m2UPE&feature=related
Realitat augmentada
(nivell avançat)
http://vimeo.com/15690594
Google també hi treballa
Veure vídeo: http://www.youtube.com/watch?feature=player_embedded&v=9c6W4CCU9M4
Actualització
http://www.youtube.com/watch?v=V6Tsrg_EQMw
Hi ha un munt de
vídeos per
Youtube
NFC (near field communication)
Què és la NFC?
Permet llegir
informació acostant
el mòbil a un
dispositiu emissor
NFC tag
Etiqueta que
transmet
informació en NFC
Es preveu que substitueixi els
QR en un futur
En resum
• És important que pensem en el mòbil com a suport per als nostres continguts.
• També és important que en tinguem en compte com a suport publicitari.
• Hem vist diferents maneres de realitzar Marketing per Mòbil.
• Hem vist diferents aplicacions. • Entendre la importància del context (hem de ser
proveïdors de contextos). A continuació: Empreses que ens poden ser d’utilitat
i bibliografia.
140
Resumint
• TAG Microsoft (2011) The Growth of Mobile Marketing http://tag.microsoft.com/community/tag-blog-item/11-03-21/The_Growth_of_Mobile_Marketing_and_Tagging.aspx?category=industry
• Informe de Telefónica sobre la Societat de la Informació a Espanya http://sociedadinformacion.fundacion.telefonica.com/DYC/SHI/InformesSI/
• Pablo López (2010) Como adaptar una web para móvil. http://inclusion.es/2009/02/22/como-disenar-un-interfaz-web-para-movil/
• 3 Easy Steps to Optimize Web Apps for iPhone
http://samsoff.es/posts/3-easy-steps-to-optimize-web-apps-for-iphone
141
Bibliografia relacionada
• PPT sobre xifres del Mmkting al món: http://www.slideshare.net/HubSpot/50-mobilefactsdeck62812
• Mobile abilities map: http://www.slideshare.net/helgetenno/mobile-abilities-map
142
Info interessant
MOLTES GRÀCIES
Tel. 935377605 - Mòb. 639141269
montse@quadrantalfa.com
www.montsepenarroya.com
www.facebook.com/Montserrat.Penarroya
www.Twitter.com/montsepenarroya
143