Minding-Our-Minds

• 

  Slide 3

• 

  Slide 4

• 

  Slide 5

• 

  Slide 6

• 

  Slide 7

• 

  Slide 1

• 

  Slide 2

Inspiration

Our inspiration was that we noticed that people could not come up with something good to say about themselves when they were asked to compliment themselves. This connected to not being self confident. Especially with many new "standards" according to social media in this society, we know that a lot of people are self conscious of what they look like and not able to say confidently that they are beautiful and perfect in their own way.

What it does

Minding Our Minds creates a safeplace for teenagers struggling with self-confidence and insecurities. This is a well-known problem among teens and can be fixed through our website.

How I built it

We used html to create the website. We included links to videos and quizzes based on self-assessment as well as inspirational quotes. We also used javascript to code for the mirror feature of the website. The mirror includes encouraging words about the user and quotes to inspire them and influence a positive perspective on their image.

Challenges I ran into

We had issues on displaying the text on the mirror file because our whole website was based on html but the mirror portion of it was based on a p5.js code. It was difficult to create a function that would display the text in the right format.

Accomplishments that I'm proud of

We are proud of working on a html code based website for the first time. We are also proud of creating the mirror because it is unique and directly targets the problem that we were trying to address.

What I learned

We learned that in coding, you have to keep doing trial and error because you may not get the code right for the first time but as you do keep tweaking the code little by little, it can give you the right code.

What's next for Minding-Our-Minds

Minding Our Minds aims to add more details to the mirror feature and hopefully include an interaction between the user and the server.

Built With

• html-javascript-p5.js