Broadcast Blitz: Week 1
I’m a huge college football fan. I was raised on Florida State football and attended every home game and several away games (including a National Championship) while I was a student. While it is harder for me to make it to games in Tallahassee now that I live in New York, I never miss a game on TV. But sometimes it’s hard to keep track of the media coverage. It often isn’t announced until the week or two before the game. And oddly, you often have to dig through a lot of other information just to find a simple answer to the question “What channel is the game on?”. When I came across a college football API that happened to keep track of this information and updated it regularly, I thought it might be fun (and helpful to myself, at the very least) to create a simple project that allows a user to search for their team and receive information on said team’s broadcast schedule.
The first week of this project was less about functionality and more about planning, basic design, and building a skeleton. When planning the project I knew I wanted it to be simple — part of the problem I’ve seen in the past is that there is just too much other information to sort through and I did not want that to be the case with Broadcast Blitz. So in terms of pages, I just want a home screen where one can search for their team and a results page that displays a table with the results. I may expand in the future if it makes sense, but for now, I want to keep it simple and clean. To accomplish this, I created three components — a navbar (for navigation), a home component (for the search bar and instructions to appear on when the user begins), and a table component (to display the results).
For designing the initial/basic layout, I used Figma. In the past I’ve had difficulty understanding how to translate from Figma to a project, but this time things really clicked and I was able to work with Figma to get what I envisioned in my head. I wanted to use the color scheme of the NCAA website to tie to that thematically, so it currently has the same light blue they use throughout their branding. However, I personally find this a little boring so I may change that down the road.
Once I had planned my components and implemented basic design via CSS, I created a skeleton of each component. The navbar is currently just the site name, and this may not change since there is not really much navigating to be done. The home component has a search bar and instructions. However, the search bar does not have any functionality yet as I am focusing on the skeleton and not the functionality this week. Similarly, I’ve mocked up what I’d like my table component to look like with some hard-coded data in a table. In the future, this data will be pulled from the API itself.
