Coding Feature.

[Unity 3D] 3D 퐁 만들기 #6 네온 효과 위한 Material 제작, Post Processing, 스파크 효과(파티클 시스템) 구현 본문

Toy Project/MICRO-PONG [Unity3D]

[Unity 3D] 3D 퐁 만들기 #6 네온 효과 위한 Material 제작, Post Processing, 스파크 효과(파티클 시스템) 구현

codingfeature 2024. 1. 20. 14:19

먼저 벽, 공, 플레이어 게임 오브젝트의 Material을 바꾸어서 네온 테마에 맞게 꾸며보겠습니다.

 

아래 영상이 많은 도움이 되었습니다.

https://youtu.be/Nd1pmR1afGk?si=mxR7ma8T4X6KgBWm

 

 

먼저 그림판으로 간단하게 가운데가 빈 흰색 네모를 그렸습니다.

 

위 텍스쳐에서 흰색 부분은 나중에 Material의 emission Color 부분에 삽입하면 포스트 프로세싱의 Bloom 효과에서 밝게 빛나게 됩니다.

 

이외에도 전체가 흰색인 네모도 생성했습니다.

 

그리고 Material을 유니티에서 새로 생성한 뒤에 그림을 Albedo와 emission Color에 삽입하였습니다.

 

이때 Rendering Mode를 Fade로 설정해서 제가 흰색으로 채색하지 않은 부분은 투명하게 보이도록 했습니다.

 

그리고 emission의 color를 파란색으로 수정하여 푸른 빛을 띄도록 했습니다.

 

그 다음, 벽에 위 Material을 입혔습니다.

 

 

위와 비슷한 과정으로 공, 공의 트레일, 플레이어에도 각 스타일에 맞는 Material을 입혔습니다.

 

단 공과 공의 트레일에서는 전체가 흰색인 그림을 사용해서 비어있는 공간 없이 전체가 빛이 나도록 했습니다.

 

 

그 다음 포스트 프로세싱을 설정했습니다.

포스트 프로세싱은 아래 영상을 참고하면 좋습니다!

https://youtu.be/-RBwPD6NNms?si=cuGs729LQVaN0XhX

 

 

위의 Bloom 효과로 앞서 만든 Material의 emission 부분이 빛나도록 해주었고, Vignette는 화면 가장자리 부분을 어둡게 해주어서 입체감을 높혔습니다. 그리고 Grain 효과로 화면에 잡티가 조금 생기게 해주었고 모션 블러, Chromatic Aberration으로 게임 몰입감을 높혔습니다.

 

추가로 Ball에는 Point Light를 추가해서 벽에 반사광이 조금 비치도록 했습니다.

 

 

그 다음 공이 벽에 부딪힐 때 스파크 효과를 구현하기 위해 Particle System을 이용했습니다.

이 부분은 아래 영상이 많은 도움이 되었습니다!

https://youtu.be/zC7krqM-npo?si=2w6YLXx4TMHUhx0P

 

파티클 시스템의 Looping을 없애고, Duration을 0.2초로 해서 짧게 나타나도록 했습니다.

그리고 Start Lifetime을 0.3초에서 0.5초 사이로 조절했습니다.

Gravity Modifier를 1로 설정해서 중력을 추가하였습니다.

그 다음 Stop Action을 Destroy로 설정해서 한번 파티클 시스템이 플레이되고 나면 그 시스템이 제거되도록 했습니다.

 

그리고 Size over Lifetime을 다음과 같이 설정해서 나타날때 커지다가 다시 사라질때 감소하도록 했습니다.

 

 

collision을 추가하고 Type을 World로 해서 벽과 부딪힐때 통과하지 않도록 했습니다.

 

그리고 파티클의 Material도 위에서 벽, 공과 비슷하게 따로 emission을 위한 material을 같은 방식으로 만들고 추가했습니다. 이때 Emission의 color를 주황색으로 설정했습니다.

 

위와 같이 Particle System을 만든 뒤에 이를 관리하기 위한 Particle Manager 스크립트를 작성했습니다.

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

public class ParticleManager : MonoBehaviour
{
    private static ParticleManager instance;

    public ParticleSystem Spark;

    public static ParticleManager Instance
    {
        get
        {
            return instance;
        }
    }

    private void Awake()
    {
        if (instance)
        {
            Destroy(instance);
            return;
        }

        instance = this;
        DontDestroyOnLoad(this.gameObject);
    }

    public void SetSparkPosition(Vector3 vec)
    {
        Spark.transform.position = vec;
    }
    public void PlaySpark()
    {
        ParticleSystem newSpark = Instantiate(Spark, Spark.transform.position, Spark.transform.rotation);
        newSpark.Play();
    }
}

 

SetSparkPosition으로 Spark 파티클 시스템의 위치를 설정하고, PlaySpark 함수를 통해 새로운 Spark를 Instantiate한 뒤에 플레이하도록 했습니다. 이미 앞서 Stop Action을 Destroy로 설정했기 때문에 한 번 플레이되면 알아서 제거됩니다. 그래서 따로 없애는 코드는 작성하지 않았습니다!

 

그리고 벽에 부딪힐 때 위 함수를 사용해서 스파크 효과를 내기 위해 공 스크립트에 다음과 같이 코드를 추가했습니다.

    private void OnCollisionEnter(Collision collision)
    {
        GameObject go = collision.gameObject;
        if (go.CompareTag("Wall") || go.CompareTag("Player")) // 부딪힌 면에 대한 방향 변환
        {
..
            if (go.CompareTag("Wall"))
            {
                ParticleManager.Instance.SetSparkPosition(transform.position);
                ParticleManager.Instance.PlaySpark();
            }
        }
..
    }

 

파티클 매니저를 통해서 먼저 부딪힐 때 위치를 설정하고 PlaySpark 함수를 호출하였습니다.

 

 

 

 

다음에는 카메라와 관련된 스크립트를 만들어보겠습니다!