Nueva aplicación: Cocina Tradicional

Como otro año más os presento una nueva aplicación que estoy realizando. Esta vez se trata de una página de cocina donde todo el mundo puede colgar sus recetas para guardarlas o compartirlas con todo el mundo.

La aplicación se llama cocina-tradicional.es y se ha pretendido realizar una página sencilla para subir y compartir las recetas rápidamente con todo el mundo.

La aplicación la llevo desarrollando algún tiempo y como siempre se ha realizado usando sólo software libre. Se han utilizado ruby on rails para la parte del servidor y vue.js para algunas partes del frontend.

Como podeis ver es una página muy dinámica y adaptada a la visualización en dispositivos móviles. En un futuro se va a implementar una versión para Android donde se podrán buscar las recetas rápidamente para poder usar el móvil mientras se cocina.

¿Cómo funciona cocina-tradicional.es?

La aplicación es una página web donde los usuarios tienen acceso a todas las recetas que se suban a la misma y compartirla por las redes sociales de forma sencilla. Podrán sentirse como verdaderos chefs y darse a conocer al mundo por sus recetas. Sólo tienen que entrar con su cuenta de google o facebook, crear su receta y esperar a que se validen (sólo por cuestiones de seguridad con los textos o las imágenes). En poco tiempo tendrá una entrada en la página con su receta y podrá compartirla con el mundo.

La aplicación tiene un buscador para que todas las personas puedan buscar recetas por nombre o ingredientes.

¿Qué tiene de novedoso?

La aplicación posee un buscardor de alérgenos, que evita mostrar recetas con un determinado alérgeno (siempre bajo responsabilidad del usuario). Por otro lado hace que subir recetas a la página sea muy fácil y el compartir con pocos click la hacen muy atractiva.

Se ha puesto especial atención en los enlaces compartidos en redes sociales se vean correctamente en facebook o twitter, para que puedan colgarlos en su muro.

¿A quien pertenecen las recetas que se suben?

Siempre al usuario, sólo se realiza un proceso de validación para evitar que se puedan subir imágenes o textos ofensivos). El usuario en cualquier momento puede eliminar su entrada de la plataforma. Hay que tener en cuenta de que al ser público, otro usuarios pueden copiar su contenido.

¿Es gratis?

Sí, la plataforma es de uso gratuito y se mantiene por la publicidad que aparece en la misma.


Espero que les guste el proyecto en el que he empleado las largas tardes y suban sus recetas para que todos podamos disfrutar de ellas. Un saludo y espero escribir pronto otro post.

Nueva aplicación: Dress my phone

Hola de nuevo a todos,

hace ya mucho tiempo que no entro por aquí, y lo hago después de mucho para mostraros una aplicación que lleva algún tiempo en el mercado. La aplicación está disponible para Android y la he desarrollado utilizando sólo software libre. A continuación explicaré qué es y para que sirve Dress My Phone.

Dress My Phone permite cambiar el fondo de pantalla del móvil de manera fácil a partir de los colores de tu ropa. Si quieres llevar a juego tu ropa con tu móvil esta es tu aplicación (dress my phone).

De manera general esto es lo que hace Dress My Phone, ahora vamos a verlo un poco más de cerca y de manera más técnica.

¿Cómo puede hacer una aplicación que el fondo de tu teléfono sea parecido a la ropa que llevas?

La aplicación básicamente se basa en sacar una foto de tu ropa y elegir una serie de imágenes de muestra que te ofrece. Parece fácil, pero surgen muchos interrogantes a la hora de implementar un algoritmo para hacer que salgan los resultados más óptimos según los colores. Problemas como la semejanza de colores en un ordenador comparados con la semejanza de colores del ojo humano, cómo realizar complejos cálculos sin que el servidor se resienta o cómo monetizar la aplicación, son algunos de los retos a los que me he tenido que enfrentar.


¿Que problema existe con la semejanza de colores?

Actualmente existen numerosos algoritmos para indicar que un color se parece a otro https://en.wikipedia.org/wiki/Color_difference. Estos algoritmos en la mayoría de los casos tienen unos resultados que no se asemejan a la realidad puesto que la apreciación del ojo humano de los colores no es muy correcta (vemos muchos más tonos verdes que de otro tipo de color). Utilizar uno de estos algoritmos es lo que se decidió para la base de la aplicación. Pero surgieron otros problemas, un algoritmo de estos mide la diferencia de un color con otro, pero una imagen tiene muchos más colores. ¿Cómo comparar unos con otros? Decidí modificar el algoritmo CIE para adaptarlo a que comprobase todos los colores de la imagen (previamente simplificados) con todos los demás de la muestra. Para dar más importancia, se hace una mediana y se utilizan pesos para decidir el orden de prioridad y pesos de cada color en la imagen. Como resultado cada color se comprueba con cada color de las imágenes de muestra que están en el servidor previamente procesadas. Cada comprobación da un valor que servirá para ordenar los resultados y pedirlos al servidor de imágenes.
Sencillo ¿verdad?.

¿ El servidor entonces realiza muchos cálculos?

 El servidor sólo tiene que devolver las muestras procesadas (sin las imágenes) y es el móvil quien hace todos los cálculos para luego pedir los resultados. Estas imágenes quedan cacheadas por el servidor y no se necesita casi nada de cómputo. Además se realiza un filtrado previo en la aplicación para pedir un número de muestras determinado o un filtro por textura. El smartphone se encargará de todo el proceso de comparación. Como ya he dicho, el algoritmo es libre y no hay problema por ponerlo en la aplicación. Es por ello que con un servidor pequeño y haciendo uso de Amazon S3 para almacenar las imágenes se obtiene una respuesta muy buena en la aplicación.

¿Toda aplicación necesita un mantenimiento, cómo monetizar esto?

La aplicación no busca en ningún momento ser un superventas pero para amortizar los costes del pequeño servidor se ha decidido crear una aplicación de pago, y poner publicidad en la versión libre.

Espero que les sorprenda la aplicación y vean que detrás de cualquier aplicación hay mucho trabajo y muchas horas de pensar. Espero que les guste la aplicación.

Dress My Phone Pro: enlace

Dress My Phone Free: enlace

Luz, aplicación de linterna para Android

En el segundo post del blog voy a indicar cómo para crear una aplicación simple de linterna para Android. Esta aplicación es bastante sencilla y probablemente pasarán más tiempo diseñando la aplicación que codificándola. Para explicar cómo se realiza esta aplicación se va a partir de la aplicación que ya tengo subida en google play. Los primeros pasos serán para explicar rápidamente cómo instalar  e importar el proyecto en eclipse con el kit de desarrollo de Android (SDK en adelante) para después explicar el código para encender el led de luz de nuestros dispositivos android.

 En primer lugar es necesario tener instalado Eclipse con el SDK de Android. Este proceso es muy sencillo y sólo deben instalar el SDK siguiendo los pasos que aparecen en la página de android developers http://developer.android.com/sdk/index.html.

Página de desarrolladores de Android

 Una vez instalado sólo deberán clonar el contenido de mi repositorio git https://github.com/jmjurado23/Light . Una vez clonado, sólo hay que importar el proyecto con la opción: File > Import > Android > Existing Android Code into Workspace, buscar la carpeta y dar a importar. Es posible que le de errores al decirle que su máquina no dispone del target necesario para la versión de Android requerida. Sólo deben instalar los archivos de la versión 11 y 15 del SDK, correspondientes a Android 3.0 y Android 4.0.4.

AndroidManifest de la aplciación importada

 Con el proyecto importado vamos a proceder a comentar el código. En primer lugar indicar que esta aplicación está creada por dos Activities.java y un Widget.java. Los archivos son:

• MainActivity.java: Fichero con la lógica para encender y apagar la luz desde la aplicación
• AboutActivity.java: Fichero con la información del autor del proyecto
• WidgetLight.java: Fichero con la lógica para hacer funcionar el widget para encender directamente la linterna desde el escritorio de Android.

  El código para encender la linterna es el siguiente:

// Código para encender la luz
private Parameters parameters;
camera = Camera.open();
parameters = camera.getParameters();
parameters.setFlashMode(Parameters.FLASH_MODE_TORCH);
camera.setParameters(parameters);

// Código para apagar la luz
parameters.setFlashMode(Parameters.FLASH_MODE_OFF);
camera.setParameters(parameters);
camera.release();
camera = null;

  Es muy importante liberar el recurso de la cámara una vez hemos apagado la luz puesto que sólo una aplicación puede hacer uso de la cámara si otra aplicación lo está usando. Android considera al led como parte de la cámara. No se olviden de añadir los permisos de la cámara en AndroidManifest:

// Permisos en el android manifest


    
    

  El funcionamiento del widget es algo más complejo y se explicará otro día en otro tutorial, pero pueden ver cómo funciona en el código de la aplicación.

  El resultado final de la aplicación una vez se añade funcionalidad a los botones, y se diseñan los dibujos de encendido y apagado de la aplicación y del widget es el siguiente:

 La aplicación la tengo subida a Google Play desde hace bastante tiempo en el enlace: https://play.google.com/store/apps/details?id=com.light.luz por si quieren probarla desde google play sin necesidad de compilarla.

  Espero que os sea de ayuda el código para realizar vuestra propia aplicación de linterna para Android.

Patit mi proyecto fin de carrera

Patit - Un servicio web con un API REST junto con un servicio de subida de ficheros, una aplicación nativa en Android y una aplicación web

   Tras este nombre algo complejo para las personas ajenas al mundillo de la programación se esconde mi proyecto fin de carrera. Patit es para que se entienda un servicio de almacenamiento de archivos en la nube añadiendo funciones sociales y que cuenta con una aplicación Android y una aplicación web para acceder a dicho servicio.

   La aplicación se ideó para responder a la necesidad de un sistema de almacenamiento rápido de información. Puede venir a la cabeza rápidamente aplicaciones como Evernote o muchas otras, pero Patit, se centró más en mostrar los contenidos de forma simple y sobre todo permitir compartir los enlaces de la forma más sencilla posible.

   Escribo esta entrada porque hace varios meses que terminé mi proyecto fin de carrera y comencé a trabajar en una empresa de mi ciudad como programador de aplicaciones web ( o lo que haga falta ;) ) y aún no he tenido tiempo de mostrar mi proyecto a los amigos. Pues voy a aprovechar la ocasión para mostrar la aplicación en profundidad. 

   Esta aplicación surgió como la mayoría de las aplicaciones de una necesidad que me surgió un día mientras viajaba en autobús. De repente se me ocurrió que debería existir una forma de compartir elementos de mi móvil en conjunto. La limitación de los smartphones actuales es que las aplicaciones son monotemáticas. Puedes enviar una o varias imágenes, o una o varias canciones, pero no existe la posibilidad de enviar, almacenar o compartir contenido de diversas fuentes. La idea de Patit era un sistema que fuese capaz de almacenar el contenido multimedia de forma muy sencilla y que permitiese una categorización del mismo por elementos y no por tipo. Algo parecido a una carpeta en la nube, pero que sea fácil de usar desde un smartphone. Así surgió la idea de bolsillo como un conjunto de objetos muy diversos.

   Una vez comprendido qué es lo que se quería conseguir con la aplicación, se pensó en qué sería necesario para llevarla a cabo. Hacía falta un servicio web que llevase a cabo las funciones de gestión de la base de datos y que llevase el control de las peticiones al backend, también haría falta un sistema que permitiera subir ficheros al servidor web, además se necesitaba un framework web para realizar la aplicación web y una aplicación móvil para poder usar la aplicación desde cualquier dispositivo.

Las tecnologías que se barajaron fueron muchas, hay que entender que este ha sido mi primer proyecto web, pero al final se eligieron las siguientes:

    - Servicio online (Backend) y servicio de subida de ficheros : Django

    - API para el servicio online: Tastypie

    - Base de datos: PostgreSQL

    - Método de comunicación: Json

    - Aplicación web: Backbone + Underscore.js javascript (Bootstrap para los estilos)

    - Aplicación nativa Android: Java

El desarrollo me llevó seis meses y el resultado es lo que voy a explicar a continuación:

- Servicio web y servicio de subida de ficheros: Realizados con Django como framework web y Tastypie como librería para crear la API. Usar Django para subir los archivos no es ni de lejos una solución óptima, pero válida para un sistema que no estaba pensado para ser usado en un entorno de producción.

- Aplicación web realizada con Backbone: La aplicación web dispondría de la misma funcionalidad que la aplicación móvil, siendo eso sí más cómoda de usar. Se realizó usando responsive dessign de bootstrap y así poder adaptarse a diversos tamaños de pantalla. La idea es que los enlaces de los elementos se pudieran visualizar sin que hiciese falta ningún tipo de permisos en la aplicación web.

La galería con las imágenes de la aplicación las he colgado en un álbum de picassa en el siguiente enlace:

https://picasaweb.google.com/101649708797020821977/PatitWeb?authuser=0&authkey=Gv1sRgCOzLsezdgPqScg&feat=directlink

- Aplicación Android: La aplicación android se puede considerar la base del diseño de la aplicación. Se diseñó en primer lugar y se aprovecharon casi todas las características que brindan las pantallas táctiles para facilitar el manejo de aplicaciones. Posteriormente se hablará del diseño y de la funcionalidad.

La galería de capturas de pantalla de la aplicación puede verse en esta dirección:

https://picasaweb.google.com/101649708797020821977/PatitMovil?authuser=0&authkey=Gv1sRgCLnTtoy1q5f8Gw&feat=directlink

El funcionamiento de la aplicación es muy sencillo. Un usuario puede crear varios bolsillos, y en cada bolsillo puede almacenar elementos multimedia como fotos, música, texto o direcciones web. Cada bolsillo puede ser clasificado según temáticas (deportes, libros, cocina, fotografía, etc) y tienen un nombre y una descripción. Por su parte los elementos que se pueden almacenar en un bolsillo se identifican con un nombre y una descripción. Los bolsillos tienen funciones sociales y pueden ser votados, y comentados. Puedes enlazar bolsillos de otras personas mediante un icono de favoritos, e incluso hay bolsillos esponsorizados para empresas que paguen por uno de estos bolsillos. La idea es que cada uno almacene y comparta en un bolsillo información, pero sobre todo que pueda acceder a ella fácilmente. Para ello cada elemento de un bolsillo dispone de una opción de descargar o de ir al enlace en caso de ser una página web. Por su parte si una empresa desea podría pagar por un bolsillo esponsorizado que dispone de una categoría especial dentro de la aplicación.

La aplicación muestra los bolsillos en 4 categorías y a cada categoría se le ha asignado un color. 

- Azul: Tus Bolsillos: Son los bolsillos que crea el usuario

- Rojo: Aleatorios: Bolsillos aleatorios de la plataforma.

- Amarillo: Destacados: Es una categoría con los bolsillos que han sido destacados

- Verde: Esponsorizados: Contiene los bolsillos de pago.

- gris: Buscador de bolsillos.

Y como todo proyecto se realizó una documentación extensa del proyecto...

La mejor forma de comprender la aplicación puede ser ver la presentación que se expuso:

https://docs.google.com/file/d/0B3BfkvY8NzADaHEzV0pJeDE5eXM/edit?usp=sharing

Este es el proyecto que he tenido entre manos durante este tiempo, y del que he aprendido mucho. Es poco probable que este proyecto salga adelante pues requeriría de una reestructuración profunda y de medios bastante caros para lanzarlo al mercado. Aún así pronto colgaré el código por si a alguien le es de utilidad.

Espero que os haya gustado la aplicación y sobre todo que gracias a esto ya soy Ingeniero Informático :)

----------------------------------------------------------------------------------------------------------------------------------

Actualización 

Aquí dejo los enlaces para ver el código del backend y el código Android

https://github.com/jmjurado23/patit-django

https://github.com/jmjurado23/patit-android