241226

lililllilillll·2024년 12월 26일
Devlog :: Little Etude

개발 일지

목록 보기
32/350

✅ 오늘 한 일

  • Project Etude


📝 배운 것들

🏷️ Unity에서 이미지 깨짐 방지 팁

  1. 이미지 크기(Pixel Dimension)를 맞추기

    • 화면 해상도에 맞춰 이미지 크기를 최소 Full HD(1920x1080) 이상으로 설정하세요.
    • 고해상도(예: 4K) 화면에서 사용할 경우 더 큰 이미지(예: 3840x2160)를 준비하세요.

  2. Unity Import Settings 확인

    • 유니티에서 이미지를 임포트한 후, Inspector에서 다음 항목을 확인하세요:
      • Max Size: 이미지를 압축하거나 크기를 줄이지 않도록 충분히 큰 값을 설정하세요(예: 2048, 4096 등).
      • Compression: 필요에 따라 압축을 None으로 설정하여 화질 손상을 방지합니다.
      • Filter Mode: 이미지를 부드럽게 보이게 하려면 Bilinear 또는 Trilinear를 설정합니다.

  3. 캔버스 배율 확인

    • 배경 이미지를 Canvas나 SpriteRenderer로 사용할 경우, Canvas 크기와 Screen Space 설정을 확인하여 배율이 맞는지 확인하세요.


🎮 Project Etude

리듬 타이밍 맞추기

내 게임에선 박자가 상관 없고 오디오 파일이랑 싱크만 맞추면 되는데? 라는 생각에

    private void CheckMusic()
    {
        if (game_ongoing)
        {
            if (!MainMusic.isPlaying)
            {
                MainMusic.Play();
                lastdspTime = AudioSettings.dspTime;
            }
            else
            {
                dspTimeGap = AudioSettings.dspTime - lastdspTime;
                lastdspTime = AudioSettings.dspTime;
            }
        }
    }
    void Update()
    {
        RaycastFrontAndBack();
        CheckInbox();
        if (isInBox) Judge();
        CheckMusic();
        if (game_ongoing)
            transform.Translate(goingDirection * speed * (float)dspTimeGap);
    }

기존 time.deltaTime 자리에 dspTimeGap 때려박았더니
뭔가 좀 더 싱크가 잘 맞아진 것 같기도 한데

덜덜거리면서 가기 시작한다
아니 그리고 일시정지 시키고 확인해보니까 타이밍 뭔가 안 맞는거 같은데
음원 문제인가

그냥 오프셋 문제였다.
자르고 넣어보니까 거의 완벽하게 맞음.

생각보다 훨씬 간단했다. (이게 이론상 맞는 값이랑 판정 맞겠지?)

덜덜거리는 위치는 정확한 판정 위치로 하고,
보여지는 스프라이트는 보간을 넣어주면 될듯

판정과 보여지는 부분 분리

boundsize 구하던 거는 투명도만 0 때리고 자식에 스프라이트 새로 만든 후에
update 로직에 자식 스프라이트 따라가는 로직 만들기
startdirector에서 player sprite 쓰던거 findcomponentin spriterenderer로 바꾸기

자식에 넣으면 위치를 따라가버리니까 따로 만들어야겠구나
그러면 각도 맞추는 로직도 update에 넣어야됨

show_player.transform.position = Vector3.Lerp(show_player.transform.position, transform.position, Time.deltaTime * 10);

자연스럽게 보이면 보이는 거랑 오차가 너무 많이 나는듯

영상 속 검은 스프라이트가 실제 판정,
파란 스프라이트는 보이는 스프라이트
걍 적당히 여기서 타협하자
오프셋 조절도 있으니까 뭐...
옵션 만들어서 덜덜거려도 정확한 판정 원하는 사람들은 이걸로 쓰세요~ 하면 되지 않을까

생각하면 생각할수록 이상해서 고치긴 해야될듯
일단 나중에.

게임 종료 블럭 만들기

public game_end 변수 만들고
music play하는 if문에 넣어주고
게임 종료 버튼 도착하면 true로 바꾸고
플레이어 스크립트 꺼버리기

게임 종료인지 아닌지는
맵에 마지막 인덱스 저장해놓고
hit_success 할 때마다 마지막 인덱스랑 비교해서
마지막 인덱스면 음악 끄고 스크립트 끄기

아 오프셋 테스트나 맵 에디터에선 맵을 무조건 불러오는게 아니라서 좀 곤란하네

getcomponent 쓰기 싫었는데 써야할듯
next block == null 확인

                // 엔딩 블럭이면 이동 종료
                if (missionBlockScript.GetComponent<NoteBlock>().nextNoteBlock == null)
                {
                    Debug.Log("Game Clear");
                    this.enabled = false;
                }

닿으면 게임 종료되는거 확인

판정 기준 정하기

    private void DistanceJudge()
    {
        float distance = Vector2.Distance(missionBlockCollider.bounds.center, transform.position);
        // Debug.Log("Distance : " + distance);
        switch (distance)
        {
            case float d when d < 0.02f:
                Debug.Log("Perfect");
                if (debugText != null) debugText.text = "Perfect";
                break;
            case float d when d < 0.06f:
                Debug.Log("Nice");
                if (debugText != null) debugText.text = "Nice";
                break;
            case float d when d < 0.1f:
                Debug.Log("Good");
                if (debugText != null) debugText.text = "Good";
                break;
            default:
                Debug.Log("Bad");
                if (debugText != null) debugText.text = "Bad";
                break;
        }
    }

일단 만들고 테스트 해보긴 했는데 뭔가 좀 애매한 느낌
원래 판정선 이동이 덜덜거리는 것도 문제고
그거 보간하려고 보여주기용 넣은 것도 문제고

일단 이것도 구현은 해놨으니까 넘어가기

눌렀을 때 이펙트 넣기

밝아지는 이펙트

애먹였던 포스트 프로세싱은 써보니까 특정 오브젝트에만 동적으로 써먹을 수는 없는 거였고
셰이더 그래프를 굳이 쓸 생각은 안 들고

저번에 검토했던 glow sprite 뒤집어 씌우기는 뭔가 느낌이 애매
light도 추가해봤더니 갑자기 화면 까매져서 굳이. 그리고 블럭에 전부 다 켜버리면 성능 이슈 생길 것 같음.

    public void DisableCollider()
    {
        GetComponentInChildren<BoxCollider>().enabled = false;

        // 자식에 있는 모든 스프라이트 렌더러를 찾아서 만약 검은색이라면 alpha 값 180으로 설정
        SpriteRenderer[] spriteRenderers = GetComponentsInChildren<SpriteRenderer>();
        foreach (SpriteRenderer spriteRenderer in spriteRenderers)
        {
            Color color = spriteRenderer.color;
            if (color == Color.black)
            {
                color.a = 0.7f;
                spriteRenderer.color = color;
            }
        }
    }

    public void EnableCollider()
    {
        GetComponentInChildren<BoxCollider>().enabled = true;

        // 자식에 있는 모든 스프라이트 렌더러를 찾아서 만약 검은색이라면 alpha 값 255로 설정
        SpriteRenderer[] spriteRenderers = GetComponentsInChildren<SpriteRenderer>();
        foreach (SpriteRenderer spriteRenderer in spriteRenderers)
        {
            Color color = spriteRenderer.color;
            color.a = 1f;
            spriteRenderer.color = color;
        }
    }

그냥 투명도 조절해보기로 했다.
화살표에 있는 검은색 겹친 부분은 어쩔 수 없음 피벗 위치 때문에

나중에 포스트 프로세싱 좀 더 알아봐서 효과 넣는게 낫긴 할듯
지금은 좀 조잡해보인다

파티클 이펙트

테두리 모양으로 연하게 튀어나오게

하고 싶었는데, 이거 만지다가 깨달음.
이거 계륵임.
아무것도 없는 것보다 나은 효과를 만들려면 이것저것 찾고 실험해보는데 시간 걸릴 것 같음.
아무것도 없는 것보다 나은 효과가 있을지도 잘 모르겠음.

보류.

sfx

https://freesound.org/people/stoltingmediagroup/sounds/598911/

소리가 살짝 둔탁하다

https://freesound.org/people/pjcohen/sounds/410695/

너무 웅장한거 아닌가

https://freesound.org/people/Toffa/sounds/84887/

소리가 작긴 한데 키우면 될듯

hit 효과음은 직접 고르게 해도 좋을 것 같다
고양이 소리 같은거 선택지에 넣어놓으면 웃길듯

결과물

판정 정확도 높이기

맵 더 만들고 이어 붙이면 데모는 나오게 할 수 있는데
생각하면 생각할수록 리듬 게임인데 정확도가 보장이 안된다는게 말이 안됨

그리고 전체 화면으로 보니까 덜덜거리는 건 똑같음
그냥 이거 하나 때문에 게임 하기 싫을 정도

좀 더 조사해보고 실험해보고 고치기

o1 답변

믿어도 되는건지를 모르겠다 네가 리듬 게임 소스 코드들 다 뜯어보고 얘기하는것도 아니고 그냥 적당히 되는대로 얘기하는 건지 아닌지 모르겠어

적절한 타협안?

show_player.transform.position = Vector3.Lerp(show_player.transform.position, transform.position, Time.deltaTime * smoothIntensity);

smoothIntensity 30으로 했더니 적당히 거리 벌리면서 따라가는 느낌.
덜덜거리는 것도 많이 줄었다.

보여지는 플레이어에 아예 판정 로직을 박아넣고
안보이는 플레이어에는 dspTimeGap 기반 이동만 하고
음악 오프셋을 어떻게 잘 조절해서 보여지는 플레이어 기준으로 판정 박자가 맞도록 하면
좀 더 우아하고 아름답게 할 수 있을 것 같긴 한데

대공사가 필요하므로 일단 보류

보여지는 플레이어의 sprite offset을 변경할 수는 없나?
진짜 플레이어 진행 방향 앞에 empty object 하나 더 두고 그거 기준으로 lerp하면 적당히 맞을 것 같은데

진짜 박자선을 따라가는 가짜 박자선을 위한 미래의 진짜 박자선

아직도 조금씩 덜덜거리는게 있긴 한데 나름 부드럽게 따라가고 있다
게임 시작 전에는 future_player가 아니라 진짜 player를 따라가게 해놔야 하는데 (이건 간단)
일단은 해결방법 알아낸듯?

처음엔 사양 따라서 offset 달라지면 어떡하나 고민했는데
사양 따라서 위치 조절이 달라질 일은 없을듯?

bpm 달라지면 달라지긴 할 것 같음.
이건 귀납적으로 어떻게 지정해줘야할지 테스트를 해보면서 데이터값을 기록하고 함수 추론하면 해결 가능할듯.

future_player.transform.position = transform.position + goingDirection * future_offset;

여기서 future_offset만 계산해서 넣어주고 맵 bpm 따라 초기화시키기

왜인진 모르겠는데 future_offset 0.05로 놓으면 bpm 상관없이 부드럽고 실제 판정 움직임이랑 비슷하게 따라가는 것 같음
아무튼 해결 완료

긴 한데 코드 다시 한 번 살펴보긴 해야할듯. 말이 되는건지 잘 모르겠다. 쿠션 하나 넣었다고 해결된다고? 코드 무너가 잘못 짠거 아님?

타이틀 폰트 변경 검토

https://www.1001fonts.com/architext-font.html

예쁘고 좋은데 힘이 없는 느낌

https://www.1001fonts.com/yellowtail-font.html

너무 개성과 자기주장이 강함

https://www.1001fonts.com/chopin-script-font.html

안 어울림

일단 이걸로 가보자

아트 폴리싱

모션그래픽 영상 보면서 레퍼런스 찾기

editor 코드 수정 했는데 안됨

색깔이 안 바뀌길래 색깔 2개 찾아서 저장해놓고 goalColor로 바꿔주는 코드로 바꿈. order in layer가 달라서 그런건줄 알았는데 아니었음. 순서 먹여도 안됨. order in layer 똑같은거 재할당해도 안됨. if문 한개 지워서 한 색깔만 바꿔봤는데 멀쩡히 잘 됨. 뒤에 있는 놈만 잘 먹는거였고, 앞에 있는 놈은 색깔 바뀌고 나서 바로 뒤로 가버림. 색깔이 안 바뀌는게 아니라 바뀌고 나서 순서가 바뀌어버리는거. if문 주석처리해가면서 앞에거 바꾼 후에 뒤에거 바꿔도 순서는 그대로 뒤로 가버림.

색 칠했더니 순서가 바뀐게 아니라 그냥 무슨 짓을 해도 그려지질 않는거였다.

https://discussions.unity.com/t/spriterenderer-is-gone-when-i-change-in-script/215143

무슨 짓을 해도 그려지지 않는게 아니라 alpha 값이 0이어서 그랬던 것
바보같은 짓 하고 있었네

using UnityEngine;
using UnityEditor;

public class SpriteColorChanger : EditorWindow
{

    private Color targetColor1; // 변경될 색상
    private Color targetColor2;
    private Color goalColor1; // 변경할 색상
    private Color goalColor2;
    private GameObject parentObject; // 부모 오브젝트

    [MenuItem("Tools/Sprite Color Changer")]
    public static void ShowWindow()
    {
        GetWindow<SpriteColorChanger>("Sprite Color Changer");
    }

    private void OnGUI()
    {
        GUILayout.Label("Sprite Color Changer", EditorStyles.boldLabel);

        // 부모 오브젝트 선택
        parentObject = (GameObject)EditorGUILayout.ObjectField("Parent Object", parentObject, typeof(GameObject), true);


        // sprite renderer 다 뒤져서 color들 찾아낸 후에 2개를 각각 할당
        foreach (SpriteRenderer sr in parentObject.GetComponentsInChildren<SpriteRenderer>())
        {
            if (targetColor1 == Color.clear || targetColor1 == sr.color)
            {
                targetColor1 = sr.color;
            }
            else if (targetColor2 == Color.clear || targetColor2 == sr.color)
            {
                targetColor2 = sr.color;
            }
        }
        Debug.Log("targetColor1: " + targetColor1);
        Debug.Log("targetColor2: " + targetColor2);

        // 색상 선택
        goalColor1 = EditorGUILayout.ColorField("Goal Color1", goalColor1);
        goalColor2 = EditorGUILayout.ColorField("Goal Color2", goalColor2);

        if (GUILayout.Button("Change Colors"))
        {
            ChangeSpriteColors();
        }
    }

    private void ChangeSpriteColors()
    {
        if (parentObject == null)
        {
            Debug.LogError("Parent Object is not set!");
            return;
        }

        // 모든 하위 SpriteRenderer 찾기
        SpriteRenderer[] spriteRenderers = parentObject.GetComponentsInChildren<SpriteRenderer>();

        if (spriteRenderers.Length == 0)
        {
            Debug.LogWarning("No SpriteRenderers found under the selected object.");
            return;
        }

        int changedCount = 0; // 변경된 SpriteRenderer 개수

        foreach (SpriteRenderer sr in spriteRenderers)
        {
            if (sr.color == targetColor1)
            {
                Undo.RecordObject(sr, "Change Sprite Color"); // Undo 기록
                sr.color = goalColor1; // 색상 변경
                EditorUtility.SetDirty(sr); // 변경 사항 저장
                changedCount++;
            }
            if (sr.color == targetColor2)
            {
                Undo.RecordObject(sr, "Change Sprite Color"); // Undo 기록
                sr.color = goalColor2; // 색상 변경
                EditorUtility.SetDirty(sr); // 변경 사항 저장
                changedCount++;
            }
        }
        Debug.Log(changedCount + " SpriteRenderers changed color.");
    }
}

레퍼런스 보고 적용해봄

확실히 프로가 만진 색을 쓰면 다르다.

텍스처도 많이 참고해서 배경으로 쓰면 좋을듯
블럭 색깔 바꾸지도 않았는데 이렇게나 예쁘다

벡터 그래픽 쓰는 것도 좋아 보이고
이정도는 나도 그릴 수 있으니까 (아마도)



profile
lililllilillll
너 정말 **핵심**을 찔렀어
이전 포스트

241225

다음 포스트

241227

0개의 댓글