Sé conservador en lo que hagas y liberal en lo que aceptes de los demás
Jonathan Bruce Postel, también llamada Principio de Robustez
Charla WebAssembly en DevFestAsturias 2019
El pasado día 16 de noviembre participé en el DevFestAsturias 2019 organizado por GDG Asturias
En la charla hablé sobre los fundamentos de WebAssembly, sus ventajas y los casos de uso tanto dentro del navegador como fuera.
Básicamente que WebAssembly lo cambiará TODO
6 pasos para crear un gran producto
Como ex-responsable de producto, en mi experiencia, estos son los pasos para conseguir un gran producto:
1. Escribe tus deseos para el producto
Lo primero es crear un buen puñado de funcionalidades que según tu opinión harán despegar el producto. En algún caso son acciones de marketing, documentos de producto o funcionalidades interesantes. Las fuentes pueden ser muchas, competencia, libros, mercado, conversaciones, etc.
Creo que todos tenemos grandes ideas para el producto que puede ayudar al usuario actual o al futuro.
2. Borra tu lista
No es que tengas pocas o malas ideas, es que tienes demasiadas y ponerlas en orden, priorizadas y analizadas es un trabajo descomunal.
Por otro lado, nunca podrás ver el producto como un usuario ya que al tener una visión interna del producto todas las mariposas impiden ver la realidad.
3. Pregunta al usuario/cliente lo que quiere
Que mejor que el usuario/cliente te transmita directamente o por algún medio lo que seguramente hará triunfar a tu producto. Ellos, al igual que tú, tienen cientos de ideas brillantes para tu producto. Al conocer el producto como usuario, siempre podrán transmitirte lo mejor a desarrollar.
4. Borra la lista
Lo que pide el cliente/usuario es distinto a lo que necesita. Al no tener un contexto técnico o estratégico puede pedir cosas que compliquen el producto o el rumbo de futuro.
5. Conoce las necesidades y aporta soluciones
Solo el cliente/usuario conoce lo que le duele. Es importante diferenciar lo que quiere de lo que necesita el cliente. La diferencia es abismal.
En reuniones presenciales con clientes, se les notaba en la cara algo que les «dolía», una funcionalidad o problema que realmente le afectaba. Gracias a la comunicación no verbal conseguías información que ninguna encuesta o conversación telefónica podía obtener.
Cuando empatizas con la necesidad de la persona, es más fácil ponerla en contexto y priorizarla. No son números, son personas.
6. Hazlo
Una vez conozcas la necesidad, toca unir puntos, buscar una solución. Tu experiencia es «vital» para resolver esa necesidad de la mejor forma posible.
- Que solucione la necesidad de ese usuario y de muchos otros de forma abstracta.
- Que sea sencilla y agradable para el usuario
- Que no rompa el producto, ni en la parte técnica ni en la estratégica.
- Que sea fácilmente mantenible
- Que sea fácilmente mantenible (BIS)
WebAssembly lo cambiará TODO
¿Qué es WebAssembly?
Un formato binario de bajo nivel creado bajo un estándar y al paraguas de la colaboración de varias compañias tecnológicas. Al ser abierto y basado en la integración con el omnipresente Javascript permite ofrecernos muchas ventajas en muy distintos ámbitos.
Qué cosas cambiará está cambiando:
Serverless
Actualmente la ejecución de funciones serverless, se basan generalmente en entornos basados en dockerizar para aislar entornos. Aunque muy eficientes y rápidos, estamos hablando de entornos que tardan milisegundos en iniciarse y consumen megas de recursos. Esas mismas funciones en WebAssembly se inicializan en microsegundos y consumiendo unos KB.
El coste y rapidez hacen presagiar que será un buen camino en los entornos de serverless , Cloudflare ya ha empezado a ofrecer este tipo de funciones serverless.
Librerías Javascript
Los miles de frameworks Javascripts existentes deben lidiar con el rendimiento y las funcionalidades para poder ofrecer la mejor experiencia en el frontend o en el backend (node.js). El uso de WebAssembly integrado en partes críticas de los frameworks puede consolidar y acelerar partes importantes que aporten rendimiento y fiabilidad a todas la librerías. WebAssembly ha nacido para potenciar Javascript, no para sustituirlo y este es uno de los puntos donde lo veremos extenderse en los próximos años.
Portabilidad de aplicaciones a web
Existen millones de proyectos desarrollados en múltiples lenguajes que suelen basar sus compiladores o runtimes en C o lenguajes de bajo nivel. Mediante la compilación a WebAssembly mucho del código fiable puede aprovecharse para ejecutarse de forma ubicua en cualquier engine moderno de navegador.
Una industria que está empujando en esta dirección son los videojuegos,
poder portar juegos desarrollados en C++ a Web abre un nuevo mundo de posibilidades a la industria.
Ejecución multiplataforma
La ejecución de aplicaciones multiplataforma ha sido el santo grial del desarrollo de software. Java, Velneo, Python y otros, han nacido con el propósito de simplificar el desarrollo en multiplataforma. Pero lidiar con el reto de la multiplataforma complicaba la mantenibilidad o mermaba el rendimiento.
WebAssembly no es solo web, durante los últimos meses se está definiendo WASI, un interface de WebAssembly con el sistema, lo que una vez estandarizado se podrá «compilar» y ejecutar directamente en sistemas operativos que soporten dicho interfaz. Esto simplificará la compilación multiplataforma de una forma notable, al mismo tiempo que se acerca a rendimientos de ejecución nativa.
Nos esperan años apasionantes, donde el software será más ubicuo, más seguro, más portable y más eficiente.
Un buen nombre de fichero
Cuando creamos un fichero que va a circular por emails, webs, ftps, google drive y el mundo en general, es importante pensar el nombre para evitar problemas y unificar criterios.
Consejos:
- Evitar espacios, usar guiones
En navegadores o urls los espacios los convierte a %20 y se hace complicado de gestionar. Se aconseja sustituir con guiones.
Correcto: visualms-instalable-23.exe
Evitar: visualms instalable 23.exe - Evitar mayúsculas
En distintos sistemas operativos, la mayúscula y minúscula significan cosas distintas, es bueno tener siempre minúsculas para evitar tener el fichero duplicado con nombres iguales.
Correcto: visualms-informe-anual-2018.pdf
Evitar: VisualMs-Informe-Anual-2018.pdf - Descriptivo
Intentar que el fichero sea descriptivo, que no necesite tener información adicional para saber que significa.
Correcto: visualms-gastos-davidgu-enero-2018.pdf
Evitar: gastos.pdf - Evitar símbolos (/\*?_<>)
Algunos símbolos pueden significar algo en otros sistemas y puede provocarnos problemas de conversión. En el caso del guión bajo, puede ofrecer confusión en hiperenlaces que suelen estar subrayados y además, según Google, no es bueno para SEO.
Correcto: visualms-resumen-fiesta-25-05-2018.avi
Evitar: visualms->resumen_fiesta-;-).avi - No usar tildes
Quizá resulte raro, pero nuestros ficheros pueden pasar por sistemas que no gestionan bien las tildes o incluso pase por alguna persona «rara» que no entiende el idioma de Cervantes.
Correcto: informacion-formulario-camion.png
Evitar: información-formulario-camión.png
Son consejos, no son verdades absolutas, úsalos con moderación 😉
Enlaces de interés:
https://developers.google.com/style/file-names
https://www.csudh.edu/web-services/web-standards/file-folder-naming/
La diferencia entre 0,1 y 1 segundo
¿Como percibirá el usuario las acciones que realiza en tu aplicación?
De 0 – 0,1 segundos
Es el tiempo máximo para que un usuario sienta que una acción suya esta provocando que ocurra algo en la aplicación de forma instantánea. Viene a ser como el interruptor de la luz.
0,1 – 0,3 segundos
El usuario siente una pequeña demora pero entiende que se está realizando su orden. Un ejemplo podría ser el tiempo que tarda en cambiar de cadena una televisión usando el mando a distancia.
1 segundo
Es el tiempo máximo en que el usuario sigue conectado a la tarea, sabe que manda una orden y el equipo la procesa en un tiempo adecuado sin que pierda la focalización mental. El encendido de un coche de gasolina puede ser un buen ejemplo.
Más información en este gran articulo de Jakob Nielsen Powers of 10: Time Scales in User Experience
El idioma de las aplicaciones
Nuestra necesidad
Durante los últimos meses estamos implantando internamente nuevas aplicaciones desarrolladas en Velneo. Por otro lado necesitamos conectarlas con otras aplicaciones de terceros que usamos en diferentes departamentos ( Google Apps, WordPress, Twitter, Zendesk, etc ).
Esta situación nos obligaba a marcar una estrategia de futuro en la comunicación entre aplicaciones.
Debíamos buscar una forma de comunicar cualquier aplicación entre sí, da igual si está en web, en escritorio o en móvil. Buscábamos un solo idioma para que se comuniquen nuestras aplicaciones.
Idioma elegido
Después de evaluar las opciones existentes todas nos llevan hacia las siglas REST / JSON
Al ser un servicio tipo REST tenemos la garantía de que funcionaremos sobre HTTP/HTTPS con todas las ventajas que ello conlleva.
Nos decantamos por JSON respecto a XML por varios motivos :
- Es muy sencillo y ligero
- Fácilmente legible por máquinas y humanos 😉
- Parece el estándar del futuro para comunicación de aplicaciones (WordPress, Google Glass, Zendesk, Twitter )
Como creamos nuestro API
Lo primero que debíamos hacer era crear un API que permitiera que otras aplicaciones consumieran nuestras aplicaciones, para ello con el vJavascript de Velneo creamos una aplicación capaz de generar de forma dinámica todo el API en base a un proyecto de Velneo. Esta aplicación no solo nos genera los puntos de acceso, sino una web dinámica con toda la documentación del API
Para darle salida a la aplicación usamos el componente vModApache y configuramos el Apache para añadirle cache, compresión y encriptación.
Con este proyecto, cualquiera de nuestras aplicaciones de Velneo V7 tenían un API dinámico en base a las tablas y búsquedas ya creadas.
Como consumimos nuestro API
Necesitábamos obtener información de nuestras aplicaciones, en unos casos que Google Apps pudiera obtener diferente información de nuestro vERP, para ello desarrollamos scripts en Google Apps Script que acceden a nuestro API y le consultan la información que necesita. El resultado devuelto en JSON se procesa de una forma muy sencilla y se realizan las operaciones necesarias.
Por otro lado nuestra web necesitaba mostrar información privada en los sitios que funcionan con WordPress. Desarrollamos un plugin en PHP que se conectaba a nuestro API para obtener información y mostrarla al visitante.
Desde los centros de soporte en Zendesk se consulta nuestro API para mostrar información de nuestro vERP en tiempo real
Desde Google Script se generan emails con los indicadores clave de la empresa calculados en diferentes aplicaciones
Que más cosas
Existen cientos de servicios web que ofrecen funcionalidades mediante sus APIs REST JSON
Nuestra idea es comunicar toda esta «nube» de aplicaciones con un mismo idioma, lo que nos permite ser más ágiles en cuanto a la implementación y mantenimiento de nuevos servicios.
Documentación de usuario para mi aplicación
Durante los años que llevo en el desarrollo de software todavía no he dado con la forma «perfecta» para ofrecer una documentación clara y eficiente para los usuarios de la aplicación.
Una documentación de usuario efectiva debería permitir :
- Resolver dudas sobre en que consiste la aplicación y cuales son sus características
- Encontrar solución a los problemas generales que pueda encontrarme
- Que tenga unos textos claros y concisos sin irse por las ramas
- Aportar una información extra a lo que pueda ver en la aplicación
- Consejos de como sacarle más partido a la aplicación
- Indexable por los buscadores
- Poder buscar por palabras internamente
Mantenimiento
Sin duda lo más complicado de una documentación de usuario es mantenerla. Un producto software esta vivo y se le van añadiendo funcionalidades, la documentación sea mucha o poca, debe ir actualizándose al mismo ritmo.
Elementos que van encontra del mantenimiento
- El tamaño. Cuanto más grande sea la documentación más dificil será tenerla al día. Menos es más
- Elementos gráficos, capturas de pantalla y vídeos son enemigos del mantenimiento, generalmente en poco tiempo quedan desfasados mostrando pantallas de versiones anteriores que confunden al usuario
- Descripciones exageradas de las pantallas (Ejemplo. Pincha en el botón azul redondeado a la derecha del texto nombre ) esas descripciones no aportan mucho valor pero al igual que las capturas quedan desfasados al cabo de poco tiempo cuando un cambio en el interfaz de las aplicaciones provoca que la descripción no detalle lo que realmente ve el usuario.
Buenas ayudas que conozco
Ayudas de Google
Google se esmera en no incluir capturas de pantalla, siempre lo explica con texto, lo que facilita su mantenimiento respecto los constantes cambios que van añadiendo.
Jenkins
Esta documentación tiene una buena división general ( Conoce, Usa, Extiende ) que permite ubicarte facilmente en que información necesitas.
Usar un registro DNS CNAME para hacerte la vida más fácil
La nube de Velneo esta teniendo éxito y ya son muchos los que utilizan habitualmente v7cloud*.velneo.com, para desarrollar, ejecutar e implantar.
Esta sugerencia puede ayudarte a conseguir una dirección de Velneo Cloud más personal.
Si quieres acceder a tu vServer de una forma más directa, al estilo:
vatp://app.empresa.com:12345
Solamente debes añadir un registro CNAME en la configuración de DNS de tu dominio «empresa.com»
El registro DNS sería algo como esto:
app CNAME v7cloud1.velneo.com
Debes poner el nombre de v7cloud*.velneo.com que corresponde con tu vrl.
Un registro CNAME indica que las solicitudes de resolución para un nombre sea resueltas con el valor del dominio indicado.
De esta forma, no te tendrás que preocupar si Velneo cambia de ip alguno de sus servidores, tu DNS siempre estará correcta.
Hay muchas páginas en internet que nos dan pistas de como crear un registro CNAME, pero lo más cómodo es que consultes la información donde tengas tu gestión de DNS
En este enlace de Google hay información de como configurar un registro CNAME en varios proveedores
Agilidad en el entorno familiar
Últimamente la agilidad se lleva a cualquier ámbito de la vida.
En esta presentación de Bruce Feiler se puede ver como funciona una «familia ágil» ; -)
davidgu 