3 MB - PROJECT: Hayasa

T EAM : A.R.E.S.
P ROJECT R EPORT
EPITA - P ROMO 2020
PROJECT: Hayasa
March 2016
Tawfiq JAFFAR jaffar_t
Timothey H ORIOT horiot_t
Antoine D UJARDIN dujard_f
Contents
1
Introduction
2
2
Team A.R.E.S.
2.1 Group’s Genesis . . . . . . . . . . . .
2.2 Members . . . . . . . . . . . . . . .
2.2.1 Tawfiq ‘SenVad’ Jaffar . . . .
2.2.2 Timothey ‘Aydenn’ Horiot . .
2.2.3 Antoine ‘antoine42’ Dujardin
2.3 Why PROJECT: H AYASA ? . . . . .
.
.
.
.
.
.
3
3
4
4
5
5
6
.
.
.
.
.
.
7
7
7
8
9
10
13
.
.
.
.
17
17
17
18
18
3
4
5
.
.
.
.
.
.
.
.
.
.
.
.
PROJECT: H AYASA
3.1 The Cars . . . . . . . . . . . . . . . . . .
3.1.1 The Ferrari . . . . . . . . . . . .
3.1.2 The Bugatti and the Aston Martin
3.2 Tracks . . . . . . . . . . . . . . . . . . .
3.3 Artistic Direction . . . . . . . . . . . . .
3.4 The Cars’ behavior on the track . . . . . .
The Website
4.1 Tools . . . . . . . . .
4.2 Presentation . . . . .
4.3 Difficulties . . . . .
4.4 What we have learned
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
Conclusion
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
19
1
Chapter 1
Introduction
In this report we will talk about what has been done so far. As we have described in
the Book of Specifications, we wanted to develop a game that synthesizes the right
balance between an Arcade game and reality. The behavior of the cars, the tracks,
the weather and the components of a car game should replicate reality.
First of all, ‘Hayasa’ in PROJECT: H AYASA means "Speed" in Japanese. As
for this first presentation we have chosen to focus on the 3D modelling and the
visual identity of the game.
2
Chapter 2
Team A.R.E.S.
2.1
Group’s Genesis
In the first semester, last year’s groups were presented to us, and we started to
gather some ideas. Tawfiq wanted to make a video game which involves means of
transports (flight simulation, racing simulation. . . ). When he approached Timothey
with the idea, it was decided that the game we were going to develop was going
to be a racing simulation which conveys real life effects – how taking a wide angle
corner affects time, for example – and which should be fairly easy to adapt to, for
inexperienced player. They then approached Antoine and Matthieu who seemed
highly interested and motivated to work their way up towards a common goal.
We unfortunately lost a Member, Matthieu, who decided to leave EPITA.
3
2.2. MEMBERS
2.2
2.2.1
CHAPTER 2. TEAM A.R.E.S.
Members
Tawfiq ‘SenVad’ Jaffar
“Since we were told that we were going to have to work on a project during the first
semester, I’ve been thinking and writing down ideas of projects and what each of
them would have to contain.
In my final year of high school, I have worked on a encrypted instant messaging client programmed in Python. It was very interesting to have an assignment
and deadlines as I consider that it’ll help us to get used to the professional world.
However, to keep my work concise, I voluntarily chose to work on my own on that
project as I thought that no matter how hard I try to expose my ideas and how clear
the explanations are, in the end the other member(s) will never have the same idea
in mind.
I think it’s very interesting to work on a larger scale project as this one. Working
with T EAM : A.R.E.S. will teach me to “play well with others” and it will train me
to allow them “putting their hands in my cookie jar”. I have no doubt that we will
be able to develop a video game of quality. Indeed, I think that we have chosen
our members according to the individual needs of the game: graphics, network,
gameplay, 3D rendering etc.
And in the end, what is learning without application of what’s being learned?
PROJECT: H AYASA is a fun project to work on that is going to benefit everyone
of us, enlarge our field of expertise and give us experience.”
4
2.2. MEMBERS
2.2.2
CHAPTER 2. TEAM A.R.E.S.
Timothey ‘Aydenn’ Horiot
“Last year, I worked on a small project in Python, consisting in a really hard maze
(that we created). This introduced me to game creation.
I think I’ll acquire a lot more of experience, as this project will be much bigger.
I also really liked working on the game’s marketing : how to sell it ? how to enhance
the player experience with exterior parameters ?
The things I learned in this Python project will be used in this one. I really like
working on 3D rendering, sounds and communication, and I think a racing game
offers a lot of possibilities. My goal is to improve the game by adding important
features.”
2.2.3
Antoine ‘antoine42’ Dujardin
“I have already worked on a project last year, with another student. It was a very
basic side-scroller written in Python, without much gameplay. I learned a lot during
this project, but mistakes were made. We didn’t focus enough on the main functionalities, and we spent too much time doing assets and side features. I hope that, with
this group, we can avoid doing these mistakes, that we can all learn new concepts
and acquire new skills.
I find PROJECT: H AYASA very interesting because it involves competences
that I’ve always wanted to acquire. For example, we will have to make a website.
We will also implement a multiplayer mode, involving networking, which I would
love to learn about.”
5
2.3. WHY PROJECT: HAYASA ?
2.3
CHAPTER 2. TEAM A.R.E.S.
Why PROJECT: H AYASA ?
We have chosen to develop a racing simulator that mixes reality with an arcade
game. Unlike well known racing games, we wanted to make PROJECT: H AYASA
a game that gives the player the opportunity to take control of a vehicle and forcing
them to take corners by hitting every apexes to improve their own time record – for
example – The game should give the driver an enhanced experience and provide
him the ease of use an Arcade game should provide, should it be for a beginner or
for advanced players.
To end up with a quality product, not only must we be creative individually but
also as a group and be on the same wavelength in order to avoid ending up with
a “fractioned” project. Using all our knowledge and increasing it will be essential
for the group to be fully synchronized for the presentations. Let me illustrate this
idea – that we will be trying to avoid of course – with an example: let’s say that one
member of the group chose to do the game’s dialog boxes and menus. Wouldn’t you
find it weird if the screen following that very menu is completely different regarding
the color theme or soundtrack? Of course, that is very visual. That is why we’ll do
our best to keep everything coherent and synchronized for the ease of use and of
adaptation.
6
Chapter 3
PROJECT: H AYASA
3.1
The Cars
As stated in the Book of Specifications, we used three differents models.
3.1.1
The Ferrari
The Ferrari was the first car on which we have worked on. We have designed
the object on Cinema 4D and it’s the only car we’ve implemented in the game
yet. Only one color is available: red, but we hope to have more colors soon. After
importing the model in Unity, we created WheelColliders in order for our car
control script to work fine. The Ferrari is able to go in all the directions. There is,
as previously stated, the Anti Roll Bar, increasing the realism of the car.
Figure 3.1: The Ferrari
In addition, the two front wheels can turn, following the user’s choices.
7
3.1. THE CARS
3.1.2
CHAPTER 3. PROJECT: HAYASA
The Bugatti and the Aston Martin
The Bugatti Veyron and the Aston Martin Vantage are not yet implemented in the
game but the 2 models are complete:
Figure 3.2: The Bugatti Veryon
Figure 3.3: The Aston Martin Vantage
8
3.2. TRACKS
3.2
CHAPTER 3. PROJECT: HAYASA
Tracks
We decided to create four tracks, all of them are different, and give the player a
variety of landscapes to explore:
• Mizu to Mori : it’s the only track completely finished and playable. It’s
situated in a vast terrain, with a big forest and a few mountains. You can
drive your car right next to a lake, admiring the sun’s reflects on the water,
thanks to a skybox and a real-time flare:
Figure 3.4: Mizu To Mori
The next three tracks haven’t been created yet.
• Hoka no Doro : a road that seems to be infinite.
• Torakku : another track (maybe a snowy or rainy environment)
• Arina : not a track, but a closed arena (sand, probably in a desert, a lot of dust)
9
3.3. ARTISTIC DIRECTION
3.3
CHAPTER 3. PROJECT: HAYASA
Artistic Direction
In this section, we will explain the choices we made to create a proper visual
identity for our game and our team, as we think it’s a very important part of a game.
Let’s start with T EAM : A.R.E.S. visual identity. As we can see in the game intro,
we chose Orange as a main color. We used a variety of professional softwares like
Adobe Photoshop and Illustrator, Cinema 4D and Sony Vegas. We put a lot of effort
in the creation of this type of video, because we think that they could enhance the
player experience. Here are a few images, showing the artistic progression of that
T EAM : A.R.E.S. logo:
Figure 3.5: The Making-Of T EAM : A.R.E.S. ’s logo
Let’s continue with the game visual identity, which is based on three colors : red,
black and white. We can see those colors in the introduction video, played when
the player launches the game. This video is also a presentation of the 3 members of
the group, one can read our names, next to 3D models. The fonts used on the logo
of PROJECT: H AYASA are different for a special reason : we wanted to contrast
the modernity of “PROJECT” with the old aspect of “hayasa”, the Japanese word,
along with the red on the Kanji, creating more life in this logo, using colors. We
also used particles and color corrections, in order to have a better render for the final
video. Here are some images of the making of this video:
10
3.3. ARTISTIC DIRECTION
CHAPTER 3. PROJECT: HAYASA
Figure 3.6: The Making-Of PROJECT: H AYASA ’s introduction clip
Here is the code used to import the video as a movie texture :
public class Intro : MonoBehaviour
{
public MovieTexture movie;
private AudioSource audio;
void Start()
{
GetComponent<RawImage>().texture = movie as MovieTexture;
audio = GetComponent<AudioSource>();
audio.clip = movie.audioClip;
movie.Play();
audio.Play();
movie.loop = true;
}
We also took time to choose the perfect music : a mix between vocals and a
strings quartet. This music fits perfectly with the ambience we wanted to create :
soft, elegant, simple.
11
3.3. ARTISTIC DIRECTION
CHAPTER 3. PROJECT: HAYASA
This visual identity also continues within the menus. Indeed, we used the same
colors, but not in the same priority order : white is much more important. We didn’t
want the game to look as dark as the introduction, but clear and clean. We made
animations for the buttons, and sound is played when the players hovers them. The
music of the menu is a duo piano and cello, in the same style as the introduction
music, but without voices, which is perfect for a main menu. Here is a picture of
the first menu:
Figure 3.7: The Making-Of PROJECT: H AYASA ’s Menu
12
3.4. THE CARS’ BEHAVIOR ON THE TRACK
3.4
CHAPTER 3. PROJECT: HAYASA
The Cars’ behavior on the track
PROJECT: H AYASA is a game solely based on realism. How a real racing car
behaves on a real racing track is how the in-game car should behave on the ingame track. Not only should we think like video game developers but also like car
constructors.
To make sure it replicates reality we had to consider several points and make sure
we mirror real constraints. The biggest issue when driving the car around the track
was to make it stay on the track. Indeed, at first the car could’ve been considered
as a polygon, a cube, under which we have installed wheels. If one does that in real
life, the vehicle would surely go ballistic when reaching a certain speed as great
speed is accompanied by momentum, and likely to cause damage and make the car
roll and twist.
Our solution is to, once again, copy reality. What would a car constructor do to
stabilize a wild car? The most recurring solution was to add antiroll bars. These are
the keys to make a car stable. In reality they are part of the car’s suspension, usually
attached the rear wheels of a vehicle.
Figure 3.8: Antiroll Bars
It provides better weight distribution, better compression and thus better handling
when driving on irregular . It allows the right axis to follow the left axis and viceversa when driving on a rubble road. It also regulates the amount of the oversteer
and understeer when cornering. It of course, it prevents barrel rolls. The antiroll bar
is usually stiff, so it enables the opposite wheel to pry up and reach the bottom of
the car more or less easily depending on the stiffness of the suspensions.
13
3.4. THE CARS’ BEHAVIOR ON THE TRACK
CHAPTER 3. PROJECT: HAYASA
In the game, we’ve added a script that simulates that phenomenon. Firstly, it
detects when pressure is applied to the wheel we want to equalize with the opposite
one.
public float antiRoll = 10000.0f;
We use a boolean to detect collision between the wheel and rubble or irregularity
on the road:
Figure 3.9: Activate the AntiRoll Bar script
bool groundedFLHit = FrontLeftWheelCollider.GetGroundHit(out
FrontWheelHit); \\returns a bool
It computes the ratio between the the suspension to which the wheel that was
hit is attached to and the substraction of the opposite of the y axis along the
WheelCollider’s is set and the wheel’s radius. By doing so, we ensure the correct amount of correction that has to be brought to the wheel in order to prevent it
from going ballistic.
if (groundedFLHit) /*This checks if the bool is true, and applies the
following if it is*/
travelFL =
(-FrontLeftWheelCollider.transform.InverseTransformPoint
(FrontWheelHit.point).y - FrontLeftWheelCollider.radius)
/ FrontLeftWheelCollider.suspensionDistance;
In order to make the player feel the realism of the controls when playing the game,
we had to implement components of a fluid drive. For example and for simplicity’s
sake, let’s say you are driving your Ferrari around the track and decide to drive
relatively fast. When you encounter a corner, if the corner’s tight enough, you will
not be able to steer your car completely into the corner. That is understeer.
To Emulate that phenomenon, we have added three variables in our controls
script:
Figure 3.10: understeer
public float steerAngle = 40.0f;
public float highspeedsteerAngle = 10.0f;
14
3.4. THE CARS’ BEHAVIOR ON THE TRACK
CHAPTER 3. PROJECT: HAYASA
public float highspeedsteerAngleAtspeed = 100.0f;
We are planning to add more variables to control the amount of oversteer as well.
To Accelerate and Decelerate, we have set arbitrary torque values that are used
in the algorithms that compute the amount of force that has to be applied to the car,
which has to stay coherent with the speed of the car. The harder part was to find
a way to decelerate the car, the exact same way it accelerates. To do that, we have
added a method in the CarControl.cs file which computes new breakTorque values
as a function of the motorInput1 values:
1 The
amount of gaz injected in the engine, i.e. the Up Arrow key
15
3.4. THE CARS’ BEHAVIOR ON THE TRACK
CHAPTER 3. PROJECT: HAYASA
Figure 3.11: breakTorque
if(motorInput < 0 && !reversing) //when the opposite key is activated
(down arrow) and when the car is not reversing
{
FrontLeftWheelCollider.brakeTorque = (brake) *
(Mathf.Abs(motorInput));
FrontRightWheelCollider.brakeTorque = (brake) *
(Mathf.Abs(motorInput));
RearLeftWheelCollider.brakeTorque = (brake) *
(Mathf.Abs(motorInput / 2f));
RearRightWheelCollider.brakeTorque = (brake) *
(Mathf.Abs(motorInput / 2f));
}
else //the brakes are not activated
{
RearLeftWheelCollider.brakeTorque = 0;
RearRightWheelCollider.brakeTorque = 0;
FrontLeftWheelCollider.brakeTorque = 0;
FrontRightWheelCollider.brakeTorque = 0;
}
To make the driving experience more intuitive, we will include a method that
manages the differential mechanism.
16
Chapter 4
The Website
You can access the website at http://projecthayasa.com
4.1
Tools
The website uses PHP, MySQL and JavaScript.
At first, we have developed the website locally using WAMP/LAMP/MAMP. It
allowed us to preview the website before committing the changes.
4.2
Presentation
The front page is the showcase of PROJECT: H AYASA . It presents our game,
our team, and give the recent news. It will be updated as we make progress on the
game. You can access to all the other parts of our website from it.
The “Roadmap” page presents all the important upcoming events, as the projected
progress on PROJECT: H AYASA as well as who is working on which part. You
can also download the reports, the book of specification, and the game on dedicated
pages. In our team’s page, we present T EAM : A.R.E.S. and ourselves. You can
send an email to the different members of the team in the contact page. Finally, the
“Thanks” page links all the tools we have used.
Some parts of the website are not done yet. The high scores section will only be
available when the scoring system of the game will be done. It will have to register
the scores and the name of the users, as well as the date. The backend will also
have to be done, to store all this data in a database and display them in a nice, sorted
table.
17
4.3. DIFFICULTIES
4.3
CHAPTER 4. THE WEBSITE
Difficulties
We had some trouble while learning JavaScript. When we did the dropdown
menu in the header, we have experienced a few bugs:
We found out that CSS stored the size of elements as a decimal, which was
approximated to the nearest even number. However, the JavaScript function that
retrieved the size of elements took the decimal value and removed the fractional
part. This caused a difference of 1 pixel between the width of the button and the
rest of the menu in some cases. We have tried to set the value of the menu as a
decimal, but is was rounded to the nearest even number. This is when we figured
out the approximating method used by CSS, and I implemented the good sorting
method in JavaScript:
This bug was very frustrating to fix, as it took me almost half an hour of searching
on forums and trying different methods.
4.4
What we have learned
I learned a lot while making this website. I didn’t know much about how to build
websites. I learned everything while making it. The tutorials on openclassroom.
com were very helpful for that.
18
Chapter 5
Conclusion
From the moment we’ve submitted our Book of Specifications until now, we have
encountered a lot of difficulties. But thanks to our perseverance we have found the
solution to our problems and we are able, today, to present a complex game, yet
seemingly simple.
The main difficulty was to re-balance the task distribution as we have lost a member of T EAM : A.R.E.S. . Us three other members remain determined and work as
a group towards a common goal: deliver the game that resembles reality, which is
easy to adapt to. Though this first presentation is mainly focused on the 3D modeling and the car’s on-track behavior, being part of the visual identity of the game,
we have already started to work to give the best second-presentation we can.
19
List of Figures
3.1
3.2
3.3
3.4
3.5
3.6
3.7
3.8
3.9
3.10
3.11
The Ferrari . . . . . . . . . . . . . . . . . . . . . . . .
The Bugatti Veryon . . . . . . . . . . . . . . . . . . . .
The Aston Martin Vantage . . . . . . . . . . . . . . . .
Mizu To Mori . . . . . . . . . . . . . . . . . . . . . . .
The Making-Of T EAM : A.R.E.S. ’s logo . . . . . . . .
The Making-Of PROJECT: H AYASA ’s introduction clip
The Making-Of PROJECT: H AYASA ’s Menu . . . . .
Antiroll Bars . . . . . . . . . . . . . . . . . . . . . . .
Activate the AntiRoll Bar script . . . . . . . . . . . . .
understeer . . . . . . . . . . . . . . . . . . . . . . . . .
breakTorque . . . . . . . . . . . . . . . . . . . . . . . .
20
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
7
8
8
9
10
11
12
13
14
14
16
PROJECT: H AYASA
“Show me how you drive, I will show you who you are.”