technology logo
technology logo

Team Win-Et : Track and Crack

share link

by anjana dot icon Updated: Jan 28, 2022

Guide Kit Guide Kit  

Problem In remote education students face challenges like staying focused and motivated throughout the session. And they can be distracted easily due to lack of motivation. The content used for remote teaching is not effective. Also teachers are finding difficulties to use the technology. For English language teaching the online platform needs to be more interactive and encouraging. In a parent's perspective 35% of Indians are illiterate. As an illiterate parent they struggle to teach their child a new language. And online teaching makes the situation more complicated as parents need to sit aside, so the child gets benefited from the teaching. Because of this the students may feel they are forced to study and they can be driven to stress and trauma. Learning a new language should be fun and encouraging not be seen as a challenge, that should be easily accessible without any supervision and the teachers burden in making the teaching platform more friendly should be reduced. Project As a teacher, you know better than anyone how much the past year has transformed learning. And although our circumstances will continue to change, virtual learning is still a reality for many students and teachers. No matter what teaching looks like this year, building a sense of community is so important for you and your students, especially if they’re learning at home. But with hundreds of virtual teaching platforms to choose from, how do you make sure your students are getting the best resources to learn and grow — and have fun while doing it? Our project is designed to make English learning more fun and friendly , here the students can play games that help them to learn vocabulary and this can be incorporated under a single website. Our project can be linked to any remote learning platform as an extension, our project is single click away, and doesn't have any complicated interface so that can be used without any hindrance. Impact The impact our project makes is that English learning is not a challenge anymore; everyone on remote education can learn them without any supervision. Teachers can be more technologically equipped. Remote teaching can be fun. The Features of our App are • Meanings and Pronunciation of English Words with phonetics • Hangman • Quiz • Jumbled Words • Memory Game • Paint It Future development and Outcome Covid-19 had paved the way for remote learning and nothing should be a hindrance to education. With this kit, learning English is not a challenge. For teachers access to online exercises for students are made possible. The interaction between teachers and students can be increased. Future scope can be done with a personalized monitoring system for each student. Students will find this kit an alternative for regular notebook exercise and the outcome of this project will be motivation towards English learning is encouraged. Parents need not be worried about their kids' education , illiterate parents can also learn English with this kit. Augmented reality can be incorporated with this kit in the future as kids can visualise rhymes and stories. Using augmented reality history classes can be taught with examples from the book. Further work should be done to make this kit possible for all the languages. Not only limiting our project to language teaching this project can be used for engineering and also medical studies. With the above problem statements and idea that is generated , we came up with a solution - track and crack , an engaging , efficient and easy way of learning English through games • We have an idea to include AR to teach children (3-8 yrs.) basic concepts like alphabets, numbers, rhymes, shapes etc.It will be an engaging and effective way to teach them and they can learn better • The extension would have an option of regional language so it makes them learn words by connecting with their native language as well on the other hand learn new words in english primarily • Most of the students don't have access to online resources or neither know about it. So in order to facilitate 24/7 learning we are planning to make our website available offline . Thus the Education never stops due to the lack of internet based resources. To know more about our idea check out the presentation https://www.canva.com/design/DAE2oEdvDHU/WVQW-YkTu1MVFWYmT00tNQ/view?utm_content=DAE2oEdvDHU&utm_campaign=designshare&utm_medium=link&utm_source=publishpresent To know about our project here is the document :- https://docs.google.com/document/d/19ZMLT298Z_m7ZaOnoULvHDstqbDZGivmJEctfo5iD20/edit?usp=sharing To see the deployment use the following link https://win-et-enactusrec-tfgw.netlify.app/

Hangman- Kandi Kit

This game has been developed on React as the primary tech stack and for words an "array-of-english-words" library has been used . We have used this as one of the fun activities for students to learn vocabulary and new words.

react-hangmanby react-puzzle-games

JavaScript doticonstar image 16 doticonVersion:Currentdoticon
License: Permissive (MIT)

Hangman game built with React

Support
    Quality
      Security
        License
          Reuse

            react-hangmanby react-puzzle-games

            JavaScript doticon star image 16 doticonVersion:Currentdoticon License: Permissive (MIT)

            Hangman game built with React
            Support
              Quality
                Security
                  License
                    Reuse

                      Bootstrap

                      Bootstrap is the most popular HTML, CSS and JavaScript framework for developing a responsive and mobile friendly website. We have used bootstrap for developing the overall UI of our website . Use CDN or download from the official site to enable it.

                      bootstrapby twbs

                      JavaScript doticonstar image 162620 doticonVersion:v5.3.0-alpha2doticon
                      License: Permissive (MIT)

                      The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.

                      Support
                        Quality
                          Security
                            License
                              Reuse

                                bootstrapby twbs

                                JavaScript doticon star image 162620 doticonVersion:v5.3.0-alpha2doticon License: Permissive (MIT)

                                The most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web.
                                Support
                                  Quality
                                    Security
                                      License
                                        Reuse

                                          React

                                          React is a JavaScript library for building user interfaces. It is used to build single-page applications. React allows us to create reusable UI components.

                                          reactby facebook

                                          JavaScript doticonstar image 204880 doticonVersion:v18.2.0doticon
                                          License: Permissive (MIT)

                                          The library for web and native user interfaces

                                          Support
                                            Quality
                                              Security
                                                License
                                                  Reuse

                                                    reactby facebook

                                                    JavaScript doticon star image 204880 doticonVersion:v18.2.0doticon License: Permissive (MIT)

                                                    The library for web and native user interfaces
                                                    Support
                                                      Quality
                                                        Security
                                                          License
                                                            Reuse

                                                              Dialogflow-Chatbot

                                                              Dialogflow is a natural language understanding platform used to design and integrate a conversational user interface into mobile apps, web applications, devices, bots, interactive voice response systems and related uses. So for our application we have used this to answer general questions asked by students and integrated with the telegram integration available on the dialogflow.

                                                              JavaScript doticonstar image 582 doticonVersion:0.6.0doticon
                                                              License: Permissive (Apache-2.0)

                                                              Dialogflow agent fulfillment library supporting v1&v2, 8 platforms, and text, card, image, suggestion, custom responses

                                                              Support
                                                                Quality
                                                                  Security
                                                                    License
                                                                      Reuse

                                                                        dialogflow-fulfillment-nodejsby dialogflow

                                                                        JavaScript doticon star image 582 doticonVersion:0.6.0doticon License: Permissive (Apache-2.0)

                                                                        Dialogflow agent fulfillment library supporting v1&v2, 8 platforms, and text, card, image, suggestion, custom responses
                                                                        Support
                                                                          Quality
                                                                            Security
                                                                              License
                                                                                Reuse

                                                                                  Learning Resources

                                                                                  To build apps and to learn more about javascript we used freecodecamp learning curriculum in order to enhance our app and resolve errors

                                                                                  freeCodeCampby freeCodeCamp

                                                                                  TypeScript doticonstar image 363774 doticonVersion:Currentdoticon
                                                                                  License: Permissive (BSD-3-Clause)

                                                                                  freeCodeCamp.org's open-source codebase and curriculum. Learn to code for free.

                                                                                  Support
                                                                                    Quality
                                                                                      Security
                                                                                        License
                                                                                          Reuse

                                                                                            freeCodeCampby freeCodeCamp

                                                                                            TypeScript doticon star image 363774 doticonVersion:Currentdoticon License: Permissive (BSD-3-Clause)

                                                                                            freeCodeCamp.org's open-source codebase and curriculum. Learn to code for free.
                                                                                            Support
                                                                                              Quality
                                                                                                Security
                                                                                                  License
                                                                                                    Reuse

                                                                                                      Kit Solution

                                                                                                      Main Site Page : Main page is the actual view of website application built. It comprises a dictionary with phonetic feature embedded in it to help the children in the remote areas to learn new words with meanings and proper pronunciation. It would be a great confidence booster as many children in remote areas feel being lagged in English vocabulary and pronunciation. Also the main site consists of few fun activities that helps the children learn the language in a more efficient and interesting way. Learning by activities has benefits like : * Increases A Child's Memory Capacity. * Skill-Building. * Computer & Simulation Fluency. * Helps With Fast Strategic Thinking & Problem-Solving. * Develops Hand-Eye Coordination. Tech Stack : API ( Free Dictionary API ) , HTML , CSS , Javascript and Bootstrap Jumbled Words : Jumbled words is a basic fun English activity that we would have come across. To make it accessible to the children in remote areas in a more efficient and simple way, this activity was selected. Also this activity would make the children to make more attempts and try to find words in remembering way that would stay in their mind for long. Tech Stack : Javascript , HTML ,CSS and Bootstrap Javascript is used for shuffling the characters and for validation of submit button for showing results Hangman : Hangman, yes the game that all of us had played for finding movies, songs and what not. So bringing something to children in which they already have interests, would make them more eager to make guesses to find words in English before the game ends is the aim behind adding this activity. Tech Stack : React , Javascript (Node.js) and CSS React is used for more detailed functioning of the stickman used and checking of words used Quiz : Quiz has been one of the most and best used strategy to engage with children to teach them things in a fun way, so that they grasp it easily. Same has been the thought for addition of this activity to make children in remote areas to learn things in better way, that also checks their performance on a time basis! Tech Stack : Javascript , HTML , CSS and Bootstrap Javascript is used here for timer and validation of answers on submission of answers to each questions Memory Game : While learning new stuffs, it’s equally important to keep your memory game up! So the existence of this activity here is an indirect attempt to check children’s memory power, by letting them find the same icons with the least number of moves and in the fastest time period possible. Tech Stack : HTML , CSS and Javascript Javascript is used for checking the matching icons and randomizing them Paint : Well, well, well, painting has always been a part of us in our childhood life and we have till date learned concepts in college through paint and jam-boards in online class. But this opportunity hasn’t been available to everybody, especially to the children in the remote areas. So to make it a part of our work is to bring it to a part of their life Tech Stack : HTML , CSS and Javascript Javascript is used here for proper functioning of all the properties (underline , marker , text) Studento Bot :- It is student educational chatbot developed in the view of making learning easy by answering questions to your children 24/7. Tech Stack : Dialogflow to create the chatbot and integration hooks for connecting it with telegram. To know more about the final outlook of the website check out :- https://github.com/suraj6501/Win-Et-EnactusREC-TFGW/tree/main/ScreenShots

                                                                                                      JavaScript doticonstar image 0 doticonVersion:Currentdoticon
                                                                                                      no licences License: No License (null)

                                                                                                      Tech for Good 2022 Hackathon - Remote education

                                                                                                      Support
                                                                                                        Quality
                                                                                                          Security
                                                                                                            License
                                                                                                              Reuse

                                                                                                                Win-Et-EnactusREC-TFGWby suraj6501

                                                                                                                JavaScript doticon star image 0 doticonVersion:Currentdoticonno licences License: No License

                                                                                                                Tech for Good 2022 Hackathon - Remote education
                                                                                                                Support
                                                                                                                  Quality
                                                                                                                    Security
                                                                                                                      License
                                                                                                                        Reuse

                                                                                                                          Deployment Information

                                                                                                                          This Kit comprises of solutions that are tailored for demographic of remote students https://github.com/suraj6501/Win-Et-EnactusREC-TFGW/

                                                                                                                          So in order to run the app download the code from Github link given in the Kit Solution ( Note : Do download both the codes from main and master branches) For the code in Master Branch - Note : (npm must be installed and activated as an environment variable) 1. Use npm install to install all the dependencies 2. Use npm run build to get the build which will be later used for deployment 3. Use npm start to run the app in the local server https://localhost:8000 For the code in Main Branch 1. Unzip the code locate the file index.html and run it on the local host using Open with Chrome Instructions:- - If the API is slow , wait for few seconds and the result will be then rendered on the site due to freemium version. - To view it offline , use add to reading list bar in the chrome or download the whole site either by using github repo or any external chrome sites. - The extension will be available publicly on chrome store once the payment registration process is done. - To see the deployment live in action use https://win-et-enactusrec-tfgw.netlify.app/ Deployment :- To deploy use netlify