01. Overview

THWIP!—a clever play on the iconic onomatopoeia for Spider-Man’s web shooters—was created for CS50x and served as an introduction to web development using HTML and CSS and was inspired by Marvel’s website for comics, films, and other relevant information. The website focuses on Spider-Man, as well as his relevant allies and rogues, and consists of 4 HTML pages and one CSS style page. In its current state, THWIP! is static and has no working functions or features.

02. Skills Used

This project required that I utilize skills including web design and prototyping, markup languages, and stylesheets. Prior to this project, I had no real experience with any of these, and faced new and unique obstacles that I had not encountered in more programmatic assignments from CS50x. However, with my experiences with 3D modeling and graphic design, I quickly adapted to the more visual space of web design and shifted my focus to aesthetics and user experience. By the end of this project I had learned to manipulate each webpage, tailor them to my vision, and create a responsive and visually interesting website.

03. Future Considerations

Ideally, the final product would have had more intuitive interface design, a working form for newsletter signup, a search function, and the ability to filter the comics and characters by most popular, influential, or necessary to the character, Spider-Man. At the time these implementations were too foreign and complex for my level of skill, and would have taken much longer than my planned window of completion.

04. Reflection

When compared to the web application I created shortly after, TWHIP! seems rather plain in its static state. That said, this was my first real introduction to the basics of web design and creating static web pages using HTML and CSS. The joy I found in seeing my website work after creating it from scratch was unlike any other project I had completed for CS50x. Having total control of seemingly every pixel intrigued me and fueled my desire to eventually make the web application, 4RUMS, with many more moving parts.