-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathXCube2D.html
105 lines (94 loc) · 7.47 KB
/
XCube2D.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" name="viewport" content="width=device-width, initial-scale=1"/>
<title>Lynx Button's Portfolio</title>
<link rel="icon" type="image/x-icon" href="assets/images/starGreen.png">
<link href="https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
<link href="css/normalize.css" rel="stylesheet"/>
<link href="css/simple-slideshow-styles.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script src="js/better-simple-slideshow.min.js"></script>
</head>
<body>
<div class="wrapper">
<h1>Lynx Button's Portfolio</h1>
<nav>
<ul>
<li><a href = "index.html" title = "Home"><img class = "navSmaller" src = "assets/images/home_1946488.png" alt = "Home"/></a></li>
<li><a href = "contact.html" title = "About me"><img class = "navSmaller" src = "assets/images/user_1077063.png" alt = "About me"/></a></li>
<li><a href = "summer2023BZ.html" title = "Okido Interactive E-Books"><img src = "assets/images/starBlue.png" alt = "Okido"/></a></li>
<li><a href = "XCube2D.html" title = "XCube2D Animation Subsystem"><img src = "assets/images/starGreen.png" alt = "XCube2D Animation Subsystem"/></a></li>
<li><a href = "homeward.html" title = "Homeward"><img src = "assets/images/starPink.png" alt = "Homeward"/></a></li>
<li><a href = "HuntforBigPaw.html" title = "The Hunt for Big Paw"><img src = "assets/images/starYellow.png" alt = "The Hunt For Big Paw"/></a></li>
</ul>
</nav>
<main>
<h2 class = "center">XCube2D Animation Subsystem</h2>
<p class = "flat-on-wrap">
XCube 2D is a simple game engine that has been developed using SDL 2.0 and C++. My subsystem extends the XCube engine to include an animation playback system which uses CSV files to display and play different animations on screen. On top of this it allows for different sprites to render at any frame rate that is equal to or lower than the frame rate of the game screen and stabilises these animations to create a smooth experience.
<br/>
Each animation that is created by the user will need to have a specific CSV file which states all the necessary details of the animation in question. A CSV file is used within the subsystem to allow the user to manipulate their animations without changing the subsystem itself. It also allows for animation detail data to be easily changed when debugging an issue. The CSV file for each animation must contain the following data:
</p>
<!-- PREVIEW HERE IN CARDS-->
<ol class = "card-list">
<!-- Okido Interactive E-books-->
<li class = "card">
<div class = "card-content">
<ol>
<li>Animation Name.</li>
<li>Frame Rate.</li>
<li>Playback Time.</li>
<li>Image Location.</li>
<li>Number of sprites within each row and column.</li>
<li>JSON file location, if needed.</li>
<li>Sprite width and height.</li>
<li>Scale width and height.</li>
<li>Which way to flip the animation, if needed.</li>
<li>Whether the animation is to be looped.</li>
<li>All keyframes.</li>
</ol>
</div>
</li>
<li class = "card">
<div class = "card-content">
<div class="video-container">
<iframe width="560" height="315" src=https://www.youtube.com/embed/tPABEFc4tds allowfullscreen></iframe>
</div>
</div>
</li>
</ol>
<div class = "flat-on-wrap">
<p>
Within this project, I further learned about SDL and C++ as the system encouraged me to learn about more specific features of SDL and C++, such as the difference between source and destination rects and the best ways to use both. It also helped to solidify my understanding of references and pointers. On top of this I gained a strong technical understanding of how animation is achieved within game engines as well as the many different ways these problems can be tackled even when creating simple animations and features.
</p>
</div>
<a href="https://github.com/lynxbutton/CI517-Engine-Fundamentals" target="_blank" rel="noopener noreferrer"><img class = "widget" src="assets/images/CI517-Engine-Fundamentals.png" width="460px"></a>
<div class = "bibliography">
<small>
<h4>3rd party assets used:</h4>
<ul>
<li>Awesomeduck (2019) Available at: <a href = "https://opengameart.org/content/racing-car-0" target="_blank" rel="noopener noreferrer">https://opengameart.org/content/racing-car-0</a> (Used for: Sprites)</li>
<li>Kenney (2015) Available at: <a href = "https://opengameart.org/content/racing-pack" target="_blank" rel="noopener noreferrer">https://opengameart.org/content/racing-pack</a> (Used for: Sprites)</li>
<li>Praew_p_1985814285 (No Date) Available at: <a href = "https://www.vecteezy.com/vector-art/1343818-green-lawn-grass-texture" target="_blank" rel="noopener noreferrer">https://www.vecteezy.com/vector-art/1343818-green-lawn-grass-texture</a> (Used for: Sprites)</li>
<li>Spyros Zevelakis (2020) Available at: <a href = "https://www.fontsquirrel.com/fonts/alatsi" target="_blank" rel="noopener noreferrer">https://www.fontsquirrel.com/fonts/alatsi</a> (Used for: Font)</li>
<li>Joseph Sardin (No Date) Available at: <a href = "https://bigsoundbank.com/detail-1286-car-on-a-road.html" target="_blank" rel="noopener noreferrer">https://bigsoundbank.com/detail-1286-car-on-a-road.html</a> (Used for: Sound Effects)</li>
<li>Mixkit (No Date) Available at: <a href = "https://mixkit.co/free-sound-effects/car/" target="_blank" rel="noopener noreferrer">https://mixkit.co/free-sound-effects/car/</a> (Used for: Sound Effects)</li>
<li>Shane Ivers (2019) Available at: <a href = "https://www.silvermansound.com/free-music/very-superbeep" target="_blank" rel="noopener noreferrer">https://www.silvermansound.com/free-music/very-superbeep</a> (Used for: Music)</li>
</ul>
</small>
</div>
</main>
<aside>
<h4>Contact me!</h4>
<ul>
<li><a href = mailto:[email protected]><img src = "assets/images/email_542689.png"alt = "Email"/></a></li>
<li><a href = "https://www.linkedin.com/in/lynx-button" target="_blank" rel="noopener noreferrer"><img src = "assets/images/linkedin_1384088.png" alt = "LinkedIn"/></a></li>
</ul>
</aside>
<footer>
<small>Copyright © 2024 by Lynx Button | All images, logos and names are used with permission</small>
</footer>
</div>
</body>
</html>