In Web 1 Bruce asked us to create a single page website about a topic of our choice that we were passionate about that had to include iframes for a video as well as dedicated sections for the various things we would talk about as well as some kind of gallery. I chose to create a website about the history of video game consoles. I chose this topic because I have been playing video games since I was a kid and I have always been interested in the history of video games. I wanted to create a website that would be a good resource for people who are interested in learning about the history of video games. I also wanted to create a website that would be easy to navigate and would be visually appealing.
In order to make the website I broke down the layout in its simplest sections as seen above. I decided to have a section for explaining the histroy of video game consoles along with a documentary that was available on Youtube as well an interactive gallery that showed the consoles by generation. Finally, I then had to find images for each console to include in the gallery. I then created a wireframe for the site as seen below.
The most complex part of the project at the time was the interactive gallery. This was a relatively advanced feature to be including at the time and I had to do a lot of research to figure out how to make it work. I ended up using a combination of HTML, CSS, and JavaScript to make it work. With Bruce's help and some hefty online researching I came across some code that allowed me to make the gallery elements selectable via categories and allowed me to create the gallery as I saw it in my initial planning.
Ultimately the project was successful, getting all of the complex elements functional and working together along with the iframe for the youtube video I was going to use for the video criteria of the project. Ultimately I had been over ambitious on the gallery and ran out of time to make the site fully mobile responsive. I also had to make some compromises on the design of the site as I was not able to get the site to look exactly as I had envisioned it. However, I am still proud of it and look back on it as one of my favorite web projects to date (other than my portfolio of course!)and I am looking forward to updating it one day.
Check out the site HERE.