Charla donde se explican las nociones más importantes que una persona no técnica debe conocer si quiere aventurarse al desarrollo de Apps.

1. @asanzdiego @_David_Jorge
Y si quiero desarrollar
mi propia app, ¿qué
debo hacer?

2. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

3. @asanzdiego @_David_Jorge
¿Quién somos?

4. @asanzdiego @_David_Jorge
Consultor y desarrollador de apps.
@_David_Jorge
david.jorge@appconcept.es
David Jorge

5. @asanzdiego @_David_Jorge
Asesor. Formador. Desarrollador.
@asanzdiego
http://about.me/asanzdiego
Adolfo Sanz De Diego

6. @asanzdiego @_David_Jorge
Hackathon Lovers
Comunidad de amantes de los hackathones.
@HackathonLovers
http://hackathonlovers.com

7. @asanzdiego @_David_Jorge
Nuestros números
+20 hackathones
+220 proyectos
+2400 hackers

8. @asanzdiego @_David_Jorge
JustiApps - #HackTheJustice
Integra tecnología y derecho
para mejorar la Justicia.
@JustiApps
http://www.justiapps.com

9. @asanzdiego @_David_Jorge
¿Cómo?
concurso ideas
debates y foros
hackathon

10. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

11. @asanzdiego @_David_Jorge
Tipos de Apps
web
nativas
híbridas

12. @asanzdiego @_David_Jorge
Aplicaciones web
Sitios web adaptados a
teléfonos/tabletas.
No se instalan en el
dispositivo.
Accedemos mediante el
navegador.

13. @asanzdiego @_David_Jorge
Aplicaciones web
Capacidades limitadas a
las del navegador.
Son las más rápidas de
desarrollar.
Son las más económicas.

14. @asanzdiego @_David_Jorge
Responsive Web Design

15. @asanzdiego @_David_Jorge
Aplicaciones nativas
Se desarrollan para una
plataforma.
Acceso a todas las
capacidades del
dispositivo.
Se pueden distribuir en
los marketplaces.

16. @asanzdiego @_David_Jorge
Aplicaciones nativas
Requieren más tiempo
de desarrollo.
Resultan más caras.
Para juegos o
aplicaciones complejas.

17. @asanzdiego @_David_Jorge
Android
80% de los terminales.
Se desarrollan con Java.
Google Play:
- Las aplicaciones son
aprobadas
automáticamente.
- Tasa de 25$ una vez en la
vida.
- Los usuarios las prefieren
gratis con publicidad.

18. @asanzdiego @_David_Jorge
iOS
15% de los terminales.
Se desarrollan con
Objective-C y/o Swift.
App Store:
- Las aplicaciones son
minuciosamente revisadas.
- Tasa de 99$ anuales.
- Los usuarios están más
acostumbrados a pagar.

19. @asanzdiego @_David_Jorge
Aplicaciones híbridas
App web incrustadas en
aplicación nativa.
Se desarrolla para todas
las plataformas.
Acceso a muchas
capacidades del
dispositivo.

20. @asanzdiego @_David_Jorge
Aplicaciones híbridas
Se pueden distribuir en
los marketplaces.
Son más económicas que
las nativas.
Mejor opción para
aplicaciones sencillas.

21. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

22. @asanzdiego @_David_Jorge
Requisitos de un App
Web/Nativa/Híbrida.
Gestión de usuarios.
Integración con otras
web.

23. @asanzdiego @_David_Jorge
Requisitos de un App
Panel para
administradores.
Multilingüe.
Servicios push.

24. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

25. @asanzdiego @_David_Jorge
Capacidades de los dispositivos
Teléfono: llamadas.
Agenda: contactos.
3G, WiFi: internet.
Bluetooth, NFC:
conectividad.

26. @asanzdiego @_David_Jorge
Capacidades de los dispositivos
Acelerómetro,
giroscopio,
magnetómetro:
dirección y orientación.
GPS: posición.
Cámara: fotos y vídeos.
Otros sensores: luz,
humedad, proximidad...

27. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

28. @asanzdiego @_David_Jorge
● Dependerá de:
○ Complejidad y tamaño funcionalidad principal.
○ La cantidad de extras.
○ Número de requisitos de la App.
○ Número de capacidades del dispositivo que usa.
○ Diseño, usabilidad y accesibilidad de la App.
○ Calidad de la App.
○ Tiempo de desarrollo.
¿Cuánto cuesta una App?

29. @asanzdiego @_David_Jorge
Tienes que elegir

30. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

31. @asanzdiego @_David_Jorge
“desarrollar transporte aéreo”
Ejemplo MVP

32. @asanzdiego @_David_Jorge
“Vamos a desarrollar el Concorde”

33. @asanzdiego @_David_Jorge
Resultado: motor a reacción

34. @asanzdiego @_David_Jorge
“Vamos a desarrollar un ala delta”

35. @asanzdiego @_David_Jorge
Resultado: ultraligero

36. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

37. @asanzdiego @_David_Jorge
La idea
Mi proyecto está ideado.
¡Me voy a forrar!
Pero es sólo una idea...

38. @asanzdiego @_David_Jorge
¿Qué problema resuelve?
¿Va a ser realmente útil o
es sólo mi necesidad?
¿Hay ya otras apps
similares? ¿Me puedo
diferenciar?
¿Cual va ser mi modelo
de negocio? ¿Dinero,
popularidad, otro?

39. @asanzdiego @_David_Jorge
Funcionalidad principal
¿Qué funcionalidad
quiero que tenga?
¿Qué es básico, deseado
y extras?
¿Qué no hace ni es?

40. @asanzdiego @_David_Jorge
Definiendo la idea, creando el proyecto
Tener bien claro el
objetivo principal de mi
aplicación.
Escribir, describir y
dibujar la app.

41. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

42. @asanzdiego @_David_Jorge
¿Puedo hacer un boceto?
Sí: hazlo tú mismo.
No: contrata un experto
diseñador.

43. @asanzdiego @_David_Jorge
Realizar bocetos
Herramientas y webs
para realizar bocetos:
● balsamiq.com
● gomockingbird.com
● mockupbuilder.com
● mockflow.com
● hotgloo.com
● invisionapp.com
● justproto.com
● proto.io
● inpreso.com
Consejo: busca bocetos ya hechos para seguir como ejemplo.

44. @asanzdiego @_David_Jorge
Experto en UX.
Experto en Apps
(no sólo webs)
Elegir diseñador

45. @asanzdiego @_David_Jorge
Que conozca varias
plataformas.
Generales: precio,
localización, horarios,
experiencia, seriedad,
dedicación, etc.
Elegir diseñador

46. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

47. @asanzdiego @_David_Jorge
El diseño
¿Hay presupuesto?
Sí: contrato diseñador.
No: Apariencia nativa
con diseño básico.
“Quiero un diseño especial, diferente, moderno,
elegante, interesante, brillante, atractivo, …”

48. @asanzdiego @_David_Jorge
Adaptar el contenido.
Transiciones entre pantallas.
Animaciones de elementos.
Mensajes, pop ups y alertas.
La interacción
Una App no es una secuencia de imágenes.

49. @asanzdiego @_David_Jorge
Rotaciones y orientaciones.
Tamaños de pantallas.
¡Ojo con lo que tapa el teclado!
En un monitor se ve muy bien
¿y en el móvil?
La adaptabilidad
Una App se ejecuta en distintos dispositivos

50. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

51. @asanzdiego @_David_Jorge
Del diseño al desarrollo
Limitaciones del tipo de
app (web/nativa/mixta)
Habilidades del
desarrollador.

52. @asanzdiego @_David_Jorge
Desarrollo
Método de trabajo con el
desarrollador.
Comunicación.
Antes de empezar.
¿Algo para probar?
Al empezar.
Plan de trabajo.
Entregables.

53. @asanzdiego @_David_Jorge
Comienzan los problemas :(
Problemas técnicos.
Diseño no amigable.
Problemas funcionales.
Bugs. ¡En producción!
Pruebas + Control
crashes.

54. @asanzdiego @_David_Jorge
Luz al final del túnel
Primera versión beta.
¿Usuarios de prueba?

55. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

56. @asanzdiego @_David_Jorge
Listos para publicar
Publicamos.
¿Campaña?
¿Cómo va el
presupuesto?

57. @asanzdiego @_David_Jorge
Salida a los marketplaces
App SEO, Web para app.
Promociones, invitación.
+Marketing -Dinero.
Reportes y Analytics.

58. @asanzdiego @_David_Jorge
Sobreviviendo al paso del tiempo
Usuarios:
○ Opiniones.
○ Cómo usan la app.
○ Votaciones. Reseñas.
Actualizaciones y
avances tecnológicos en
las plataformas.

59. @asanzdiego @_David_Jorge
0. Quienes somos
1. Tipos de apps
2. Requisitos apps
3. Capacidades
4. Cuánto cuesta
5. El MVP
6. La idea
7. El boceto
8. El diseño
9. El desarrollo
10. La publicación
11. Autodidactas

60. @asanzdiego @_David_Jorge
Generadores de Apps:
● appsgeyser.com
● infinitemonkeys.mobi
● espartapp.com
● upplication.com
● appinventor.org
Moocs:
● codecademy.com
● tutellus.com
● miriadax.net
● udacity.com
● coursera.org
● edx.org
● udemy.com
Autodidactas

61. @asanzdiego @_David_Jorge
Créditos
● http://blackhold.nusepas.com/2013/01/como-quieres-tu-proyecto/
● http://blogs.wsj.com/cmo/2015/05/26/mobile-isnt-killing-the-desktop-internet/
● http://en.wikipedia.org/wiki/File:Ala_delta_sobrevolando_la_Sierra_de_Villafranca.JPG
● http://en.wikipedia.org/wiki/File:British_Airways_Concorde_G-BOAC_03.jpg
● http://en.wikipedia.org/wiki/File:Engine.f15.arp.750pix.jpg
● http://thenounproject.com/term/blueprint/1050/
● http://thenounproject.com/term/cloud-learning/161514/
● http://thenounproject.com/term/competency-based-assessment/27464/
● http://thenounproject.com/term/design/60427/
● http://thenounproject.com/term/developer/6324/
● http://thenounproject.com/term/drag-and-drop/49665/
● http://thenounproject.com/term/people/112754/
● http://thenounproject.com/term/users/64761/
● http://thenounproject.com/term/whistle/5215/
● http://thenounproject.com/term/whiteboard/93458/
● http://thenounproject.com/term/wireframe/21874/
● http://upload.wikimedia.org/wikipedia/commons/1/10/Business_Model_Canvas.png
● http://www.flaticon.com/free-icon/app-store-apple-symbol_34356
● http://www.flaticon.com/free-icon/business-graphic-triangle_46972
● http://www.flaticon.com/free-icon/cart-of-ecommerce_14674
● http://www.flaticon.com/free-icon/circular-pie-chart_8810
● http://www.flaticon.com/free-icon/credit-card-with-discount-percentage_24744

62. @asanzdiego @_David_Jorge
Créditos
● http://www.flaticon.com/free-icon/gamepad_65222
● http://www.flaticon.com/free-icon/piggy-bank-with-coin_66969
● http://www.flaticon.com/free-icon/ranking_69116
● http://www.flaticon.com/free-icon/responsive-design-symbol_65381
● http://www.flaticon.com/free-icon/running-a-race_10609
● http://www.flaticon.com/free-icon/seo-performance-marketing-graphic_33381
● http://www.flaticon.com/free-icon/speed-limit-100_13340
● http://www.flaticon.com/free-icon/sports-car_68321
● http://www.flaticon.com/free-icon/swift-bird-shape_47080
● http://www.flickr.com/photos/markhillary/370268513
● http://www.flickr.com/photos/nadinee/2582322082
● http://www.flickr.com/photos/zergev/8145106535
● http://www.iconsdb.com/custom-color/add-property-icon.html
● http://www.iconsdb.com/custom-color/alarm-clock-2-icon.html
● http://www.iconsdb.com/custom-color/alert-icon.html
● http://www.iconsdb.com/custom-color/android-6-icon.html
● http://www.iconsdb.com/custom-color/android-icon.html
● http://www.iconsdb.com/custom-color/apple-icon.html
● http://www.iconsdb.com/custom-color/article-marketing-icon.html
● http://www.iconsdb.com/custom-color/available-updates-icon.html
● http://www.iconsdb.com/custom-color/banknotes-icon.html
● http://www.iconsdb.com/custom-color/bluetooth-2-icon.html

63. @asanzdiego @_David_Jorge
Créditos
● http://www.iconsdb.com/custom-color/bug-2-icon.html
● http://www.iconsdb.com/custom-color/cash-receiving-icon.html
● http://www.iconsdb.com/custom-color/check-mark-icon.html
● http://www.iconsdb.com/custom-color/chrome-icon.html
● http://www.iconsdb.com/custom-color/compass-icon.html
● http://www.iconsdb.com/custom-color/conference-icon.html
● http://www.iconsdb.com/custom-color/conference-icon.html
● http://www.iconsdb.com/custom-color/contacts-2-icon.html
● http://www.iconsdb.com/custom-color/database-5-icon.html
● http://www.iconsdb.com/custom-color/edit-9-icon.html
● http://www.iconsdb.com/custom-color/error-icon.html
● http://www.iconsdb.com/custom-color/euro-icon.html
● http://www.iconsdb.com/custom-color/extra-badge-icon.html
● http://www.iconsdb.com/custom-color/finish-flag-icon.html
● http://www.iconsdb.com/custom-color/flag-icon.html
● http://www.iconsdb.com/custom-color/flashlight-icon.html
● http://www.iconsdb.com/custom-color/flow-chart-icon.html
● http://www.iconsdb.com/custom-color/hot-chocolate-icon.html
● http://www.iconsdb.com/custom-color/idea-icon.html
● http://www.iconsdb.com/custom-color/idea-icon.html
● http://www.iconsdb.com/custom-color/iphone-icon.html
● http://www.iconsdb.com/custom-color/map-marker-icon.html

64. @asanzdiego @_David_Jorge
Créditos
● http://www.iconsdb.com/custom-color/mobile-marketing-icon.html
● http://www.iconsdb.com/custom-color/money-icon.html
● http://www.iconsdb.com/custom-color/notebook-icon.html
● http://www.iconsdb.com/custom-color/phone-2-icon.html
● http://www.iconsdb.com/custom-color/phone-42-icon.html
● http://www.iconsdb.com/custom-color/planner-icon.htmlcalendar
● http://www.iconsdb.com/custom-color/play-4-icon.html
● http://www.iconsdb.com/custom-color/rocket-icon.html
● http://www.iconsdb.com/custom-color/server-icon.html
● http://www.iconsdb.com/custom-color/slr-camera-icon.html
● http://www.iconsdb.com/custom-color/student-icon.html
● http://www.iconsdb.com/custom-color/student-icon.html
● http://www.iconsdb.com/custom-color/talk-icon.html
● http://www.iconsdb.com/custom-color/target-audience-icon.html
● http://www.iconsdb.com/custom-color/time-icon.html
● http://www.iconsdb.com/custom-color/top-navigation-toolbar-icon.html
● http://www.iconsdb.com/custom-color/unlock-icon.html
● http://www.iconsdb.com/custom-color/website-design-icon.html
● http://www.iconsdb.com/custom-color/website-design-icon.html
● http://www.iconsdb.com/custom-color/wifi-3-bars-icon.html
● http://www.iconsdb.com/custom-color/window-5-icon.html
● http://www.iconsdb.com/custom-color/x-mark-icon.html

65. @asanzdiego @_David_Jorge
Licencia
Esta obra tiene una licencia:
CreativeCommons-Reconocimiento-CompartirIgual

66. @asanzdiego @_David_Jorge
¿Alguna pregunta?

67. @asanzdiego @_David_Jorge