Skip to content

fdelacruz02/CellularOdyssey

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Team Date Institution Project Name
Francisco De La Cruz, Fransheska Rodriguez, Jonathan Rodriguez, Ruandy Valdez
November 8th, 2024 to November 10th, 2024
Passaic County Community College
Cellular Odyssey

link to our site

link to our figma

Inspiration and Vision

Expecting a seven-year-old to understand the human body's complexities, a concept that PHD scientists continue to research can be intimidating. Similarly, the traditional educational system depends heavily on textbook-based methods to teach biology to middle and elementary school students. Unfortunately, these methods often fail to accommodate the limited attention spans of young learners, a challenge that continues to increase exponentially over the years. Recognizing the need for a more engaging, interactive, and immersive approach to learning, we created Cellular Odyssey, a game designed to make learning biology both fun and memorable for students.

What our project does

Our project offers a personalized interactive experience tailored to each user's grade level, guiding them through the human body as a red blood cell. Starting in the bone marrow, the blood cell travels through the heart, lungs, kidneys, liver, brain, and digestive system before returning to the heart. Along the way, a custom-built chatbot provides answers to any questions users may have related to the topic. At the end, students take a quiz to reinforce Bloom's taxonomy form of learning and earn a certificate of completion as a form of incentive.

How we built our project

After designing the program concept, we created a flowchart to map out the chronological order of our tasks. We then delegated responsibilities among team members: some focused on the user interface design, others on programming a personalized chatbot, and others on researching and ensuring the content was accurate and age-appropriate. We used Figma to layout how our project should work. We used Blender and Spline software to create a user-friendly interface for the model design. This includes designing the instructor character and all of the 3D organs. The coding was done using JavaScript, PHP, MySQL, HTML, and CSS to develop a responsive, personal chatbot. Furthermore, we utilized regular expressions to enable the chatbot to understand and respond accurately to user inputs. For the core programming tasks, we used PHP to build JSON objects based off your position in our project using the Spline. On the frontend we used JavaScript to call the JSON objects and display them on the screen using typed.js. For the chatbot we used JavaScript and regular expressions to answer questions our users may have. Lastly, for the award certificate, we used Canva design.

Challenges we ran into

The main challenge we faced was during the programming and design phase. During the designing process, we had difficulty displaying the text correctly within the program. Initially, we thought the issue stemmed from an error in the code. After extensive debugging, we discovered that the issue wasn¿t with the code itself but that the program wasn¿t displaying any text because the database lacked the necessary content to retrieve. Once we identified this, we addressed the issue by inserting the required information into the database. Allowing the text to display properly and the program to function as intended. During the process of creating the chatbot, we encountered an issue where expressions were not matching properly, resulting in incorrect responses. This problem arose due to improper function implementation and faulty logic. However, after debugging, we were able to identify and resolve the issues, adjust the code, and provide the user with the correct responses.

Accomplishments we are proud of

  • Creating a personalized chatbot
  • solving the text issue that we faced
  • learning regular expressions in JavaScript
  • learning Blender
  • Having the Spline API work

What we learned

Over these 36 hours, our team has learned to come together and overcome challenges under tight time constraints. From the start of the hackathon, we were determined to finish, but along the way, we faced frustration with our code, sleep deprivation, and moments of feeling overwhelmed by the pressure to succeed. Nonetheless, we learned to manage our time wisely, delegate tasks according to each member¿s strengths, and develop new skills from one another to complete every task. Taking breaks became essential; stepping away from the code helped us return with fresh perspectives and work more productively. In the action phase, our researcher explored the science and psychology behind Bloom¿s Taxonomy, finding that interactive play greatly aids students¿ retention of information. Our designer learned the fundamentals of 3D modeling in Blender, starting with a 2D model and learning to extrude shapes into 3D forms, while both programmers gained experience in version control, saving drafts to track where the code succeeded or failed. Overall, we worked through our challenges, adapted to new roles, and feel proud of our collective achievements.

Built with

  • PHP
  • JavaScript
  • HTML
  • CSS
  • MySQL
  • Blender
  • Spline
  • Figma
  • GoDaddy

About

HackPrinceton Fall 2024

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors