How I Recreate Immersive Yu-Gi-Oh! Card Game Using Augmented Reality

Cong Pham
Geek Culture
Published in
3 min readAug 21, 2022


image from the internet

Yu-Gi-Oh! is a Japanese manga and anime series written by Kazuki Takahashi. The series revolves around the card game known as Duel Monsters, where each player uses cards to “duel” each other in a mock battle of fantasy “monsters”. It is one of my favourite manga and anime series that I feel strongly attached with my childhood memory. As a kid, I have always dreamed of one day we could have those monsters actually jump out of the cards and do battle with one another. With Augmented Reality, I am making my dream come true!

Here is how I am doing it.

Step 1) Create a Xcode project with Augmented Reality

I chose Augmented Reality App for a new project template.

Then, I chose Storyboard as my main interface and RealityKit as content technology.

Step 2) Download the card images

I am always team Dark Magician so I downloaded the front and back image of a card I want from the internet. Then, place it inside the project folder.

Step 3) Purchase the 3D Dark Magician model

I am not a professional 3D modelling artist so I purchased the 3D Dark Magician model from Sketchfab and then place it in my project folder. I think it’s worth it to make my childhood dream comes true.

Step 4) Add the code

I added the following code in the ViewController.swift file. I annotated what each part of code does, so it is easy to understand.

Step 5) Add Tap Gesture to the app

This tap gesture is meant to flip the card up or down when user taps on the card.

In the Main.storyboard, I used Command + Shift + L to open a gesture search panel and search for Tap Gesture Recognizer. Once it was found, then I dragged it to the ARView in the middle of the screen.

Step 6) Build the project

Then I started to build the project using the Play button and also connected the Macbook to my iPhone.


When opening the App, the card is facing down.

When user taps, the card faces up and the mighty Dark Magician appears!

Short video of how it looks like.



Cong Pham
Geek Culture

Hi! My name is Cong from Calgary, Canada. I have a Bachelor degree in Software Engineering and I am trying to share everything I know with you guys :)