diff --git a/web/desarrollo.html b/web/desarrollo.html index 76e775de0350b83d7bbd1ac185bd21827a2a9d05..fb64db0766503083a573759af160e053e0e13997 100644 --- a/web/desarrollo.html +++ b/web/desarrollo.html @@ -1,7 +1,7 @@ <!DOCTYPE html> <html lang="en"> <head> - <title>ChessTrack</title> + <title>ChessTrack.::.Desarrollo</title> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="Your description"> @@ -88,19 +88,32 @@ <div class="sub-content"> <div class="container"> <div class="row"> - <div class="span6 float2"> - <br><br><br><br> - <h4>Pruebas desde matlab</h4> - <p><strong class="clr">A continuación se describen las pruebas desarrolladas en matlab.</strong><br> - Desde Matlab se armaron pruebas de concepto de las ideas que iban surgiendo para varios aspectos del procesamiento.</p> - </div> <div class="span6 float"> <h4>Desarrollo de la Solución</h4> - <h4>Armado de ambiente</h4> + <h4>Armado del ambiente</h4> <p><strong class="clr">A continuación se describe el ambiente utilizado para desarrollar.</strong><br> - El ambiente que se usó para desarrollar fue el propuesto por la documentación que se presenta en el [link] y el armado del proyecto Android en los tutoriales que presenta Opencv4Android en su documentación. Para las pruebas de conceptos se usó Matlab con OpenCV, luego al crear el proyecto Android para la aplicación se probó en dispositivos fÃsicos, dado que el emulador es muy lento. También se hicieron algunas pruebas en C/C++ dado que es más fácil pasar luego lo programado al lenguaje Java.</p> - <p>Además de esto se genero un repositorio donde el equipo versionó en todo momento el desarrollo de la aplicación, la dirección del mismo se encuentra en esta sección.</p> + Para desarrollar en Android, el ambiente utilizado fue el propuesto por la documentación que se presenta en este <a href="http://web.stanford.edu/class/ee368/Android/index.html">tutorial</a>. + Para armar el proyecto ChessTrack como una aplicación para Android se utilizaron los tutoriales que presenta <a href="http://docs.opencv.org/doc/tutorials/introduction/android_binary_package/O4A_SDK.html">Opencv4Android</a> en su documentación. + Debido a que el emulador para Android es sumamente lento en lo que respecta a su ejecución, y debuggear sobre un dispositivo es una tarea engorrosa, se decidió realizar las pruebas de conceptos en Matlab con OpenCV, valiéndose del kit de funciones mex de opencv para matlab obtenidas de <a href="http://www.cs.stonybrook.edu/~kyamagu/mexopencv/">mexopencv</a>. + Una vez validadas las funcionalidades se realizaron pruebas sobre dispositivos con Android. + También se hicieron algunas pruebas conceptuales en C/C++ utilizando la librerÃa OpenCV dado que es más cómodo migrar luego el código programado al lenguaje Java.</p> + <figure><img src="galeria/eclipse4Android.png" class="img-radius" alt=""></figure> + <p>A modo de versionar el trabajo realizado, desde el desarrollo de la actividad para Android, las pruebas de conceptos y el contenido y análisis de las mismas, se generó un <a href="https://gitlab.fing.edu.uy/aricca/chessTrack">repositorio</a> con soporte institucional.</p> + <figure><img src="galeria/gitlab.png" class="img-radius" alt=""></figure> </div> + <div class="span6 float2"> + <br><br><br><br> + <h4>Pruebas desde matlab y desde C/C++</h4> + <p><strong class="clr">A continuación se describen las pruebas desarrolladas en matlab.</strong><br> + Sobre Matlab se armaron pruebas de concepto de las ideas que iban surgiendo para varios aspectos del procesamiento.</p> + <p>Para la detección del tablero se pensó en una detección de esquinas</p> + <p>Detección de esquinas con la función <strong>corners</strong> desde matlab:</p> + <figure><img src="galeria/cornersM2.png" class="img-radius" alt="" style="width: 200px"> <img src="galeria/cornersM1.png" class="img-radius" alt="" style="width: 200px"></figure> + <p>Detección de esquinas con la función <strong>corners</strong> desde C++ con OpenCV:</p> + <figure><img src="galeria/cornersC2.png" class="img-radius" alt="" style="width: 200px"> <img src="galeria/cornersC1.png" class="img-radius" alt="" style="width: 200px"></figure> + <p>Nos decidimos por utilizar la función <strong>findChessboardCorners</strong> que se utiliza para calibrar con tableros de ajedrez y retorna cuando encuentra un tablero interno de determinado tamaño, en este caso 7x7:</p> + <figure><img src="galeria/findChessBoardCorners.png" class="img-radius" alt=""></figure> + </div> </div> </div> </div> @@ -223,11 +236,13 @@ <div class="sub-content"> <div class="container"> <div class="row"> - <h4>Técnicas empleadas</h4> - <p><strong class="clr">A continuación se describen las tecnicas empleadas.</strong><br> - Primeramente se emplea, para la calibración, una detección de esquinas usando el metodo XXXchescorners. De esta manera se obtienen las esquinas interiores del tablero de ajedrez. Con las esquinas detectadas se calcula una homografÃa para enderezar el tablero, recortarlo para solo tener el tablero en la imagen para procesar y colocarlo en una posición conocida. Con este proceso también se obtiene el tamaño de los escaques y de todo el tablero.</p> - <p>Luego de acondicionar la imagen se utiliza un proceso de supresión de fondo para detectar cuando se esta haciendo el movimiento de las fichas, para esto se utiliza los métodos DDDDDDD de la librerÃa OpenCV.</p> - <p>Para la detección de fichas se obtienen de cada frame la sub imagen correspondiente al área central de cada escaque, se le hace un filtro de Sobel para la detección de bordes, a su vez se binariza una imagen a partir de cierto umbral. Luego para eliminar ruido se hace un erode, y un dilate para acrecentar los pixeled donde hay fichas. Si la cantidad de pixeles blancos pasan cierto umbral se puede decir que se encuentra una ficha en el escaque.</p> + <div class="span12"> + <h4>Técnicas empleadas</h4> + <p><strong class="clr">A continuación se describen las tecnicas empleadas.</strong><br> + Primeramente se emplea, para la calibración, una detección de esquinas usando el metodo XXXchescorners. De esta manera se obtienen las esquinas interiores del tablero de ajedrez. Con las esquinas detectadas se calcula una homografÃa para enderezar el tablero, recortarlo para solo tener el tablero en la imagen para procesar y colocarlo en una posición conocida. Con este proceso también se obtiene el tamaño de los escaques y de todo el tablero.</p> + <p>Luego de acondicionar la imagen se utiliza un proceso de supresión de fondo para detectar cuando se esta haciendo el movimiento de las fichas, para esto se utiliza los métodos DDDDDDD de la librerÃa OpenCV.</p> + <p>Para la detección de fichas se obtienen de cada frame la sub imagen correspondiente al área central de cada escaque, se le hace un filtro de Sobel para la detección de bordes, a su vez se binariza una imagen a partir de cierto umbral. Luego para eliminar ruido se hace un erode, y un dilate para acrecentar los pixeled donde hay fichas. Si la cantidad de pixeles blancos pasan cierto umbral se puede decir que se encuentra una ficha en el escaque.</p> + </div> <div class="span6 float2"> <br><br><br><br><br> <p>Para el envÃo de la partida a un servidor externo, como ya se comento, solamente se envÃa un tablero con unos y ceros, los cuales representan el tablero y las fichas. Dicho servidor es dedicado a esta aplicación y se encuentra dentro del repositorio del proyecto. Para usarlo se debe de levantar el mismo en un pc con java, y luego antes de calibrar, configurar la ip y el puerto (actualmente es el 5556) en la aplicación.</p> @@ -261,7 +276,6 @@ </div> <div class="span8 float"> <ul class="footer-menu"> - <!--<li><a href="index.html" class="current">Inicio</a>|</li>--> <li><a href="descripcion_del_proyecto.html">Descripción del Proyecto</a>|</li> <li><a href="desarrollo.html">Desarrollo</a>|</li> <li><a href="trabajo_a_futuro.html">Trabajo a Futuro</a>|</li> diff --git a/web/galeria/cornersC1.png b/web/galeria/cornersC1.png new file mode 100644 index 0000000000000000000000000000000000000000..7168ab06d5c6ae119247bc286326b5f000ed7bae Binary files /dev/null and b/web/galeria/cornersC1.png differ diff --git a/web/galeria/cornersC2.png b/web/galeria/cornersC2.png new file mode 100644 index 0000000000000000000000000000000000000000..09b82b8a16232b55cd2b89c0da5652d295020ab2 Binary files /dev/null and b/web/galeria/cornersC2.png differ diff --git a/web/galeria/cornersM1.png b/web/galeria/cornersM1.png new file mode 100644 index 0000000000000000000000000000000000000000..949f2014d1f039a5570818ea41d399b5a54d9678 Binary files /dev/null and b/web/galeria/cornersM1.png differ diff --git a/web/galeria/cornersM2.png b/web/galeria/cornersM2.png new file mode 100644 index 0000000000000000000000000000000000000000..3561f3327d03915be8c284ffeeff50190018aaec Binary files /dev/null and b/web/galeria/cornersM2.png differ diff --git a/web/galeria/eclipse4Android.png b/web/galeria/eclipse4Android.png new file mode 100644 index 0000000000000000000000000000000000000000..07043a8bd388feeaed56b166744feef2ba370a91 Binary files /dev/null and b/web/galeria/eclipse4Android.png differ diff --git a/web/galeria/findChessBoardCorners.png b/web/galeria/findChessBoardCorners.png new file mode 100644 index 0000000000000000000000000000000000000000..a83a6be600f5f3da1e7dfdf6b3ca71801f1670b7 Binary files /dev/null and b/web/galeria/findChessBoardCorners.png differ diff --git a/web/galeria/gitlab.png b/web/galeria/gitlab.png new file mode 100644 index 0000000000000000000000000000000000000000..bc0f3f3cd5c3f4300975ebf64d40153726f466f6 Binary files /dev/null and b/web/galeria/gitlab.png differ