Hogwarts House Test

Inspiration

When I first thought about the theme of this Hackathon, magic, the first thing I thought of was Harry Potter... so I decided to make my project sort of like a sorting hat. I've wondered what house I was more than once, so I thought that others probably have too.

What it does

Hogwarts House Test helps sort people accurately into Gryffindor, Hufflepuff, Ravenclaw, or Slytherin, Hogwarts houses.

How we built it

I built Hogwarts House Test by using HTML, CSS, and JavaScript. I also used Procreate to draw the icon.

Challenges we ran into

One challenge I ran into was that I kinda forgot how to get rid of the spacing between the top of the page and my navbar, but I was able to figure it out. I also ran into an HTML problem since I forgot to put the closing tab.

Accomplishments that we're proud of

I'm mostly proud that my project actually worked, since I've never done something like this before. I'm also proud of remembering how to get rid of the spacing and drawing my icon.

What we learned

I learned how to make a JavaScript form that actually worked and I relearned how to get rid of margin issues.

What's next for Hogwarts House Test

Next, I would like to make Hogwarts House Test a little more user-friendly and... well... prettier. On the front page, the words on the button is a littttle too big, but I didn't have the time to fix that since I ran into a few last minute issues.

Built With

• css
• html
• javascript
• procreate
• repl.it