Este es el tercer proyecto realizado para Geeks Hubs Academy. He tenido que desarrollar un Tres en Raya (Tic Tac Toe) que funcione y con uno requisitos mínimos:
- Páginas creadas para la Interfaz de Usuario (índice, selección de jugadoras/es, tablero de juego y ganadror/a).
- Poder establecer los nombres de los jugadores/as a través de una entrada, y jugar usando esos nombres.
- Una función que compruebe quien gana.
Mi diseño esta inspirado en el Sistema Operativo de Windows 95, más específicamente, quería que el juego luciera como el Buscaminas (Minesweeper), pero como sí lo jugaras en un PC con W95 instalado. Esto me ha dado la oportunidad de añadir algunas características extras al juego, como el comportamiento de ventanas o incluso de la barra de tareas.
¡¡¡¡Te recomiendo que dejes la timidez a un lado y lo pruebes!!!!.
This is the third project made for Geeks Hubs Academy. I must develope a functional Tic Tac Toe with some minimun requirements:
- Pages created for the User Interface (index, players selection, board game and winner).
- Being able to set the names of the players through an input, and to play the game using those names.
- A function in JavaScript to check the winner.
I inspired my design on Windows 95 Operative System, to be more specific, I wanted this game to look like the Minesweeper game, but as if you were playing in a PC with the W95 installed on it. This gave me the chance to add some features to the game, like the behavior of the windows or even the taskbar.
My recomendation for you, don't be shy and test my game!!!!.
Windows 11: Version 22H2
Visual Studio Code: Version 1.74.3
HyperText Markup Language: Version 5
Cascading Style Sheets: Version 3
JavaScript
| Web | Responsive (Nexus 5 device) |
|---|---|
 |
 |
 |
 |
 |
 |
 |
 |
 |
 |
| Imitación del comportamiento de las ventanas de W95 cuando se minimizan. | Simulating the W95 window behavior when minimized. |
 |
 |
Todo ha sido cuidadosamente consturido con CSS3, desde las mediaquerys hasta el diseño de los iconos. Además he intentado utilizar la menor cantidad de imágenes posible, ya que realmente quería hacerlo todo usando mis propios medios. Las imágenes son el icono original de W95, el icono del juego y las fichas de jugador.
Everything was set very carefuylly with CSS3, from the mediaquerys to the icons design. Also I've tried to use only a few aseets to this project, i really wanted to build everything by myself. The assets are the original W95 icon, the game icon and both tokens.
- Se ha intentado que todo sea lo más intuitivo posible, es por eso que lo primero que vas a encontrarte es el "Escritorio" y solo una "Aplicación" para usar.
- Una vez has hecho click al icono del juego este dará comienzo, deberías de entrar a la página de Selección de jugadoras/es, dónde podréis introducir vuestros nombres (o apodos) para la partida. Si estais listos, haz click al botón de "Start" de color verde.
- Os doy la bienvenida al tablero de juego, aquí podeis ver vuestros nombres y algunas instrucciones que seguir. Para jugar solo tendreis que hacer click en algúna casilla parar rellenara/vaciarla. Las reglas son sencillas, cada jugador/a dispone de 3 fichas, puedes colocar una ficha por turno, una vez colocadas todas las fichas será momento de cambiar de casilla una de las fichas en el tablero, pero ve con cuidado o podrías perder la partida.
- Desde esta pantalla en adelante puedes elegir si quieres volver a empezar la partida ("NEW MATCH"), o regresar a la pantalla de Selección de Jugadoras/es ("NEW GAME") simplemente apretando los botones correspondientes.
- La pantalla final solo se mostrará cuándo alguien gane la partida, asi que.... ¡¡¡¡BUENA SUERTE A TODO EL MUNDO!!!!
- Everything was done to be as intuitive as possible, because of that the first thing you will find is the "Desktop" and only one "Aplication" to use.
- Once you have clicked to the icon, the game will start, so now you should be at Player Selection page, were you will be able to introduce your name (or a nickname) for the match. If you are ready, click the "Start" green button.
- Welcome to the game board, here you can see your player's name and also some information to follow. To play the game you just need to click at the area you want to fill/empty. The rules are easy, every player can only set 3 tokens, you can set one token per turn, once both players have played all 3 tokens it's time to move once existing token to another place, but be carefull with your choice or you will be defeated.
- From now on, you can choose if you want to start again the match ("NEW MATCH"), or to come back to the Player Selection screen ("NEW GAME") just by pressing the corresponding button.
- The final screen is only abaliable when a player get to win, so....GOOD LUCK TO EVERYONE!!!!
- E-mail: bichoifj@gmail.com
- GitHub: https://github.com/IgnacioFurio
- Linkedin: https://www.linkedin.com/in/ignacio-furi%C3%B3-0a9010233/
- WhatsApp: (+34) 636 759 410