SlideShare una empresa de Scribd logo
Marina Jurado @MarinaJG27
The	
  Watch	
  Reimagined	
  
Contenidos	
  
Introducción	
  
	
  Us	
  	
  
	
  The	
  Watch	
  Reimagined	
  
	
  
¿Para	
  qué	
  sirve?	
  Análisis.	
  
	
  Sensores	
  
	
  Hardware	
  
	
  Conclusiones	
  
	
  
Diseño	
  de	
  interacción	
  
	
  Gestos	
  
	
  Interfaz	
  
	
  Navegación	
  
	
  TipograAa	
  
	
  Icono	
  	
  
Tha	
  Watch	
  Reimagined.	
  
Introducción	
  
Cómo	
  nos	
  lo	
  venden.	
  
hCps://www.apple.com/watch/films/#film-­‐us	
  
US	
  
hCps://www.apple.com/watch/films/#film-­‐welcome	
  
The	
  Watch	
  
Reimagined	
  
¿Para	
  qué	
  sirve?	
  
Análisis.	
  
Sensores	
  
Heart	
  Rate	
  Sensor.	
  Pulsaciones.	
  
GPS.	
  Usa	
  el	
  del	
  iPhone.	
  
Acelerómetro.	
  Movimientos,	
  pasos.	
  
Tha	
  Watch	
  Reimagined.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Hardware	
  
Crown.	
  Click	
  para	
  Home.	
  Doble	
  click	
  	
  
para	
  úlRma	
  app.	
  Hold	
  para	
  Siri.	
  	
  
Scroll.	
  Desplazarse.	
  Zoom.	
  
Side	
  BuGon.	
  Acceso	
  a	
  contactos.	
  	
  
Apagar	
  y	
  encender.	
  
Tha	
  Watch	
  Reimagined.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Conclusiones	
  
Tha	
  Watch	
  Reimagined.	
  
Simplifica.	
  
Aprovecha	
  el	
  contexto.	
  
La	
  pantalla	
  es	
  muy	
  pequeña.	
  
iPhone.	
  
Necesitamos	
  uno	
  sí	
  o	
  sí.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Diseño	
  de	
  interacción	
  
Diseñadoras,	
  atentas.	
  
Gestos	
  
Tha	
  Watch	
  Reimagined.	
  
MulL-­‐gestos	
  
No	
  soportados.	
  
Tap	
  
Interacción	
  con	
  un	
  
solo	
  elemento.	
  
Force	
  Press	
  
Acceso	
  al	
  menú.	
  
Swipes	
  
Right/leY:	
  navegación	
  
Up:	
  Glances/Scroll	
  
Down:	
  NoRficaciones/Scroll	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Subir	
  y	
  mantener	
  la	
  muñeca	
  
NoRficaciones	
  y	
  ‘desbloquear’.	
  
Bajar	
  la	
  muñeca	
  
‘Bloquear’	
  la	
  pantalla.	
  
Gestos	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Interfaz,	
  tamaño	
  de	
  la	
  pantalla.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Interfaz,	
  tamaño	
  de	
  la	
  pantalla.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Interfaz,	
  tamaño	
  de	
  la	
  pantalla.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Interfaz,	
  elementos	
  de	
  diseño.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Interfaz,	
  glances.	
  
•  Lo	
  más	
  parecido	
  a	
  un	
  ‘widget’.	
  
•  Son	
  relevantes,	
  opcionales.	
  
•  No	
  Renen	
  scroll.	
  
•  Sólo	
  Renen	
  una	
  interacción.	
  
•  Llevan	
  a	
  una	
  parte	
  específica	
  
de	
  la	
  app.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Interfaz,	
  no1ficaciones.	
  
Similares	
  a	
  las	
  de	
  iPhone,	
  pero	
  con	
  caracterísRcas	
  diferentes	
  de	
  
personalización	
  y	
  canRdad	
  de	
  información.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Interfaz,	
  la	
  app.	
  
Imágenes	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Interfaz,	
  la	
  app.	
  
Grupos	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Interfaz,	
  la	
  app.	
  
Grupos	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Interfaz,	
  la	
  app.	
  
Botones	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Navegación,	
  paginada.	
  
Navegación	
  horizontal	
  para	
  items	
  equivalentes.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Navegación,	
  paginada.	
  
Navegación	
  paginada	
  en	
  los	
  glances.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Navegación,	
  jerarquica.	
  
Navegación	
  secuencial	
  para	
  items	
  subordinados.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Navegación,	
  jerarquica.	
  
Ejemplo	
  de	
  navegación	
  jerarquica.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Navegación,	
  menús.	
  
Acciones	
  secundarias,	
  no	
  necesariamente	
  relacionadas.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
TipograLa,	
  Bye	
  Bye	
  Helve1ca!	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
TipograLa,	
  Bye	
  Bye	
  Helve1ca!	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Tha	
  Watch	
  Reimagined.	
  
Icono,	
  similar	
  al	
  de	
  iPhone.	
  
Recursos	
  del	
  workshop	
  Apple	
  Watch	
  Design:	
  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/	
  
Gracias	
  
BARCELONA	
  
C.Pujades	
  51	
  
MADRID	
  
C.MaRlde	
  Díez	
  11	
  
LONDON	
  
Coming	
  Soon	
  
marina.jurado@slashmobility.com	
  
Marina Jurado @MarinaJG27

Más contenido relacionado

Destacado

Hands-On Workshop: Introduction to Coding for on Force.com for Admins and Non...
Hands-On Workshop: Introduction to Coding for on Force.com for Admins and Non...Hands-On Workshop: Introduction to Coding for on Force.com for Admins and Non...
Hands-On Workshop: Introduction to Coding for on Force.com for Admins and Non...
Salesforce Developers
 
ACCIONA ENERGIA EN MÉXICO: UNA ESTRATEGIA EMPRESARIAL CON VALOR SOCIAL
ACCIONA ENERGIA EN MÉXICO: UNA ESTRATEGIA EMPRESARIAL CON VALOR SOCIALACCIONA ENERGIA EN MÉXICO: UNA ESTRATEGIA EMPRESARIAL CON VALOR SOCIAL
ACCIONA ENERGIA EN MÉXICO: UNA ESTRATEGIA EMPRESARIAL CON VALOR SOCIAL
acciona
 
800001c huerto escolar_c
800001c huerto escolar_c800001c huerto escolar_c
800001c huerto escolar_c
Nancy Sofia Rincón Garcia
 
Dirección De Empresas 1a Parte
Dirección De Empresas 1a ParteDirección De Empresas 1a Parte
Dirección De Empresas 1a Parte
donmicrofono
 
Teaching Grammar Through Technology
Teaching Grammar Through TechnologyTeaching Grammar Through Technology
Teaching Grammar Through Technology
Transparent Language, Inc.
 
Stakeholder Management for Product Managers - ProductTank Paris
Stakeholder Management for Product Managers - ProductTank ParisStakeholder Management for Product Managers - ProductTank Paris
Stakeholder Management for Product Managers - ProductTank Paris
Jean-Yves SIMON
 
Crude oil
Crude oilCrude oil
Crude oil
Mohit Kumar
 
Virtual Goods in Asia
Virtual Goods in AsiaVirtual Goods in Asia
Virtual Goods in Asia
Benjamin Joffe
 
Rfid ppt
Rfid pptRfid ppt
Pintura en el quattrocento
Pintura en el quattrocentoPintura en el quattrocento
Pintura en el quattrocento
Filomena López
 

Destacado (10)

Hands-On Workshop: Introduction to Coding for on Force.com for Admins and Non...
Hands-On Workshop: Introduction to Coding for on Force.com for Admins and Non...Hands-On Workshop: Introduction to Coding for on Force.com for Admins and Non...
Hands-On Workshop: Introduction to Coding for on Force.com for Admins and Non...
 
ACCIONA ENERGIA EN MÉXICO: UNA ESTRATEGIA EMPRESARIAL CON VALOR SOCIAL
ACCIONA ENERGIA EN MÉXICO: UNA ESTRATEGIA EMPRESARIAL CON VALOR SOCIALACCIONA ENERGIA EN MÉXICO: UNA ESTRATEGIA EMPRESARIAL CON VALOR SOCIAL
ACCIONA ENERGIA EN MÉXICO: UNA ESTRATEGIA EMPRESARIAL CON VALOR SOCIAL
 
800001c huerto escolar_c
800001c huerto escolar_c800001c huerto escolar_c
800001c huerto escolar_c
 
Dirección De Empresas 1a Parte
Dirección De Empresas 1a ParteDirección De Empresas 1a Parte
Dirección De Empresas 1a Parte
 
Teaching Grammar Through Technology
Teaching Grammar Through TechnologyTeaching Grammar Through Technology
Teaching Grammar Through Technology
 
Stakeholder Management for Product Managers - ProductTank Paris
Stakeholder Management for Product Managers - ProductTank ParisStakeholder Management for Product Managers - ProductTank Paris
Stakeholder Management for Product Managers - ProductTank Paris
 
Crude oil
Crude oilCrude oil
Crude oil
 
Virtual Goods in Asia
Virtual Goods in AsiaVirtual Goods in Asia
Virtual Goods in Asia
 
Rfid ppt
Rfid pptRfid ppt
Rfid ppt
 
Pintura en el quattrocento
Pintura en el quattrocentoPintura en el quattrocento
Pintura en el quattrocento
 

Similar a Diseñando para Apple Watch

Abraham Barrera - dev-cross-mobile
Abraham Barrera - dev-cross-mobileAbraham Barrera - dev-cross-mobile
Abraham Barrera - dev-cross-mobile
StarTech Conference
 
Desarrollo Móvil Multiplataforma
Desarrollo Móvil MultiplataformaDesarrollo Móvil Multiplataforma
Desarrollo Móvil Multiplataforma
Abraham Barrera
 
Mas para Android
Mas para AndroidMas para Android
Mas para Android
Anahí Salgado
 
Presentacion tercera semana
Presentacion tercera semanaPresentacion tercera semana
Presentacion tercera semana
Javier Castro
 
Tranforma tu web a una aplicación
Tranforma tu web a una aplicaciónTranforma tu web a una aplicación
Tranforma tu web a una aplicación
Minimarket Maná
 
Portafolio Data Help 2014-2016
Portafolio Data Help 2014-2016Portafolio Data Help 2014-2016
Portafolio Data Help 2014-2016
Ricardo Guzmán R.
 
e-doceo 2009
e-doceo 2009e-doceo 2009
e-doceo 2009
Geomanaging
 
Primera Guia De La Unidad 2
Primera Guia De La Unidad 2Primera Guia De La Unidad 2
Primera Guia De La Unidad 2
audox
 
Multithreads Programming
Multithreads ProgrammingMultithreads Programming
Multithreads Programming
Paulino Huerta Sanchez
 
Mobile design 02 Recomendaciones para el diseño de aplicaciones móviles
Mobile design 02 Recomendaciones para el diseño de aplicaciones móvilesMobile design 02 Recomendaciones para el diseño de aplicaciones móviles
Mobile design 02 Recomendaciones para el diseño de aplicaciones móviles
Juan Paulo Madriaza
 
Guía de recursos digitales Carolina Averos 10 mo k
Guía de recursos digitales Carolina Averos 10 mo kGuía de recursos digitales Carolina Averos 10 mo k
Guía de recursos digitales Carolina Averos 10 mo k
CarolinaAveros
 
Guia iniciacion-app-inventor
Guia iniciacion-app-inventorGuia iniciacion-app-inventor
Guia iniciacion-app-inventor
RalAgundezGuantes
 
Layar & Hoppala
Layar & HoppalaLayar & Hoppala
Layar & Hoppala
Raúl Reinoso
 
Guia de iniciación en App Inventor
Guia de iniciación en App InventorGuia de iniciación en App Inventor
Guia de iniciación en App Inventor
Cristina Chandoha
 
Guia iniciacion-app-inventor
Guia iniciacion-app-inventorGuia iniciacion-app-inventor
Guia iniciacion-app-inventor
luis miguel LEÓN
 
Guia iniciacion-app-inventor
Guia iniciacion-app-inventorGuia iniciacion-app-inventor
Guia iniciacion-app-inventor
tecnologiacetis100
 
Guia iniciacion-app-inventor
Guia iniciacion-app-inventorGuia iniciacion-app-inventor
Guia iniciacion-app-inventor
Luis Gonzalo Hernández Giraldi
 
Guia iniciación App Inventor
Guia iniciación App InventorGuia iniciación App Inventor
Guia iniciación App Inventor
Nimrod Quintanilla
 
Ova
OvaOva
Inducción Promethean
Inducción PrometheanInducción Promethean
Inducción Promethean
remyor09
 

Similar a Diseñando para Apple Watch (20)

Abraham Barrera - dev-cross-mobile
Abraham Barrera - dev-cross-mobileAbraham Barrera - dev-cross-mobile
Abraham Barrera - dev-cross-mobile
 
Desarrollo Móvil Multiplataforma
Desarrollo Móvil MultiplataformaDesarrollo Móvil Multiplataforma
Desarrollo Móvil Multiplataforma
 
Mas para Android
Mas para AndroidMas para Android
Mas para Android
 
Presentacion tercera semana
Presentacion tercera semanaPresentacion tercera semana
Presentacion tercera semana
 
Tranforma tu web a una aplicación
Tranforma tu web a una aplicaciónTranforma tu web a una aplicación
Tranforma tu web a una aplicación
 
Portafolio Data Help 2014-2016
Portafolio Data Help 2014-2016Portafolio Data Help 2014-2016
Portafolio Data Help 2014-2016
 
e-doceo 2009
e-doceo 2009e-doceo 2009
e-doceo 2009
 
Primera Guia De La Unidad 2
Primera Guia De La Unidad 2Primera Guia De La Unidad 2
Primera Guia De La Unidad 2
 
Multithreads Programming
Multithreads ProgrammingMultithreads Programming
Multithreads Programming
 
Mobile design 02 Recomendaciones para el diseño de aplicaciones móviles
Mobile design 02 Recomendaciones para el diseño de aplicaciones móvilesMobile design 02 Recomendaciones para el diseño de aplicaciones móviles
Mobile design 02 Recomendaciones para el diseño de aplicaciones móviles
 
Guía de recursos digitales Carolina Averos 10 mo k
Guía de recursos digitales Carolina Averos 10 mo kGuía de recursos digitales Carolina Averos 10 mo k
Guía de recursos digitales Carolina Averos 10 mo k
 
Guia iniciacion-app-inventor
Guia iniciacion-app-inventorGuia iniciacion-app-inventor
Guia iniciacion-app-inventor
 
Layar & Hoppala
Layar & HoppalaLayar & Hoppala
Layar & Hoppala
 
Guia de iniciación en App Inventor
Guia de iniciación en App InventorGuia de iniciación en App Inventor
Guia de iniciación en App Inventor
 
Guia iniciacion-app-inventor
Guia iniciacion-app-inventorGuia iniciacion-app-inventor
Guia iniciacion-app-inventor
 
Guia iniciacion-app-inventor
Guia iniciacion-app-inventorGuia iniciacion-app-inventor
Guia iniciacion-app-inventor
 
Guia iniciacion-app-inventor
Guia iniciacion-app-inventorGuia iniciacion-app-inventor
Guia iniciacion-app-inventor
 
Guia iniciación App Inventor
Guia iniciación App InventorGuia iniciación App Inventor
Guia iniciación App Inventor
 
Ova
OvaOva
Ova
 
Inducción Promethean
Inducción PrometheanInducción Promethean
Inducción Promethean
 

Más de SlashMobility.com

Slashfriday Visual Data, estrategias para interpretar la información
Slashfriday Visual Data, estrategias para interpretar la informaciónSlashfriday Visual Data, estrategias para interpretar la información
Slashfriday Visual Data, estrategias para interpretar la información
SlashMobility.com
 
SlashFriday: Deep Personalization by MOCA
SlashFriday: Deep Personalization by MOCASlashFriday: Deep Personalization by MOCA
SlashFriday: Deep Personalization by MOCA
SlashMobility.com
 
SlashFriday. Aplicación al negocio de las redes neuronales artificiales
SlashFriday. Aplicación al negocio de las redes neuronales artificialesSlashFriday. Aplicación al negocio de las redes neuronales artificiales
SlashFriday. Aplicación al negocio de las redes neuronales artificiales
SlashMobility.com
 
Herramientas de diseño UI
Herramientas de diseño UIHerramientas de diseño UI
Herramientas de diseño UI
SlashMobility.com
 
Hablemos de sueños
Hablemos de sueñosHablemos de sueños
Hablemos de sueños
SlashMobility.com
 
Trabajo en equipo
Trabajo en equipoTrabajo en equipo
Trabajo en equipo
SlashMobility.com
 
Android Wear
Android WearAndroid Wear
Android Wear
SlashMobility.com
 
Customer Experience: vender lo material desde lo inmaterial
Customer Experience: vender lo material desde lo inmaterialCustomer Experience: vender lo material desde lo inmaterial
Customer Experience: vender lo material desde lo inmaterial
SlashMobility.com
 
El color, la herramienta más poderosa para diseñar tu app
El color, la herramienta más poderosa para diseñar tu appEl color, la herramienta más poderosa para diseñar tu app
El color, la herramienta más poderosa para diseñar tu app
SlashMobility.com
 
Trabajadores más productivos, motivados y felices gracias a los wearables
Trabajadores más productivos, motivados y felices gracias a los wearablesTrabajadores más productivos, motivados y felices gracias a los wearables
Trabajadores más productivos, motivados y felices gracias a los wearables
SlashMobility.com
 
Desarrollo con stack MEAN
Desarrollo con stack MEANDesarrollo con stack MEAN
Desarrollo con stack MEAN
SlashMobility.com
 
Marketing inbound para empresas B2B
Marketing inbound para empresas B2BMarketing inbound para empresas B2B
Marketing inbound para empresas B2B
SlashMobility.com
 
¿Gestionas tu tiempo o te lo gestionan?
¿Gestionas tu tiempo o te lo gestionan? ¿Gestionas tu tiempo o te lo gestionan?
¿Gestionas tu tiempo o te lo gestionan?
SlashMobility.com
 
Cómo dar vida a un personaje
Cómo dar vida a un personajeCómo dar vida a un personaje
Cómo dar vida a un personaje
SlashMobility.com
 
El combate del siglo: AngularJS vs ReactJS
El combate del siglo: AngularJS vs ReactJSEl combate del siglo: AngularJS vs ReactJS
El combate del siglo: AngularJS vs ReactJS
SlashMobility.com
 
App marketing-ecommbrunch
App marketing-ecommbrunchApp marketing-ecommbrunch
App marketing-ecommbrunch
SlashMobility.com
 
Cómo customizar una app
Cómo customizar una appCómo customizar una app
Cómo customizar una app
SlashMobility.com
 
Slash friday: Unity 3D - Pasando nuestra primera pantalla
Slash friday: Unity 3D - Pasando nuestra primera pantallaSlash friday: Unity 3D - Pasando nuestra primera pantalla
Slash friday: Unity 3D - Pasando nuestra primera pantalla
SlashMobility.com
 
Primeros pasos para crear un videojuego
Primeros pasos para crear un videojuegoPrimeros pasos para crear un videojuego
Primeros pasos para crear un videojuego
SlashMobility.com
 
Como diseñar para usuarios irracionales
Como diseñar para usuarios irracionalesComo diseñar para usuarios irracionales
Como diseñar para usuarios irracionales
SlashMobility.com
 

Más de SlashMobility.com (20)

Slashfriday Visual Data, estrategias para interpretar la información
Slashfriday Visual Data, estrategias para interpretar la informaciónSlashfriday Visual Data, estrategias para interpretar la información
Slashfriday Visual Data, estrategias para interpretar la información
 
SlashFriday: Deep Personalization by MOCA
SlashFriday: Deep Personalization by MOCASlashFriday: Deep Personalization by MOCA
SlashFriday: Deep Personalization by MOCA
 
SlashFriday. Aplicación al negocio de las redes neuronales artificiales
SlashFriday. Aplicación al negocio de las redes neuronales artificialesSlashFriday. Aplicación al negocio de las redes neuronales artificiales
SlashFriday. Aplicación al negocio de las redes neuronales artificiales
 
Herramientas de diseño UI
Herramientas de diseño UIHerramientas de diseño UI
Herramientas de diseño UI
 
Hablemos de sueños
Hablemos de sueñosHablemos de sueños
Hablemos de sueños
 
Trabajo en equipo
Trabajo en equipoTrabajo en equipo
Trabajo en equipo
 
Android Wear
Android WearAndroid Wear
Android Wear
 
Customer Experience: vender lo material desde lo inmaterial
Customer Experience: vender lo material desde lo inmaterialCustomer Experience: vender lo material desde lo inmaterial
Customer Experience: vender lo material desde lo inmaterial
 
El color, la herramienta más poderosa para diseñar tu app
El color, la herramienta más poderosa para diseñar tu appEl color, la herramienta más poderosa para diseñar tu app
El color, la herramienta más poderosa para diseñar tu app
 
Trabajadores más productivos, motivados y felices gracias a los wearables
Trabajadores más productivos, motivados y felices gracias a los wearablesTrabajadores más productivos, motivados y felices gracias a los wearables
Trabajadores más productivos, motivados y felices gracias a los wearables
 
Desarrollo con stack MEAN
Desarrollo con stack MEANDesarrollo con stack MEAN
Desarrollo con stack MEAN
 
Marketing inbound para empresas B2B
Marketing inbound para empresas B2BMarketing inbound para empresas B2B
Marketing inbound para empresas B2B
 
¿Gestionas tu tiempo o te lo gestionan?
¿Gestionas tu tiempo o te lo gestionan? ¿Gestionas tu tiempo o te lo gestionan?
¿Gestionas tu tiempo o te lo gestionan?
 
Cómo dar vida a un personaje
Cómo dar vida a un personajeCómo dar vida a un personaje
Cómo dar vida a un personaje
 
El combate del siglo: AngularJS vs ReactJS
El combate del siglo: AngularJS vs ReactJSEl combate del siglo: AngularJS vs ReactJS
El combate del siglo: AngularJS vs ReactJS
 
App marketing-ecommbrunch
App marketing-ecommbrunchApp marketing-ecommbrunch
App marketing-ecommbrunch
 
Cómo customizar una app
Cómo customizar una appCómo customizar una app
Cómo customizar una app
 
Slash friday: Unity 3D - Pasando nuestra primera pantalla
Slash friday: Unity 3D - Pasando nuestra primera pantallaSlash friday: Unity 3D - Pasando nuestra primera pantalla
Slash friday: Unity 3D - Pasando nuestra primera pantalla
 
Primeros pasos para crear un videojuego
Primeros pasos para crear un videojuegoPrimeros pasos para crear un videojuego
Primeros pasos para crear un videojuego
 
Como diseñar para usuarios irracionales
Como diseñar para usuarios irracionalesComo diseñar para usuarios irracionales
Como diseñar para usuarios irracionales
 

Diseñando para Apple Watch

  • 1. Marina Jurado @MarinaJG27 The  Watch  Reimagined  
  • 2. Contenidos   Introducción    Us      The  Watch  Reimagined     ¿Para  qué  sirve?  Análisis.    Sensores    Hardware    Conclusiones     Diseño  de  interacción    Gestos    Interfaz    Navegación    TipograAa    Icono     Tha  Watch  Reimagined.  
  • 3. Introducción   Cómo  nos  lo  venden.  
  • 6. ¿Para  qué  sirve?   Análisis.  
  • 7. Sensores   Heart  Rate  Sensor.  Pulsaciones.   GPS.  Usa  el  del  iPhone.   Acelerómetro.  Movimientos,  pasos.   Tha  Watch  Reimagined.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 8. Hardware   Crown.  Click  para  Home.  Doble  click     para  úlRma  app.  Hold  para  Siri.     Scroll.  Desplazarse.  Zoom.   Side  BuGon.  Acceso  a  contactos.     Apagar  y  encender.   Tha  Watch  Reimagined.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 9. Conclusiones   Tha  Watch  Reimagined.   Simplifica.   Aprovecha  el  contexto.   La  pantalla  es  muy  pequeña.   iPhone.   Necesitamos  uno  sí  o  sí.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 10. Diseño  de  interacción   Diseñadoras,  atentas.  
  • 11. Gestos   Tha  Watch  Reimagined.   MulL-­‐gestos   No  soportados.   Tap   Interacción  con  un   solo  elemento.   Force  Press   Acceso  al  menú.   Swipes   Right/leY:  navegación   Up:  Glances/Scroll   Down:  NoRficaciones/Scroll   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 12. Tha  Watch  Reimagined.   Subir  y  mantener  la  muñeca   NoRficaciones  y  ‘desbloquear’.   Bajar  la  muñeca   ‘Bloquear’  la  pantalla.   Gestos   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 13. Tha  Watch  Reimagined.   Interfaz,  tamaño  de  la  pantalla.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 14. Tha  Watch  Reimagined.   Interfaz,  tamaño  de  la  pantalla.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 15. Tha  Watch  Reimagined.   Interfaz,  tamaño  de  la  pantalla.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 16. Tha  Watch  Reimagined.   Interfaz,  elementos  de  diseño.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 17. Tha  Watch  Reimagined.   Interfaz,  glances.   •  Lo  más  parecido  a  un  ‘widget’.   •  Son  relevantes,  opcionales.   •  No  Renen  scroll.   •  Sólo  Renen  una  interacción.   •  Llevan  a  una  parte  específica   de  la  app.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 18. Tha  Watch  Reimagined.   Interfaz,  no1ficaciones.   Similares  a  las  de  iPhone,  pero  con  caracterísRcas  diferentes  de   personalización  y  canRdad  de  información.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 19. Tha  Watch  Reimagined.   Interfaz,  la  app.   Imágenes   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 20. Tha  Watch  Reimagined.   Interfaz,  la  app.   Grupos   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 21. Tha  Watch  Reimagined.   Interfaz,  la  app.   Grupos   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 22. Tha  Watch  Reimagined.   Interfaz,  la  app.   Botones   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 23. Tha  Watch  Reimagined.   Navegación,  paginada.   Navegación  horizontal  para  items  equivalentes.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 24. Tha  Watch  Reimagined.   Navegación,  paginada.   Navegación  paginada  en  los  glances.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 25. Tha  Watch  Reimagined.   Navegación,  jerarquica.   Navegación  secuencial  para  items  subordinados.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 26. Tha  Watch  Reimagined.   Navegación,  jerarquica.   Ejemplo  de  navegación  jerarquica.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 27. Tha  Watch  Reimagined.   Navegación,  menús.   Acciones  secundarias,  no  necesariamente  relacionadas.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 28. Tha  Watch  Reimagined.   TipograLa,  Bye  Bye  Helve1ca!   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 29. Tha  Watch  Reimagined.   TipograLa,  Bye  Bye  Helve1ca!   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 30. Tha  Watch  Reimagined.   Icono,  similar  al  de  iPhone.   Recursos  del  workshop  Apple  Watch  Design:  hCp://www.betahaus.es/event/workshop-­‐disena-­‐y-­‐programa-­‐tu-­‐app-­‐para-­‐apple-­‐watch/  
  • 31. Gracias   BARCELONA   C.Pujades  51   MADRID   C.MaRlde  Díez  11   LONDON   Coming  Soon   marina.jurado@slashmobility.com   Marina Jurado @MarinaJG27