Driver/Rider 'Trading Cards': Idea Development

Whilst researching this week on more intensive means of coding for this application I wanted to see if any similar 'educational' motorsport-related projects had been created. Luckily I stumbled upon this project below which utilises basic HTML, CSS and JavaScript to create an aesthetically efficient way of learning the Formula One grid. 


(Boots, 2021)

Following this project, I wondered if there was a trading card game similar to 'Match Attax' built off of the driver's ability on the track. It turns out that the creators of 'Match Attax' (Topps Overview, 2022) have applied the same logic to a Formula One trading card game. Rather than battling one's favourite driver over another and causing contention Topp's focus on this series of cards is the joy of collecting. I wish to mirror this aspect within my own application as part of the aforementioned reward/punishment incentivisation. 


(Formula 1 TOPPS NOW®, 2022)

I decided to flesh out my own version to see if it could be applied to the main motorsport series' I wish to focus on for my Final Year Project. Those are Formula One, Formula E, MotoGP and Indycar which all have extensive team/driver rosters which will create a sense of depth and accomplishment when all are unlocked through the use of the application. 

A prior version I created of this took on a more minimalist approach, simply naming how many championships (if relevant), wins and podiums with a few fun facts. For this application, I want it to be as easy to understand but not quite as 'simple'. 


Prior Version

'Trading Card' Design Logic:

  • The driver's race suit colour scheme ensures that each card is unique from the others.
  • The series with which they belong will be present in the top left whilst their racing number will be clear on the top right, as the drivers change numbers (Max Verstappen 33 / 1 after winning the championship) there will be a novelty in having a driver's previous number. 
  • Their 'stats' will be categorised by the applicable standards of each series.
  • Their race helmet will be in the lower left - helmet displays will be expanded on further below.
  • Their vehicle/bike will be prominent below their name to once again differentiate from their fellow drivers/riders on their grid. 
  • Imagery-wise I wanted to ensure that a moment of triumph (a podium or success in a prior series) is used to invoke a feeling of success etc. 
(F1 Drivers 2022 - Verstappen, Hamilton, Leclerc and more, 2022)
(Max Verstappen 2021 Dutch GP Win, 2021)
  (Max Verstappen - F1 Driver for Red Bull Racing, 2022)

(MotoGP™ Riders, 2022)
(Motosport.com, 2021)
(Monster Yamaha MotoGP, 2022)

 
(Teams & Drivers | FIA Formula E, 2022)
(Galloway, 2021)
(Mercedes-EQ Formula E team | FIA Formula E, 2022)

Helmet Showcases 

Following up on the 'trading card' approach to these collectables within the application I created these special versions which can be unlocked throughout the application. These fall into the personalisation features of the application as these will act as profile pictures of the users. 



Sample Profile Picture




References

2021. Max Verstappen 2021 Dutch GP Win. [image] Available at: <https://twitter.com/redbullracing/status/1434535021478653955> [Accessed 16 October 2022].

Boots, M., 2021. F1 Driver Cards. [online] Codepen. Available at: <https://codepen.io/MarkBoots/pen/vYmywxL> [Accessed 16 October 2022].

Fiaformulae.com. 2022. Mercedes-EQ Formula E team | FIA Formula E. [online] Available at: <https://www.fiaformulae.com/en/championship/teams-and-drivers/mercedes-eq-formula-e-team> [Accessed 16 October 2022].

Fiaformulae.com. 2022. Teams & Drivers | FIA Formula E. [online] Available at: <https://www.fiaformulae.com/en/championship/teams-and-drivers> [Accessed 16 October 2022].

Formula 1® - The Official F1® Website. 2022. F1 Drivers 2022 - Verstappen, Hamilton, Leclerc and more. [online] Available at: <https://www.formula1.com/en/drivers.html> [Accessed 16 October 2022].

Formula 1® - The Official F1® Website. 2022. Max Verstappen - F1 Driver for Red Bull Racing. [online] Available at: <https://www.formula1.com/en/drivers/max-verstappen.html> [Accessed 16 October 2022].

Galloway, S., 2021. [image] Available at: <https://www.motorsportimages.com/photos/?race_type_id=208&search=nyck+de+vries+podium&p=4> [Accessed 16 October 2022].

Monster Yamaha MotoGP, 2022. Fabio Quartararo. [image] Available at: <https://www.yamahamotogp.com/> [Accessed 16 October 2022].

Motogp.com. 2022. MotoGP™ Riders. [online] Available at: <https://www.motogp.com/it/riders/MotoGP> [Accessed 16 October 2022].

Motosport.com, 2021. Fabio Quartararo Podium. [image] Available at: <https://www.motorsport.com/motogp/news/quartararo-says-german-motogp-third-like-gold-after-weekend-of-struggle/6593583/> [Accessed 16 October 2022].

Topps.com. 2022. Formula 1 TOPPS NOW®. [online] Available at: <https://www.topps.com/cards-collectibles/topps-now/formula-1-topps-nowr.html> [Accessed 16 October 2022].


Popular posts from this blog

'Lights Out' Prototype Development

'Lights Out' - Prototype Development In the absence of updates, this project, now known as 'Lights Out' (working title) has significantly developed. Following my research into NFC cards, their functionality and ease of use/creation I ordered a small pack to develop a working prototype of my trading card concept. This proved extremely easy as creating datasets for these cards required a website to host the relevant information. For this prototype, this website was Adobe XD's sharing feature.  The footage below is of my prototype in operation with a variety of trading card designs. The designs are embedded as well for more clarity.  The concept of 'Lights Out' has grown into a more table-top strategy game where each player is given a set of randomised cards which represent attributes of motorsport in action. Whether that be a great aerodynamics package, pitstop crew, sponsors etc. These will affect the way the player progresses through a season (the board)...
Read more

Application Development Research Overview

Application Development Research When developing this application many unknowns need answers. My experience in developing applications/websites is very front-end. Experiences such as developing working prototypes active in applications such as Adobe XD or dictating to a third-party developer what changes needed to be made to my employer's website.  When developing on the more back-end side there's an extensive amount of research that is required before I can definitively answer many of the unknowns.  Existing Motorsport Applications Before going in-depth on the more technical aspects of developing an application I need to know what is already established in the market of motorsport-related applications. Following the applications I researched below I believe each app only offers basic information such as news and current standings.  'Live Timing' features on a number of these applications offer far too much information that has basic filtering options which will overwhe...
Read more

NFC Trading Card Research

Image
Following up on last week's development into a trading card concept I began researching means by which augmented reality could be implemented into the use of physical cards and the application itself.  This began by looking at Amiibo's ( Amiibo - Nintendo - Official Site ), more specifically the use of Amiibo trading card-esque cards (Nintendo, Animal Crossing amiibo cards and Amiibo figures - official site ) which add additional content to multiple entries in Animal Crossing ( Animal Crossing: New leaf 2012) ( Animal Crossing: New horizons 2020) series.  Prolonging the user experience whilst balancing the hobby of collecting cards to showcase. ( Animal Crossing Amiibo Cards ) There are over 500 cards which can be collected in this series that all contain an NFC chip with the corresponding villagers' data within. These communicate with the game itself to add new features and gameplay experiences. These are scanned on the Nintendo devices' dedicated NFC readers (Ninten...
Read more