Neural network Education

Educating on AI through Interactivity and Simplicity

The Problem To Solve

Often when talking about artificial intelligence, the common person may think that the AI has a mind of its own, and makes decisions with thorough processes like we do. This is in fact not the case, and misinformation about AI is a large problem in today’s world. Fortunately, we can often find web sources that help educate the public about the fundamental elements of a neural network. However, it seems that these education sources are targeted towards already knowledgeable adults, and the few that target others seem to teach conceptual understanding poorly. Having the entire public engaged and understanding the parts that make up a neural network can spur interest and learning for the future generations that take on AI, and limit early misunderstandings about its fundamentals. 

In response to this dilemma, my team and I developed a website that educates people about the inner workings of a neural network in a simple and easy to understand way! It comes complete with an interactive playground to train and test your own neural network, and a video explaining visual neural networks simply.

Setup Research

Before we begun working and physically coding our website, we wanted to first locate who our audience was. The point of our app is to be a helpful learning tool for those who do not grasp the nuances of AI, and maybe have trouble understanding other sources of information. Therefore, we decided to make our project focused towards a younger age demographic, and used simpler terms in order to be understood by a wide range of people, not only those with previous knowledge.

 

This thought process led us to look into other websites that educated similarly, but unfortunately it looked like few existed. What we did learn however, is that some sites had a neural network playground, where it was possible to insert images and have an actual model classify them into categories for you. Our team thought this idea was great, so we planned to add it to our own product.

Most Search Results were Intimidating or Unengaging

In order to complete our thorough research, we read and referenced several research papers about education and neural network basics alike. For example, as we knew we wanted to create an online playground where people can test a network on their own, we read a research paper which had developed a similar concept. Using our references we gained a great idea on how we wanted to create our website, what it should accomplish in order to be effective, and how to explain neural networks to others. Below are our references:

The Citations From our Research

On top of this, since we wanted to cater to younger and less educated people, we thought of bringing a second medium to our idea in order to create the most acessible, yet engaging product possible. After looking at what worked best, we decided to add a video component to our project, which would make it both easier to understand for viewers, and more engaging to watch. This was the part of the project I focused on the most as a part of the team. I scripted, narrated, edited, and uploaded the video from scratch, which took hours of research in order to give an accurate, yet easy to understand walkthrough of how neural networks actually think and classify. I believe this part of the project taught me well how to summarize information in a concise yet informative way, and also allowed me to engage my skills in taking a project from top to bottom, through a full process.

Snippet of the Script for the Video

The Process

After going through our research, we came up with a list of important elements we wanted to have inclued in our project:

 

– Educational Youtube Video

– Playground Neural Network Model

– Strong Engagement

– Easy to Understand Explanations

 

We wrote a full project proposal, which included our timeline of events and the information we wanted to get across to our users, along with all of our references. After that, we got to work! Working as a team of three, we split the work into three main categories: the video, the model, and the website. Although we all held a hand in each others work, my main focuses were the video and the neural network model. I edited the video completely from scratch on my own, taking care of all detail and making sure to provide an engaging experience. 

The Editing Process of the Video

Working on our own neural network model for the website presented its own challenges, and was much harder than it may initially seem! The challenge was it had to be simple, easy to use, and also small enough to run on a website efficiently, and was able to intake images in order to classify between animals. There were a lot of issues in designing such a model, but I provided a significant effort towards it, and we managed to complete it! The model itself consists of multiple classes: in the default configuration it is cats and dogs. The user can add more images to train the model, with different classes also able to be added. After training, you can choose a file and test the model, seeing what it will guess the animal to be after training on a few different kinds.

The Neural Network Playground

For our workflow, we decided to use Visual Studio Code and Github for our code, so we could work collaboratively and efficiently. Other tools we used were React, Vite, and Tensorflow. We used React to create our website using HTML/CSS, as it allowed us to make elements of the site more interactive and efficient! Vite also helped with this. Tensorflow was needed in order to create our model. It is a framework that allowed us to program in our classifier and then combine it with the rest of our website to come to the finished product!

The Result

For our final result, the website includes a title/landing section, an education section with the uploaded Youtube video, a playground section, and about section, and a Mission near the bottom! The video is a full 6 minutes long and describes in a simple yet in depth way how neural networks function, and whether they are really “intelligent”. The playground ended up working as we expected it to, after a long road of challenges with it. We also posted all of our code up on Github, along with detailed and clear instructions on how to run the code locally! 

The Main Page of our Website

Conclusions

Overall, we hit all of our main goals, although it took a while to put the finishing touches, and we were very proud of the result! There were many lessons learned in the making of this project, but I think the biggest one has to do with designing ahead. Our team did some great extensive research and planning, but without clear sketches of what the website would look like, we ran into some trouble later on. I think by doing this I have gained a greater appreciation and understanding of the full development process, and gained amazing insights on how to design for an audience, and how to work well with a team!

 

 

One of the greatest things about this project is the possibility of expanding it further in the future. The team took a lot of care to code it cleanly and effectively, and the website can be modulated and have many more features added to it in the future! The potential something like this has is great, and the fact that I was able to make it while learning a lot of valuable insights on workflow, front-end programming, and teamwork, was a great use of my time, and something I am very proud of.