Create A 3D Card Game Using Three.js And GSAP
Автор: Wael Yasmina
Загружено: 2023-05-19
Просмотров: 14035
Описание:
In this tutorial we're going to create a card game based on the E-Card from the anime Kaiji: the ultimate survivor.
We're going to use plain Javascript with Three.js and GSAP.
---
Timestamps:
00:00 Introduction
00:21 The rules of the game
01:11 Setting up
03:58 Preparing the scene
06:14 Creating the cards
13:39 Player cards animations
17:17 Opponent cards animations
19:47 Fixing a couple of issues
22:32 Cards reset for another round
28:12 Exchange of the emperor & slave
29:38 Score UI
34:01 Final text animation & rematch
41:23 Adding sound effects
42:51 Outro
---
Support the channel
buymeacoffee.com/waelyasmina
---
Three.js playlist
• Three.js Tutorials
---
Three.js Tutorial For Absolute Beginners
• Three.js Tutorial For Absolute Beginners
How To Create Realistic Scenes In Three.js - Tone Mapping, HDR, Gamma Correction, sRGB Color Space
• How To Create Realistic Scenes In Three.js...
---
The boilerplate that I'm using in my tutorials
https://github.com/WaelYasmina/ThreeB...
Project Assets
https://drive.google.com/file/d/1fOI7...
---
GitHub repo
https://github.com/WaelYasmina/ecard
---
Pen by LLUIS
https://codepen.io/lluisalen/pen/pozMmZx
---
Cards' textures
https://www.deviantart.com/greysonx/a...
Zawa sound effect
https://www.myinstants.com/en/instant...
---
Generating random whole numbers in JavaScript in a specific range
https://stackoverflow.com/questions/1...
How to randomize (shuffle) a JavaScript array
https://stackoverflow.com/questions/2...
Повторяем попытку...
Доступные форматы для скачивания:
Скачать видео
-
Информация по загрузке: