Interactive Media

Mohamed Al-Kaf - Media Explorations

Category: Unity

Written by: Mohamed Al-Kaf | Posted on: | Category:

The Issue I had was screen size resolution with aspect ration. As Unity gives very fluid options. It was hard to get anchored position of the UI elements Such and the ready and Standby as they where separate elements from the UI. On the first try, I made the build the would be int he wrong position because the Build game would use the full screen so it would be in a different position from when i was testing within Unity.

Screenshot 2019-05-01 at 11.41.22 pm.png

Screenshot 2019-05-01 at 11.41.44 pm.png

Written by: Mohamed Al-Kaf | Posted on: | Category:

As this was an important part of the interaction for my game i made this HUD image inside photoshop from scratch. HUD.png

The splash screens was inspired by the start of Keep talking and nobody explodes.

Screenshot 2019-05-02 at 12.08.47 am.png

Screenshot 2019-05-02 at 12.08.53 am.png

Screenshot 2019-05-02 at 12.09.00 am.png

After th splash screen i felt the pilot would be waiting for instructions from teh operator i wanted to add an animation to this screen. As there is a lot of information to go through in the Intel-document but the Operator. However due to lack of time and i still have alot of finish i decided to use stock video to be placed in the background. Is not idea choice but i think it helps to get the message across.

2019-05-02 12.09.28 am.gif

2019-05-02 12.09.46 am.gif

Written by: Mohamed Al-Kaf | Posted on: | Category:

Creating a menu screen using UI elements texts and buttons. when adding Buttons an event system is added.

Screenshot 2019-05-01 at 11.09.17 pm.png

I also added a script to an empty game object called the main menu.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.SceneManagement;

public class MainMenu : MonoBehaviour
{
public void PlayGame()
{
SceneManager.LoadScene(SceneManager.GetActiveScene().buildIndex + 1);
}
public void QuitGame()
{
Debug.Log("Quit");
Application.Quit();
}
}

This create two public functions. So any time that are called the code will run. For example in the button inspector settings click option to the Script and function and this makes the button call that code.

Screenshot 2019-05-01 at 11.21.14 pm.png

Written by: Mohamed Al-Kaf | Posted on: | Category:

The Path creating and following method i was using was starting to get frustrating. Luckily i searching the asset store within unity and found another free option.

Screenshot 2019-05-01 at 10.35.44 pm.png

using UnityEngine;

namespace PathCreation.Examples
{
       public class PathFollower : MonoBehaviour
    {
        public PathCreator pathCreator;
        public EndOfPathInstruction endOfPathInstruction;
        public float speed = 5;
        float distanceTravelled;

        void Start() {
            if (pathCreator != null)
            {
                   pathCreator.pathUpdated += OnPathChanged;
            }
        }

        void Update()
        {
            if (pathCreator != null)
            {
                distanceTravelled += speed * Time.deltaTime;
                transform.position = pathCreator.path.GetPointAtDistance(distanceTravelled, endOfPathInstruction);
                transform.rotation = pathCreator.path.GetRotationAtDistance(distanceTravelled, endOfPathInstruction);
            }
        }
        void OnPathChanged() {
            distanceTravelled = pathCreator.path.GetClosestDistanceAlongPath(transform.position);
        }
    }
}

Creating the nodes for the path are self contained and the path can be create as curves. And when linking the car game object it worked smoothly. The the Z access doesnt change.

Screenshot 2019-05-01 at 10.41.07 pm.png

All the paths of the one to follow and the scenery cars.

Screenshot 2019-05-01 at 10.33.08 pm.png

Written by: Mohamed Al-Kaf | Posted on: | Category:

Adding static cars to the scene. Screenshot 2019-05-01 at 10.25.03 pm.png

Ending level using Collider and trigger in unity. I placed an empty game object at the end location of the car path. so when the three objects intersect and a button is pressed it would change the scene.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.SceneManagement;

public class MoveScene2 : MonoBehaviour
{
    private bool ViewAtEnd;
    private void OnTriggerEnter2D(Collider2D other)
    {
        if (other.gameObject.name == "Circle")
        {
            ViewAtEnd = true;
            Debug.Log("ViewerReady");
        }
   }
    private void Update()
    {
        if (ViewAtEnd && Input.GetKeyDown(KeyCode.Space))
        {
            Debug.Log("change");
            SceneManager.LoadScene(SceneManager.GetActiveScene().buildIndex + 1);
        }
    }
    private void OnTriggerExit2D(Collider2D other)
    {
            ViewAtEnd = false;
        }
    }
Written by: Mohamed Al-Kaf | Posted on: | Category:

I had to learn how to produce tile maps assets for unity

i had to first create a PNG in Photoshop with all the options. For example here is tile maps for the Backgound Grass.

Ground.png

setting how large each tiles where drawn, unity will slice them and make them ready to be used and draw aback ground as a tile map.

Screenshot 2019-05-01 at 9.54.18 pm.png

Road converted to Tile maps, They would be paced on a layer on top of the ground so are no empty squares. For the background, I used a colour on the main camera instead of drawing in all the ground.

Screenshot 2019-05-01 at 9.56.29 pm.png

The Building converted to Tiles Maps. Screenshot 2019-05-01 at 9.56.09 pm.png

Written by: Mohamed Al-Kaf | Posted on: | Category:

I found a script on-line. There are two script one place on an empty game object that will draw the path that is desired. The other SCript placed on a game object that will follow the path.

Each path section was a Empty game object. The path was not curved, so to make more Verticies would create a path that looked curved.

Screenshot 2019-04-13 at 15.29.19.png

The problem i am having with this path creation option is the Z axis is also being manipulated i am not sure why. it is possible because of the way the script is written. So the car randomly flips on the z-axis. Even though I have chosen I 2D option in unity. Luckly the rotation direction is correct. so the car follows the path always facing the path and turn when the path changes.

The script used to create the path, using array to add the the to hold all the path points, that are added to the script by placing an empty game object on the scene and then linking it to the script, Adding the total amount of path point in the inspector and then adding the path points manually :

public class EditorPathScript : MonoBehaviour
{

    public Color rayColor = Color.white;
    public List<Transform> path_objs = new List<Transform>();
    Transform[] theArray;

void OnDrawGizmos()
    {
        Gizmos.color = rayColor;
        theArray = GetComponentsInChildren<Transform> ();
        path_objs.Clear ();

        foreach (Transform path_obj in theArray)
        {
            if(path_obj != this.transform)
            {
                path_objs.Add(path_obj);
            }
        for (int i = 0; i < path_objs.Count; i++)
            {
                Vector3 position = path_objs [i].position;
            if (i > 0)
                {
                    Vector3 previous = path_objs[i - 1].position;
                    Gizmos.DrawLine(previous, position);
                    Gizmos.DrawWireSphere(position, 0.3f);                }
            }
        }
    }
}

once the path is set up, attaching another script that will allow the game object. assets to follow the patg. This links the game objcet to the path. Here Are veriables set out, so i can manueally change in the inspector, the change of roation speed, to match the direction of travel when turning, and the speed of travelling on the path. The script also calls the array used in the previous script to know how to follow that path. calculating between the point and tansforming the object between them at the desired speed.

public class MoveOnPath : MonoBehaviour
{
    public EditorPathScript PathToFollow;

    public int CurrentWayPointID = 0;
    public float speed;
    private float reachDistance = .2f; // reach distance smooth movement between hard lines to make curve
    public float rotationSpeed = 5.0f;
    public string pathName;
    //disable loop 
    public GameObject CarFollow;

    Vector3 last_pos;
    Vector3 current_pos;

    void Start()
    {
        // PathToFollow = GameObject.Find(pathName).GetComponent<EditorPathScript>();
        last_pos = transform.position;
    }

    // Update is called once per frame
    void Update()
    {

        float distance = Vector3.Distance(PathToFollow.path_objs[CurrentWayPointID].position, transform.position);
        transform.position = Vector3.MoveTowards(transform.position, PathToFollow.path_objs[CurrentWayPointID].position, Time.deltaTime * speed);
        var rotation = Quaternion.LookRotation (PathToFollow.path_objs[CurrentWayPointID].position - transform.position);
        transform.rotation = Quaternion.Slerp (transform.rotation, rotation, Time.deltaTime * rotationSpeed);

    if(distance <= reachDistance)
        {
            CurrentWayPointID++;
        }
    if(CurrentWayPointID >= PathToFollow.path_objs.Count)
        {
            CarFollow.GetComponent<MoveOnPath>().enabled = false; // stop at end of path
            //   CurrentWayPointID = 0;  // to loop path 
        }
    }
}
Written by: Mohamed Al-Kaf | Posted on: | Category:

During the last tutorial with Chris, we had narrowed down my way forward to two steps.

  1. Continue with Adobe Animate even with the slow frame rate and lagging gameplay.

  2. Change the program i am using and move to unity. However, be careful as unity has a larger learning curve.

    • However, I would spend a few days max learning and research about the software, and if it takes too long go back to adobe animate and continue building the game.

On the Unity website, I found the section for detailed tutorials with easy to follow videos. They also include game files that you could follow to build the simple game.

Screenshot 2019-05-01 at 9.42.05 pm.png

I started by Placing a 2d GameObject Circle and adding a player movement script. To add physics to unity i rigidbody compenet needs to be added

Screenshot 2019-05-01 at 10.14.27 pm.png

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class Player : MonoBehaviour {

    public float speed;

    private Rigidbody2D rb;
    private Vector2 moveVelocity;

    void Start(){

        rb = GetComponent<Rigidbody2D>();

    }

    void Update()
    {
        Vector2 moveInput = new Vector2(Input.GetAxis("Horizontal"), Input.GetAxis("Vertical"));
        moveVelocity = moveInput.normalized * speed; 
    }
void FixedUpdate()
    {
        rb.MovePosition(rb.position + moveVelocity * Time.fixedDeltaTime);  
    }
}

When the circle was moving i added a script to the camera to follow the plater, instead of making the Circle GameObject a child of the Camera to add smoother movement and using a script is better.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class CameraFollow : MonoBehaviour
{
    public Transform followObject;
    private Vector3 moveTemp;
    public float offsetY = 0;
    public float offsetX = 0;

    // Start is called before the first frame update
    void Start()
    {
        moveTemp = followObject.transform.position;    
    }

    // Update is called once per frame
    void Update()
    {
        moveTemp = followObject.transform.position;
        moveTemp.y += offsetY;
        moveTemp.x += offsetX;
        moveTemp.z = transform.position.z;
        transform.position = moveTemp;

    }
}