Streaming Site

The first process that went into this project was using Figma in order to plan a design for a website that streams HBO’s “Sex and the City” before I coded the site itself. I had to initially think about the most important functions that go into a streaming site such as the show’s logo, a play button, information about the show, as well as images and short descriptions for each episode. I obtained high resolution images of the logo and cast and transformed them into PNGs with transparent backgrounds using Adobe Photoshop. I then designed the site’s ‘episodes’ page by designing a hero banner, play button, cards, and a navigation bar. After completing the structure of the ‘episodes’ page, I was able to use the same layout to create the ‘about’ page where I added information about the show, cast, date aired, and creator.

After I had a design to reference for my streaming website, I programmed the site using HTML and CSS in Visual Studio Code. HTML allowed me to incorporate all of the information I had planned to use in Figma and CSS allowed me to provide the same color arrangements for each part of the website I had designed.