Interactive Puzzle Game Development

• สถานะ: Open
• รางวัล: $30
• ผลงานที่ได้รับ: 27

รายละเอียดการประกวด

Puzzle Pieces (CHECK ATTACHED FILES)

Design: Pieces must be identical to the provided attached images.
Initial Positioning: All pieces will initially appear below the board in a random order.
Interactivity:
Drag and Drop: Users can drag pieces from the initial container and drop them into the empty spaces on the board.
Visual Feedback: Upon dropping a piece into a space, its placement will be verified as correct or incorrect, displaying the corresponding visual indication.
Piece Movement: Pieces already placed on the board can be moved between different spaces or returned to the initial container.
Game Board

Design: The board should contain clearly defined empty spaces where pieces must fit.
Interactivity:
Accepting Pieces: Only pieces dragged from the initial container or from other board spaces are allowed.
Placement Validation: Upon dropping a piece into a space, the system will automatically verify if the location is correct or not, applying the corresponding visual indication.
Game Completion: The game is considered complete when all pieces are correctly placed in their respective spaces.
Technical Requirements

Technologies Used: HTML5, CSS3, and JavaScript (preferably using ES6 or higher).
Compatibility: The game must be compatible with major web browsers and adapt to various screen sizes (responsive design).
Accessibility: Ensure the game is accessible to all users, including alternative navigation options for users with disabilities.

Juego de Rompecabezas
Descripción General
Convertir la maqueta del juego de rompecabezas en una versión funcional utilizando HTML, CSS y JavaScript. El objetivo es desarrollar un rompecabezas interactivo donde las piezas puedan arrastrarse y soltarse en espacios específicos del tablero.

Especificaciones Detalladas
Piezas del Rompecabezas

Diseño: Las piezas deben ser idénticas a las imágenes adjuntas proporcionadas.
Posición Inicial: Todas las piezas aparecerán inicialmente debajo del tablero en un orden aleatorio.
Interactividad:
Arrastrar y Soltar: Los usuarios podrán arrastrar las piezas desde el contenedor inicial y soltarlas en los espacios vacíos del tablero.
Retroalimentación Visual: Al soltar una pieza en un espacio, se verificará si la colocación es correcta o incorrecta, mostrando una indicación visual correspondiente.
Movimiento de Piezas: Las piezas ya colocadas en el tablero podrán moverse entre diferentes espacios o retornarse al contenedor inicial.
Tablero de Juego

Diseño: El tablero debe contener espacios vacíos claramente definidos donde las piezas deben encajar.
Interactividad:
Aceptación de Piezas: Solo se permitirán piezas arrastradas desde el contenedor inicial o desde otros espacios del tablero.
Validación de Colocación: Al soltar una pieza en un espacio, se verificará automáticamente si la ubicación es correcta o no, aplicando la indicación visual correspondiente.
Finalización del Juego: El juego se considerará completado cuando todas las piezas estén correctamente colocadas en sus respectivos espacios.
Requisitos Técnicos

Tecnologías Utilizadas: HTML5, CSS3 y JavaScript (preferiblemente utilizando ES6 o superior).
Compatibilidad: El juego debe ser compatible con los principales navegadores web y adaptarse a diferentes tamaños de pantalla (diseño responsivo).
Accesibilidad: Asegurar que el juego sea accesible para todos los usuarios, incluyendo alternativas de navegación para usuarios con discapacidades.
Enhanced Requirement: Functional Implementation of the Puzzle Game
General Description
Convert the game mockup into a functional version using HTML, CSS, and JavaScript. The goal is to develop an interactive puzzle where pieces can be dragged and dropped into specific spaces on the board.

ทักษะแนะนำ

• CSS
• HTML
• JavaScript