Speedrunsaturday was a gaming media venture with the goal of organizing people and events together in order to create video content that could be livestreamed. I was asked to build a website for the o rganization, and although I had little web design experience, I thought it would be an interesting and fun way to learn something new. I had taken an introductory web design course years before, but had little recollection of it. I learned just about everything I know about CSS and HTML from this project.
The website itself is very simple, but there was a lot of effort I put into it that is under the hood and may go unnoticed. The two biggest individual challanges I faced building this site were the twich pages and the mobile compatibility. An embedded twitch feed was something that was requested be on the site, and it took lots and lots of trial and error for me to get it exactly right, and that ties into my other biggest challange.
Even more daunting of a task, one that had to encapsulate the twitch page, making the site mobile friendly. Rather than take the approach of building an entirely seperate site for mobile users, I opted to take the relatively simple site and make it so it looks good at any resolution or scale. A simple premise, but with a very difficult execution. The stylesheet for speedrun saturday is surprisingly complicated, and getting to that point took me many hours of reseach, trial and error. Most elements scale based on the user's resolution, but it's not as simple as it sounds. Most elements required fine tuning, and had to be scaled uniquely. You'll notice that the UI elements are completely different as well, at a certain width, the style sheet uses a completely different set of values that are more easy to use on a touchscreen.