Smiski YouTube Thumbnail Takeover — Warmup Project Devlog #2

Overview

I continued working on this small project. Although it looks small, the schematics behind it feel very big for me. There were a lot of ups and downs in this hour, but I think I did what I wanted to accomplish today.

What I accomplished today

• Asset Sourcing & Processing: Downloaded new Smiski images to expand the overlay library. Renamed all source assets following the standardized s_1.png, s_2.png, s_3.png naming convention for easy script referencing.
• Popup UI: Made three new files, popup in .html, .css, .js. Essentially, it makes the popup window for the extension when the user wants to turn the smiskis off or on.
• Storage Integration: Connected the popup button to chrome.storage.local to persist the extension’s enabled/disabled state across browser sessions.
• Real-time Event Handling: Implemented chrome.storage.onChanged inside content.js so YouTube updates dynamically when settings change.
• Local testing: I got to “unpack” what I developed locally on my Chrome browser. When I click on my Smiski icon, I have my popup show up, yay!

Current bugs and frustrations

• Although I have the images named the way I want them to be named, their backgrounds won’t be removed, which is very frustrating. I might have to resort to Pinterest, download their images, and get their backgrounds removed one by one instead of having it in bulk. As of right now tho, those images are uploaded and committed to GitHub as a backup. If anyone knows a way to remove the backgrounds from multiple images at the same time, a comment would help!
• The button text in the popup window won’t change words.
• The smiskis don’t show up on the youtube thumbnails. Maybe I’ll get to that later today.

Next steps!

• Get better photos, I guess.
• Debug popup.js event listeners
• Hopefully finish coding and debugging by tomorrow, getting it on the chrome web store, and shipping it!

Until next time :D