Tras haber analizado las necesidades del usuario he intentado crear una interfaz basada en los dos ejemplos anteriores pero adaptado a los niños. Para ello he utilizado colores más alegres y una fuente más infantil para que su interacción no se limite al dibujo en si, sino que puedan realizar otra clase de acciones.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj2E5Nhn2Az2FSA706NDRB-pKihylsx7ZcJEOiEi56p2V6O7VI3Gzcu3WfPJ-_wuKWObpJjLlt3Rw4YtK6XyOkIPyIlk_kVmkvoB1durcWhbiiNxA5SvSVz11aGZt7BAlp3MMdncjXopw78/s320/Interfaz-2.bmp)
En esta primera imagen se dispone el
menú de acceso a la aplicación web, para ello se requiere de registro, de este modo se podrá trabajar sobre un perfil en el que se guardarán, cargarán y editarán los dibujos creados por el usuario.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZY3WTIqJdCarN3fcsVAuq7-VhKJ99twDN9Qoob0dF0aTjsUYo6c2vVqZxQYxKQS9qCCmU0LmKlVxmmpDxT5eIqch_VWOeD-tI21wN6-8r4-u604tgs5KmIKNvvBvMyo9YM3flkoUTIKAj/s320/Interfaz-3.bmp)
En la segunda pantalla de la aplicación (tras haberse identificado) podemos acceder a tres submenús, tal y como indican los botones.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLoGAzpBVIhocGaL09QBvxZQRNiyO85yitt0XBJSsxs_GyYASSYvlbl_cdAUI5S4I7uc1WG07g3BCGsZHUcvPveRF_YnukSyDX00If8wOn4X3fhWrPPVV-kiWIAMPYVKH_M2nhtDobf69G/s320/Interfaz-4.bmp)
Al clickear en otros dibujos accedemos al conjunto de dibujos de demás usuarios sin ningún orden en concreto. Y como vemos las flechas de la parte superior de la pantalla nos permite movernos hacia alante o hacia atrás para ver más dibujos, y la opción volver que nos permite retornar al menú anterior.
Cuando clickeamos en un dibujo nos sale su ficha que consta de título y autor además de 4 estrellas que nos permite valorarlo. Y las flechas superiores que nos siguen permitiendo el movimiento y el botón de retorno para volver atrás.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3hDNhq8fu2snORedLjt1fMJeRWRONLDlU0NDlzom6xrBZtYlytPx22TaxogJT8XZ420iuxOSzR0ECN2GiFZh1CyowJgtE4FxkiE8dkprrvq_gWNYpQFq43uCK-KdvAB7odfbtP7SLMQY1/s320/Interfaz-6.bmp)
En el menú de mis dibujos vemos una "carpeta " con todos los dibujos que he hecho y guardado. También con las flechas de movilidad y la opción de volver, además esta pantalla tiene la opción de crear un nuevo dibujo.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7lC-q2-zQbg_VXOHovbCFEbcifxjwBaSGDtEpnb-1dms4cCtvc49N1pyroW3dmdzdEhMWBSnAe3KtHVHyt10PtATfOZX4-3GkP7kvaiJ1_LfAYbD4nm5gB-OVk4j9UkVLkd3Ycah3jHcX/s320/Interfaz-7.bmp)
Cuando elegimos un dibujo lo podemos visualizarlo más grande, ver el título de la obra, editarlo, borrarlo y ver la valoración de los otros usuarios.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJTeumxKNVB7Wy9jObJWs3rFfndnXyEy0z3Vj32g6cNLycFVZeTx7XggAmEEIAKUhlsyNfPZww535e4J8vy4TvMMBdgJdU8Gr6ACo5Z6JmwRWt0layxhyj0DJ9xqbWzyLBjlMCntNqArLE/s320/Interfaz-1.bmp)
Cuando elegimos dibujar en el primer menú, nuevo dibujo o editar nos lleva a lo que es la aplicación en si de dibujo, como vemos es igual al paint, de este modo respetamos la coherencia (restricciones) y evitamos que el usuario se sienta confuso, únicamente ponemos a la vista las opciones de guardar y cargar un archivo.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfc74hG2-OC70FvjgcmqHyP3t_tUAPyj-kJeXAL_UtJXUyr1RhNegPA9wLqSu838fxMQNCl4KVDnJoSgEaUvhuL0DVlQ9PH9uliNuYydaFzPC2cU_fFguHFWBfUZ6nI4-RfrXt_yqAdFBO/s320/Interfaz-8.bmp)
Y por último pongo un ejemplo de como sería una interancción directa con la aplicación (en este caso de guardado) ya que todo este tipo de aplicaciones serían análogas a las de Windows pero con preguntas más asequibles para los niños.
-----------------------------------------------------------------------------------------------
Hecho por Silverio Cardona Rodríguez y Aitor Hernández Peña.