Smith Dove Capstone 2025

For my Capstone project, I coded a digital coaching board, specifically for SLA soccer. I utilized the code editor website, CodePen, to design and bring my ideas to life through code. My final coaching board includes a semi-realistic representation of a soccer field, a user interface bar which houses draggable red and blue circle icons, representing players. It also includes two buttons: one to control a drawing feature and another for taking screenshots Obstacles followed me wherever I went with this project. The biggest obstacle I faced was successfully implementing the drawing feature into my code. Initially, I had an image representing the soccer field of my coaching board, but due to interferences of different existing divider and container elements, the canvas (drawing) feature couldn’t be layered properly. To solve this, I removed the image of the soccer field and instead coded my own soccer field using CSS. This allowed the canvas feature to be set on top of my new soccer field so it could work successfully. The most valuable lesson I learned from completing my capstone project is that there’s almost always a solution to a problem if I look hard enough. I had many moments of frustration and anger while trying to implement different functions in my code. It oftentimes felt like no matter where I looked, I would always get the same unhelpful advice. But through persistent research and deep thought, I was eventually able to find a solution to my problems.

Link to my Capstone: https://codepen.io/dovesmitty/full/WbedWWx

Sources:

“HTML Tutorial.” W3Schools, https://www.w3schools.com/Html/. Accessed 13 January 2025.

“Learn HTML.” Codecademy, https://www.codecademy.com/learn/learn-html. Accessed 15 January 2025.

Durocher, David. HTML / CSS QuickStart Guide: The Simplified Beginners Guide to Developing a Strong Coding Foundation, Building Responsive Websites, and Mastering the Fundamentals of Modern Web Design. ClydeBank Media LLC, 2021. Accessed 15 January 2025.

Pinterest, https://www.pinterest.com/. Accessed 15 January 2025.

Padolsey, James. Clean Code in JavaScript: Develop Reliable, Maintainable, and Robust JavaScript. Packt Publishing, Limited, 2020. Accessed 14 January 2025.

MockFlow - Online Wireframing and Product Design Tool, https://mockflow.com/. Accessed 14 January 2025.

“HTML & CSS Full Course - Beginner to Pro.” YouTube, 5 February 2022, HTML & CSS Full Course - Beginner to Pro Accessed 13 January 2025.

“HTML: HyperText Markup Language | MDN.” MDN Web Docs, 19 December 2024, https://developer.mozilla.org/en-US/docs/Web/HTML. Accessed 13 January 2025.

“Introducing ChatGPT.” OpenAI, 30 November 2022, https://openai.com/index/chatgpt/. Accessed 13 January 2025.

CodePen: Online Code Editor and Front End Web Developer Community, https://codepen.io/. Accessed 13 January 2025.

“HTML Tutorial.” W3Schools, https://www.w3schools.com/Html/. Accessed 13 January 2025