Create a Trivia Tool Based on an Existing Tool (Vue.js + PHP 5.4) – EXPRESS Project
Budget: $30 – $250 USD
This project consists of taking an already developed **survey creation tool**, which can be seen at [https://bit.ly/4i8z4cP](https://bit.ly/4i8z4cP), and duplicating it to create another very similar tool but for **trivia creation**, adding the functionalities described below.
You can view the prototype of the **trivia tool** (including all changes and functionalities that this new tool must have) at [https://bit.ly/41aDHw9](https://bit.ly/41aDHw9).
This project must be delivered **within a maximum of 24 hours** after the proposal is accepted.
The project is developed in **VUE.js** and must continue to be developed using this framework, so we are looking for an expert in **VUE.js**. It runs on a **server with PHP 5.4** (we cannot change this). Credentials will be provided to work directly on my server.
This is the **first of several tools** we need to develop, so if the collaboration goes well, the idea is to continue working with the same developer for future projects.
The project consists of a **trivia creation tool** that users can create and publish and share through an **HTML embed code** (you can check how published surveys look by accessing [https://bit.ly/4i8z4cP](https://bit.ly/4i8z4cP) and clicking on the URL that appears in the embed code under the **"ver código" ("view code")** button).
When the user **publishes**, the public version of the tool is uploaded to another server via **FTP** (this is already developed). On that server, an **index.php** file is generated, which controls the form, and a **data.json** file is created, which contains the survey configuration specified when creating the tool (this is already developed for the survey tool and works exactly the same for trivia).
---
### **New Features of the Trivia Tool Compared to the Survey Tool**
- **Scoring System:** Unlike surveys, each question is assigned a score when created. Based on the score obtained, users receive **"devolución" ("feedback")** at the end. The scoring functionality must be implemented so that when a question is created, a score is assigned. Then, as users answer, the system calculates their points and displays the corresponding **"devolución" ("feedback")** based on their total score.
- **Game Mode:** When creating the tool, the user must specify whether the trivia will be played **with or without scoring**. The internal functionality of the tool remains the same in both cases (questions will still have an assigned score, and that score will be used for **"devolución" ("feedback")**). However, in **"Sin puntaje" ("No scoring")** mode, the user will not see the points obtained.
- **"Opciones de selección" ("Multiple Choice") Questions:** Each answer option includes a button to mark it as **correct** (it is possible to mark more than one correct answer).
- **"Devolución" ("Feedback") Field:** This is a text field that appears after answering a question to explain the correct answer.
- **Question Score Field:** Allows setting the **score per question** (default is **1 point per question**). If multiple answers are correct, the user gets the full score even if they select just one correct option.
- **New Question Type – "Verdadero o falso" ("True or False")**:
- Works like multiple-choice questions but with only two options: **True or False**.
- When creating a question, the user enters the statement and selects whether the correct answer is **true** or **false**.
- **New Question Type – "Ordenar elementos" ("Order Elements")**:
- The user must **drag and drop** options into the correct order.
- The same **drag-and-drop script** used in the form creation tool can be reused for this functionality.
- **Scoring Options:** Users must select when scoring should occur:
- **"puntuar al contestar cada pregunta" ("Score after each question")**
- After answering a question, the system immediately provides feedback, shows correct and incorrect answers, and displays points earned.
- Below each question, a **"Contestar" ("Submit Answer")** button must be clicked to register the response and trigger the scoring and **"devolución" ("feedback")**.
- After answering all questions, clicking **"Enviar" ("Submit")** will display **overall feedback** based on the final score.
- When the final feedback appears, the system must **auto-scroll** to that section.
- The **"datos personales" ("Personal Data")** module must be hidden once the final feedback is displayed.
- Once a question has been scored, it must be **locked**, preventing users from changing their selection (this is already implemented in the current tool).
- **"una vez que haya contestado todas las preguntas" ("Score at the end")**
- When all questions are answered and the user clicks **"Enviar" ("Submit")**, the system **auto-scrolls** to the first question and displays **scoring and feedback** for each question.
- Questions must be **locked** after scoring, preventing users from changing their selection (this is already implemented in the current tool).
- The **"datos personales" ("Personal Data")** module must disappear, and the overall feedback must be displayed.
- **Replay Option – "El usuario puede volver a jugar luego de ver los resultados" ("User can replay after seeing results")**
- If enabled, a **"Volver a jugar" ("Play Again")** button appears after completing the trivia, allowing users to replay.
- If disabled, the button does not appear, and if the user re-enters the trivia, they see **their previous results** instead of replaying.
- This functionality must be implemented by **storing a session cookie** and loading the session when the user returns.
- **"Devolución" ("Feedback") Module in the Trivia Creation Form:**
- Allows creating multiple feedback messages based on the user’s score.
- Users can define multiple rules to display different feedback messages depending on the score obtained.
- **"Dar opciones para compartir resultados" ("Allow users to share results")**
- If enabled, social media sharing icons appear.
- The shared content includes **the obtained score, feedback message, and trivia link**.
- **Random Order for Questions in "Opciones de selección" ("Multiple Choice") and "Ordenar elementos" ("Order Elements") Questions:**
- If the **"Orden aleatorio de las opciones" ("Random order of options")** setting is enabled, response options will be randomly shuffled **each time the public version of the tool is loaded**.
---
### **Final Notes**
This is an **express project** with a **strict deadline of 24 hours** after acceptance. It requires **Vue.js expertise**, experience working with **PHP 5.4**, and the ability to deploy directly to our server.
If this project goes well, we plan to continue working with the same developer for additional tools in the future.
You can view the prototype of the **trivia tool** (including all changes and functionalities that this new tool must have) at [https://bit.ly/41aDHw9](https://bit.ly/41aDHw9).
This project must be delivered **within a maximum of 24 hours** after the proposal is accepted.
The project is developed in **VUE.js** and must continue to be developed using this framework, so we are looking for an expert in **VUE.js**. It runs on a **server with PHP 5.4** (we cannot change this). Credentials will be provided to work directly on my server.
This is the **first of several tools** we need to develop, so if the collaboration goes well, the idea is to continue working with the same developer for future projects.
The project consists of a **trivia creation tool** that users can create and publish and share through an **HTML embed code** (you can check how published surveys look by accessing [https://bit.ly/4i8z4cP](https://bit.ly/4i8z4cP) and clicking on the URL that appears in the embed code under the **"ver código" ("view code")** button).
When the user **publishes**, the public version of the tool is uploaded to another server via **FTP** (this is already developed). On that server, an **index.php** file is generated, which controls the form, and a **data.json** file is created, which contains the survey configuration specified when creating the tool (this is already developed for the survey tool and works exactly the same for trivia).
---
### **New Features of the Trivia Tool Compared to the Survey Tool**
- **Scoring System:** Unlike surveys, each question is assigned a score when created. Based on the score obtained, users receive **"devolución" ("feedback")** at the end. The scoring functionality must be implemented so that when a question is created, a score is assigned. Then, as users answer, the system calculates their points and displays the corresponding **"devolución" ("feedback")** based on their total score.
- **Game Mode:** When creating the tool, the user must specify whether the trivia will be played **with or without scoring**. The internal functionality of the tool remains the same in both cases (questions will still have an assigned score, and that score will be used for **"devolución" ("feedback")**). However, in **"Sin puntaje" ("No scoring")** mode, the user will not see the points obtained.
- **"Opciones de selección" ("Multiple Choice") Questions:** Each answer option includes a button to mark it as **correct** (it is possible to mark more than one correct answer).
- **"Devolución" ("Feedback") Field:** This is a text field that appears after answering a question to explain the correct answer.
- **Question Score Field:** Allows setting the **score per question** (default is **1 point per question**). If multiple answers are correct, the user gets the full score even if they select just one correct option.
- **New Question Type – "Verdadero o falso" ("True or False")**:
- Works like multiple-choice questions but with only two options: **True or False**.
- When creating a question, the user enters the statement and selects whether the correct answer is **true** or **false**.
- **New Question Type – "Ordenar elementos" ("Order Elements")**:
- The user must **drag and drop** options into the correct order.
- The same **drag-and-drop script** used in the form creation tool can be reused for this functionality.
- **Scoring Options:** Users must select when scoring should occur:
- **"puntuar al contestar cada pregunta" ("Score after each question")**
- After answering a question, the system immediately provides feedback, shows correct and incorrect answers, and displays points earned.
- Below each question, a **"Contestar" ("Submit Answer")** button must be clicked to register the response and trigger the scoring and **"devolución" ("feedback")**.
- After answering all questions, clicking **"Enviar" ("Submit")** will display **overall feedback** based on the final score.
- When the final feedback appears, the system must **auto-scroll** to that section.
- The **"datos personales" ("Personal Data")** module must be hidden once the final feedback is displayed.
- Once a question has been scored, it must be **locked**, preventing users from changing their selection (this is already implemented in the current tool).
- **"una vez que haya contestado todas las preguntas" ("Score at the end")**
- When all questions are answered and the user clicks **"Enviar" ("Submit")**, the system **auto-scrolls** to the first question and displays **scoring and feedback** for each question.
- Questions must be **locked** after scoring, preventing users from changing their selection (this is already implemented in the current tool).
- The **"datos personales" ("Personal Data")** module must disappear, and the overall feedback must be displayed.
- **Replay Option – "El usuario puede volver a jugar luego de ver los resultados" ("User can replay after seeing results")**
- If enabled, a **"Volver a jugar" ("Play Again")** button appears after completing the trivia, allowing users to replay.
- If disabled, the button does not appear, and if the user re-enters the trivia, they see **their previous results** instead of replaying.
- This functionality must be implemented by **storing a session cookie** and loading the session when the user returns.
- **"Devolución" ("Feedback") Module in the Trivia Creation Form:**
- Allows creating multiple feedback messages based on the user’s score.
- Users can define multiple rules to display different feedback messages depending on the score obtained.
- **"Dar opciones para compartir resultados" ("Allow users to share results")**
- If enabled, social media sharing icons appear.
- The shared content includes **the obtained score, feedback message, and trivia link**.
- **Random Order for Questions in "Opciones de selección" ("Multiple Choice") and "Ordenar elementos" ("Order Elements") Questions:**
- If the **"Orden aleatorio de las opciones" ("Random order of options")** setting is enabled, response options will be randomly shuffled **each time the public version of the tool is loaded**.
---
### **Final Notes**
This is an **express project** with a **strict deadline of 24 hours** after acceptance. It requires **Vue.js expertise**, experience working with **PHP 5.4**, and the ability to deploy directly to our server.
If this project goes well, we plan to continue working with the same developer for additional tools in the future.