Aplicación móvil de las bibliotecas de la Universidad de Salamanca
Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas
-
Upload
collegi-oficial-de-bibliotecaris-i-documentalistes-de-la-comunitat-valenciana-cobdcv -
Category
Education
-
view
719 -
download
0
description
Transcript of Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas
![Page 1: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/1.jpg)
SEMINARIO: Web móvil. Desarrollo de APPs y aplicación en bibliotecas
David ManiegaICAlia Solutions – CTO
www.icalia.es
![Page 2: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/2.jpg)
dmaniega icaliasolutions
David ManiegaCo-Fundador y Director de Tecnología (CTO)
www.icalia.es www.davidmaniega.me
![Page 3: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/3.jpg)
Qué vamos a ver
• Concepto de movilidad• Características• ¿Necesito una app?• Consejos y herramientas• Apps para bibliotecas } Preguntas
![Page 4: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/4.jpg)
Nomofobia en España
http://madrid.theappdate.com/informe-apps-2013/
![Page 5: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/5.jpg)
Nomofobia en España
http://madrid.theappdate.com/informe-apps-2013/
![Page 6: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/6.jpg)
Nomofobia en España
http://madrid.theappdate.com/informe-apps-2013/
![Page 7: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/7.jpg)
Nomofobia en España
http://madrid.theappdate.com/informe-apps-2013/
![Page 8: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/8.jpg)
Nomofobia en España
http://madrid.theappdate.com/informe-apps-2013/
![Page 9: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/9.jpg)
Nomofobia en España
http://madrid.theappdate.com/informe-apps-2013/
![Page 10: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/10.jpg)
![Page 11: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/11.jpg)
¿Cómo era la web?
• 90’s --------------- 640 x 480px• 2000 -------------- 800 x 600 px• 2005 -------------- 1024 x 768 px
![Page 12: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/12.jpg)
¿Y ahora?
![Page 13: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/13.jpg)
![Page 14: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/14.jpg)
Despejemos dudas
Mobile optimization best practices book
![Page 15: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/15.jpg)
Web móvil o App nativa
![Page 16: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/16.jpg)
El dilema: Web móvil vs App
![Page 17: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/17.jpg)
Responsive Web Design
![Page 18: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/18.jpg)
“Una manera de presentar nuestro contenido sin saber en qué dispositivo va a verse.”
Ethan Marcotte
![Page 19: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/19.jpg)
¿pero, qué es exactamente?
• Un diseño sensible al contexto en el que se visualiza (viewport).
• Imágenes y vídeos escalables.• HTML5 (ya vivía con nosotros).• Media Queries
![Page 20: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/20.jpg)
Media Queries
http://mediaqueri.es/
![Page 21: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/21.jpg)
Ventajas
• Menos coste de mantenimiento (1 site)• Mejor SEO y usabilidad• Reutilización en diversos dispositivos• Opciones de elementos enriquecidos• Menor peso / mayor tasa transferencia
![Page 22: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/22.jpg)
Inconvenientes
• Supone complejidad técnica (novedoso)• No hay mucha gente especializada• Curva de aprendizaje amplia• Costes de migración • Incompatiblidad de algunos navegadores
![Page 23: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/23.jpg)
Consejos
• Diseña en pequeño, piensa en móvil primero• Prioriza lo importante primero
– Contenido (clave)– Navegación (auxiliar - Flyout)
• Legibilidad (mínimo 16px)• Si optas por eliminar algo para la versión
móvil, simplemente elimínalo de todas partes• No tengas miedo al scroll móvil
![Page 24: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/24.jpg)
Frameworks de desarrollo
http://responsive.vermilion.com/compare.php
Responsive CSS Framework Comparison
http://getbootstrap.com/
http://foundation.zurb.com/
http://www.getskeleton.com/
![Page 25: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/25.jpg)
RWD Testing
http://mattkersley.com/responsive/
![Page 26: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/26.jpg)
RWD Testing
http://www.juicecreative.co.uk/juicer/
![Page 27: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/27.jpg)
RWD Testing
http://www.iammobile.co.uk/
![Page 28: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/28.jpg)
Creación de una App
![Page 29: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/29.jpg)
“Diseño no es sólo cómo se ve o se percibe algo, diseño es cómo funciona.”
![Page 30: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/30.jpg)
Pasos para crear una app
1. Tener una idea clara…, de verdad2. Rodéate de un buen equipo3. Conoce el ecosistema lo máximo posible4. ¿Android, iOS, Windows Phone…?5. Interfaz amigable6. Funcionalidad clara7. Plan de mercado, difusión
![Page 31: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/31.jpg)
Diseñar apps - Reglas
• Sencillo (es difícil) - es +
• Honesto, directo, es lo que es y no otra cosa
• Visual (friendly, sexy)
• Funcional (va solo, no me hace pensar)
1
2
3
4
![Page 32: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/32.jpg)
Diseño UI/UX
Análisis de requisitos
![Page 33: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/33.jpg)
Diseño UI/UX
Diseño conceptual
![Page 34: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/34.jpg)
Diseño UI/UX
Prototipa, sin finhttp://popapp.in
![Page 35: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/35.jpg)
Diseño UI/UX
Diseño e implementación
![Page 36: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/36.jpg)
Diseño UI/UX
Lanzamiento y mantenimiento
![Page 37: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/37.jpg)
Diseño UI/UX
Evaluación y medición
![Page 38: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/38.jpg)
Consejos fundamentales
• Fácil de usar, cumple su objetivo y punto
• Eficiente, no más de 3 pasos para una tarea
• Memorable, fomentar capacidad de recuerdo
• Anticípate a los errores (gestión avisos)
![Page 39: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/39.jpg)
Consejos fundamentales
• Si se pierde tu usuario… “irritación”
• Muestra el camino (cumple las metas usuario)
• Consistencia = no cambies las reglas del juego ni visual ni funcional
• Implementa mejoras, no te rindas
![Page 40: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/40.jpg)
Herramientas
• Mockups y prototipado:– POP: https://popapp.in/– Cacoo: https://cacoo.com/lang/es/– Invisionapp: http://www.invisionapp.com/
• Inspiración:– Behance: http://www.behance.net/– Patterntap: http://patterntap.com/
![Page 41: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/41.jpg)
¿Qué sistema operativo?
![Page 42: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/42.jpg)
Frameworks de desarrollo
http://developer.android.com/sdk/installing/studio.html
https://developer.apple.com/xcode/
Plataformas back-end + cloud hostinghttps://parse.com/https://developers.google.com/appengine/
![Page 43: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/43.jpg)
Frameworks de desarrollo
http://www.markus-falk.com/mobile-frameworks-comparison-chart/
![Page 44: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/44.jpg)
Estadísticas app
http://www.google.com/analytics/mobile/
![Page 45: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/45.jpg)
Estadísticas app
http://www.flurry.com/
![Page 46: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/46.jpg)
Apps de bibliotecas
![Page 47: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/47.jpg)
Una gran oportunidad
• Pocos ejemplos fuera de EEUU• Mercado por explotar, hay vida más allá del
OPAC• Buscar los servicios que usan los usuarios• Pocas opciones pero útiles• Dinamización, una buena opción• Contenido multimedia, es el rey sin duda
![Page 48: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/48.jpg)
Toma de decisiones
• ¿Conocemos a nuestros usuarios, sus hábitos de consumo de nuestros servicios y productos?
• ¿Entendemos las tendencias de uso que se hacen de los dispositivos móviles? ¿Los usamos de forma natural para comprenderlos mejor y saber qué oportunidades nos presentan?
![Page 49: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/49.jpg)
Toma de decisiones
• ¿Sabemos lo que quieren los usuarios que se haga desde las bibliotecas? ¿Les hemos preguntado alguna vez? ¿Qué servicios, productos o servicios se comportan bien en un entorno móvil?
• ¿Por qué queremos tener una presencia móvil? ¿Qué sería "genial" encontrarse en una aplicación móvil?
![Page 50: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/50.jpg)
Toma de decisiones
• ¿Estamos preparados para comprender los usos que se derivan de una aplicación móvil?
• ¿Y nuestra "competencia", qué está haciendo al respecto?
• ¿Qué sería para nosotros un caso de éxito en el entorno móvil, o cómo nos gustaría que fuera?
![Page 51: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/51.jpg)
Ejemplos
• Bibliotecas de Universidad de Salamanca
![Page 52: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/52.jpg)
Ejemplos
• New York Public Library
![Page 53: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/53.jpg)
Ejemplos
• Red Lectura Pública País Vasco
![Page 54: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/54.jpg)
Recuerda…
![Page 55: Web móvil. Desarrollo de Apps y Aplicación en Bibliotecas](https://reader033.fdocuments.co/reader033/viewer/2022052217/5592e1b01a28ab22138b46b9/html5/thumbnails/55.jpg)