Social Media Video Production /Animation Web Design /Development Photography /Design Contact /Blog

Web Design/Development

Stranger Things

Stranger Things logo

Photo taken from Wikipedia

The rise of the uber-popular Netflix show Stranger Things inspired this next project. The assignment was to work in groups to create an interactive website using Javascript. My groupmates and I decided to create a website for Stranger Things as they currently do not have one.

The first thing we did was layout our content in Photoshop so that we could all have a common vision of the end goal. The idea was to create a space for information about the show but also links to external assets (e.g. merchandise, promotional trailers, etc.). We then divided up the work. I was responsible for completing all of the Javascript for the project and part of the CSS.

Home page layout Hawkins page layout Upside Down page layout

I first worked on the spacing and sizing of the elements in CSS to ensure that they fit well on each of the pages and matched our Photoshop layout. I then added a hover animation to the images to allow them to enlarge when the mouse was over top of them. Additionally, I added a fade in to the elements on the main page to make the transition smoother when the page loaded in. After these initial design features were coded, I included the plugin for the map section. My last task was to code the email sign up section in Javascript which involved restricting strings to ensure the correct information was entered and changing the visibility of objects when the form was completed. Sections like these are standard on most websites so it was extremely beneficial that I was able to successfully code one. Overall, this assignment allowed me to gain a greater understanding of how different coding languages interact and speak to one another, as well as the capabilities of each individual language. It also allowed me to code in a group which I had never done before until this point. To view the finished website click here.

Don't forget to check out my fellow group members on LinkedIn by clicking on their images below!

Dannielle James Lauryn Ferkul

To the top ↑