Newer
Older
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Your description">
<meta name="keywords" content="Your keywords">
<meta name="author" content="Your name">
<link rel="icon" href="img/favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/responsive.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/camera.css" type="text/css" media="screen">
<link rel="stylesheet" href="css/style.css" type="text/css" media="screen">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600,700' rel='stylesheet' type='text/css'>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/camera.js"></script>
<script src="js/jquery.ui.totop.js" type="text/javascript"></script>
</head>
<body>
<!--==============================header=================================-->
<header class="p0">
<div class="container">
<div class="row">
<div class="span12">
<div class="header-block clearfix">
<div class="clearfix header-block-pad">
<h1 class="brand"><a href="index.html"><img src="img/logo.png" alt=""></a><span>Seguimiento de una Partida de Ajedrez.</span></h1>
<span class="contacts">Integrantes:<br>
<span> Aylen Ricca (<a href="mailto:aricca@fing.edu.uy">aricca@fing.edu.uy</a>)<br> Nicolás Furquez (<a href="mailto:nfurquez@fing.edu.uy">nfurquez@fing.edu.uy</a>)</span>
<br>Tutor:<br>
<span> Álvaro Gómez (<a href="mailto:agomez@fing.edu.uy">agomez@fing.edu.uy</a>)</span>
</span>
<span class="contacts">
<img src="img/chess0.png" alt="">
</span>
</div>
<div class="navbar navbar_ clearfix">
<div class="navbar-inner navbar-inner_">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse_">MENU</a>
<div class="nav-collapse nav-collapse_ collapse">
<ul class="nav sf-menu">
<li class="active li-first"><a href="index.html"><em class="hidden-phone"></em><span class="visible-phone">Home</span></a></li>
<li class="sub-menu"><a href="#">Introducción</a>
<ul>
<li><a href="descripcion_del_proyecto.html">Descripción del Proyecto</a></li>
<li class="sub-menu"><a href="#">Documentos</a>
<ul>
<li><a href="documentos/presentacion_inicial.pdf" target="_blank">Presentación Inicial</a></li>
<li><a href="documentos/plan_de_trabajo.pdf">Plan de Trabajo</a></li>
<li><a href="documentos/presentacion_final.pdf">Presentación Final</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="desarrollo.html">Desarrollo</a></li>
<li><a href="trabajo_a_futuro.html">Trabajo a Futuro</a></li>
<li><a href="links_de_interes.html">Links de Interés</a></li>
<li><a href="galeria_de_imagenes.html">Galería de Imágenes</a></li>
<li><a href="videos.html">Videos</a></li>
</ul>
</div>
<ul class="social-icons">
<li><a href="http://www.fing.edu.uy/"><img src="img/icon-1.png" alt=""></a></li>
<li><a href="http://www.universidad.edu.uy/"><img src="img/icon-2.png" alt=""></a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<!--==============================content=================================-->
<section id="content">
<!--==============================section=================================-->
<div class="sub-content">
<div class="container">
<div class="row">
<div class="span6 float">
<h4>Desarrollo de la Solución</h4>
<p><strong class="clr">A continuación se describe el ambiente utilizado para desarrollar.</strong><br>
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="" style="height: 440px"></figure>
<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 y C/C++.</strong><br>
Sobre Matlab y código en C++ 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 class="clr">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 class="clr">goodFeaturesToTrack</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 class="clr">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>
<!--==============================section=================================-->
<div class="sub-content">
<div class="container">
<div class="row">
<div class="span12 float">
<h4>Más Pruebas desde matlab y desde C/C++</h4>
<p>Para la detección de la mano se utilizó la estructura de OpenCV <a href="http://docs.opencv.org/trunk/doc/tutorials/video/background_subtraction/background_subtraction.html#background-subtraction">BackgroundSubtractorMOG</a> obteniendo luego la cantidad de píxeles que se diferencian del fondo, y seteando un umbral para determinar cuando hay una mano sobre el tablero y descartar esos frames, un ejemplo en C++ ejecutado sobre un video que realizamos:</p>
<p>A la izquierda se visualiza un video con la máscara, y a la derecha el video etiquetado con los estados: <strong class="clr">ESTABLE</strong> y <strong class="clr">MANO</strong> para diferenciar cuando descartar frames</p>
<embed width="450" height="300" src="https://www.youtube.com/v/uiF0cZDhafI" type="application/x-shockwave-flash">
<embed width="450" height="300" src="https://www.youtube.com/v/LCNMyQp4ANw" type="application/x-shockwave-flash">
<p>A continuación se muestran los tableros obtenidos en la transición de estado <strong class="clr">MANO</strong> a estado <strong class="clr">ESTABLE</strong>.</p>
<figure>
<img src="galeria/tablero0.png" class="img-radius" alt="" style="width: 180px">
<img src="galeria/tablero1.png" class="img-radius" alt="" style="width: 180px">
<img src="galeria/tablero2.png" class="img-radius" alt="" style="width: 180px">
<img src="galeria/tablero3.png" class="img-radius" alt="" style="width: 180px">
<img src="galeria/tablero4.png" class="img-radius" alt="" style="width: 180px">
<img src="galeria/tablero5.png" class="img-radius" alt="" style="width: 180px">
<br><br>
<img src="galeria/tablero6.png" class="img-radius" alt="" style="width: 180px">
<img src="galeria/tablero7.png" class="img-radius" alt="" style="width: 180px">
<img src="galeria/tablero8.png" class="img-radius" alt="" style="width: 180px">
<img src="galeria/tablero9.png" class="img-radius" alt="" style="width: 180px">
<img src="galeria/tablero10.png" class="img-radius" alt="" style="width: 180px">
<img src="galeria/tablero11.png" class="img-radius" alt="" style="width: 180px">
</figure>
</div>
</div>
</div>
</div>
<!--==============================section=================================-->
<div class="sub-content">
<div class="container">
<div class="row">
<div class="span12">
<h4>Descripción general de módulos</h4>
<p>En esta sección se describen brevemente los módulos y sus actividades principales.</p>
<ul class="thumbnails indent-3">
<li class="span3">
<div class="thumbnail thumbnail_1">
<div class="caption">
<h5>Modulo</h5>
<h3>Activity</h3>
</div>
<div class="thumbnail-pad">
<p>Este módulo es la actividad Android que se encarga de recibir los eventos de la aplicación, en esta primera versión se cuenta con un menú con opciones de conexión y de calibración, mantiene una máquina de estados para modelar si se está en estado Calibrando o Jugando.</p>
<p>Cuando se selecciona del menú la conexión se ingresan los datos necesarios (a saber ip y puerto del servidor) y luego es el módulo Manager el encargado de mantener la misma.</p>
<p>Es en este módulo donde se reciben los frames de la cámara, y es el encargado de pasarlos al Manager a partir de que se selecciona la opción calibrar.</p>
</div>
</div>
</li>
<li class="span3">
<div class="thumbnail thumbnail_1">
<div class="caption">
<h5>Modulo</h5>
<h3>Manager</h3>
</div>
<div class="thumbnail-pad">
<p>Este módulo se encarga de manejar los estados de la aplicación. Comienza a tomar partido desde el evento calibrar, y es quien se comunica con el resto de los módulos que procesan los frames y también con el módulo que se comunica con el servidor para enviar las partidas.</p>
<p>Luego de la calibración válida este módulo se encuentra en el estado Armando Tablero, y cuando le notifican que está pronto el tablero para iniciar la partida, se pasa a estado Jugando.</p>
<p>Mantiene una bandera para saber si se debe enviar información al servidor, o no se ha seleccionado salida alguna.</p>
<br>
</div>
</div>
</li>
<li class="span3">
<div class="thumbnail thumbnail_1">
<div class="caption">
<h5>Modulo de</h5>
<p>En este módulo se emplean técnicas para el acondicionamiento de la imagen. Se cuenta con la clase Adquisición que dentro posee una lista de clases que implementan la interface ImgProcInterface. Dicha interfaz solo posee el método procesarImagen, que es llamado por el módulo Adquisición para cada una de las clases que se agregaron a la lista.</p>
<p>La idea detrás de este módulo es que el frame adquirido pase por una serie de acondicionamientos, cada uno siendo una clase que implementa la interface ImgProcInterface y agregándose a la lista en Adquisición. Se ejecutarán en el orden en que son agregadas.</p>
</div>
</div>
</li>
<li class="span3">
<div class="thumbnail thumbnail_1">
<div class="caption">
<h5>Modulo de</h5>
<h3>Calibración</h3>
</div>
<div class="thumbnail-pad">
<p>Este módulo es el encargado de calibrar el sistema antes de empezar la partida. Se encarga de localizar el tablero, obteniendo las esquinas internas y calculando la arista promedio del tablero interno.</p>
<p>Para la localización de las esquinas se utiliza como ya se mencionó la función de OpenCV findChessboardCorners.</p>
<p>Para que los usuarios sepan si pueden comenzar a armar el tablero se emite un beep, en caso de que no se hayan encontrado las esquinas se emiten dos beep y se deberá ajustar el dispositivo para lograr que la cámara visualice la totalidad del tablero.</p>
<br><br>
</div>
</div>
</li>
</ul>
<ul class="thumbnails indent-3">
<li class="span3">
<div class="thumbnail thumbnail_1">
<div class="caption">
<h5>Modulo</h5>
<h3>Oclusión</h3>
</div>
<div class="thumbnail-pad">
<p>Se encarga de detectar si la imagen obtenida se encuentra estable para ser procesada o si por el contrario un jugador está realizando un movimiento, por lo cual no debe procesarse el tablero.</p>
<p>Para la detección de la oclusión, es decir, que hay una mano realizando una movida, se utiliza la estructura BackgroundSubtractorMOG.</p>
<p>Internamente este módulo mantiene estados. Oclusión: es cuando hay un jugador realizando una jugada; Transición: al cual se pasa inmediatamente se ha dejado de visualizar la mano; Enviar Tablero: donde se valida que es un tablero limpio para detectar fichas.
La existencia del estado Transición se realiza para asegurar un tablero completamente libre de sombras.</p>
<br>
</div>
</div>
</li>
<li class="span3">
<div class="thumbnail thumbnail_1">
<div class="caption">
<h5>Modulo</h5>
<p>Este módulo es el encargado de a partir de una imagen obtener información de cada escaque reconociendo si existe una ficha o no en el mismo.</p>
<p>Para la detección de piezas se utiliza una detección utilizando sobel sobre la región céntrica del escaque, y se aplica un umbral para determinar la existencia de una pieza.</p>
<p>La detección de piezas es empleada durante el armado, para saber si se ha llegado a la configuración inicial del tablero, y también se utiliza para detectar las piezas en un tablero válido (sin oclusión).</p>
<p>La salida de la detección de piezas es una matriz binaria de tamaño 8x8 con 1 donde hay fichas y 0 sino</p>
</div>
</div>
</li>
<li class="span3">
<div class="thumbnail thumbnail_1">
<div class="caption">
<h5>Modulo</h5>
<p>Este módulo contiene la lógica de las reglas de Ajedrez y se encarga de procesar las matrices que Modelador retorna para saber qué fichas se movieron y a dónde.</p>
<p>En esta primera versión únicamente valida el tablero actual contra el anterior para saber si se ha producido un cambio. También valida al comienzo, luego del calibrado si el tablero está en la configuración inicial.</p>
<p>La idea de la primer validación mencionada es para saber cuándo enviarle al servidor un tablero con cambios.</p>
<br><br><br><br><br><br><br>
</div>
</div>
</li>
<li class="span3">
<div class="thumbnail thumbnail_1">
<div class="caption">
<h5>Modulo</h5>
<p>En este módulo se debería implementar todas las posibles salidas que se desee obtener de la partida, quizás a partir de una interfaz que recibe el movimiento y se implementa un tipo de salida (persistencia en archivo, enviar a un servidor, texto a voz,etc).</p>
<p>Por temas de tiempo en este módulo sólo se implementó una clase que se encarga de enviar la matriz de las fichas a un servidor configurable.</p>
<br><br><br><br><br><br><br><br><br><br><br>
</div>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
<!--==============================section=================================-->
<div class="sub-content">
<div class="container">
<div class="row">
<p><strong class="clr">A continuación se describen las tecnicas empleadas, algunas ya mencionadas anteriormente.</strong><br>
Primeramente, se emplea para la calibración, una detección de esquinas usando el metodo findChessboardCorners. De esta manera se obtienen las esquinas interiores del tablero de ajedrez. Con las esquinas detectadas se determinan las cuatro más externas, la distancia promedio entre las cuatro aristas que determinan y se localizan los cuatro mejores puntos para realizar una homografía y así enderezar el tablero en caso de estar inclinado. A su vez
se recorta para solo tener la región del 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 utilizan los métodos de BackgroundSubtractorMOG2 de la librería OpenCV, se realiza además un erode y un threshold de la máscara producida para determinar si se encuentra en un estado de oclusión.</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 pixeles 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>
</div>
<!--==============================section=================================-->
<div class="sub-content">
<div class="container">
<div class="row">
<div class="span6 float">
<h4>Consideraciones sobre la Solución</h4>
<p><strong class="clr">A continuación se detallan aspectos relacionados a la solución.</strong><br>
La solución que se llegó fue más acotada de lo que se planteó en un inicio, dado que se hizo énfasis en el procesamiento de imágenes y no tanto en el problema, es que actualmente (Julio 2014) la aplicación solo detecta donde hay fichas y luego de cada movimiento de un jugador manda una matriz 8x8 binaria indicando donde hay o no fichas si hubo un movimiento efectivo.</p>
<p>Otra consideración importante para el uso de la aplicación es la iluminación, la misma debe de ser uniforme. Dado que era una de las precondiciones del proyecto, no se tuvo en cuenta en ninguno de los algoritmos de procesamiento de imágenes para tratar temas de iluminación no uniforme.</p>
<p>Otro hecho a tener en cuenta para el uso de la aplicación es el tamaño del tablero y la altura donde debe de estar el dispositivo para poder ver todo el tablero.</p>
<p>La calibración no es automática, se debe de decirle a la aplicación que debe de calibrar para detectar el tablero, luego de detectarlo emite un pitido y el dispositivo no puede ser movido de esa posición, así como tampoco se permite la re-calibración luego de iniciada la partida. Es importante apreciar que el plano de la cámara debe de ser paralelo al plano del tablero y que éste más una margen de un escaque han de aparecer en la imagen de la aplicación. No importa de qué lado van a estar las fichas con respecto al dispositivo, pero si la rotación del tablero con respecto al mismo, lo ideal es que las líneas del tablero sean paralelas a los bordes de la imagen, aunque la aplicación puede soportar una pequeña rotación del mismo con respecto a esta alineación, siempre que se consideren los márgenes antes mencionados.</p>
<div class="span6 float2">
<br><br><br><br><br>
<p>Para el envío de la partida a un servidor externo, como ya se comentó, 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>
<p>Igualmente la aplicación permite una jugabilidad importante (siempre dentro de partidas lentas), luego de calibrar, la misma aplicación detecta cuando esta todo el tablero armado y emite un pitido, de ahí en más, espera a que se hagan movimientos y detecta cambios de fichas.</p>
<p>Es importante tener en cuenta cómo se debe de armar el tablero, dado que la detección es automática. Se ha de poner una ficha en el medio del tablero (no importa de qué jugador) y colocar el resto de las piezas en su lugar, cuando esté todo pronto para empezar la partida, se coloca la pieza que se encuentra en el medio del tablero en su lugar, y se espera a que el dispositivo emite un pitido, indicando que se puede comenzar a jugar.
Esto último es para evitar que durante el armado se dé un caso de borde que es cuando se detecta la mano como una o varias piezas y si se dá que están cubiertas las filas 1, 2, 7 y 8 debido a esta situación, la aplicación entenderá que se está pronto para jugar.</p>
<br><br>
<p>Para visualizar imágenes ver la <a href="galeria_de_imagenes.html">Galería de Imágenes</a> y <a href="videos.html">Videos</a></p>
</div>
</div>
</div>
</div>
<!--==============================section=================================-->
</section>
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
<!--==============================footer=================================-->
<footer>
<div class="container">
<div class="row">
<div class="span4 float2">
Proyecto de fin de curso 2014 de Tratamiento de Imágenes por Computadora dictado en la Facultad de Ingeniería de la Universidad de la República, Uruguay
<br>Sitio web del curso: <a href="https://eva.fing.edu.uy/course/view.php?id=520">Tratamiento de Imágenes por Computadora</a>
</div>
<div class="span8 float">
<ul class="footer-menu">
<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>
<li><a href="links_de_interes.html">Links de Interés</a></li>
<li><a href="galeria_de_imagenes.html">Galería de Imágenes</a></li>
<li><a href="videos.html">Videos</a></li>
</ul>
Stylish 2014 | <a href="mailto:aricca8@gmail.com">@yle</a>
</div>
</div>
</div>
</footer>
<script type="text/javascript" src="js/bootstrap.js"></script>
</body>
</html>