TESTWEB

본문 바로가기 메뉴 바로가기 폰트크기변경 색상반전보기
톺아보기 공감글 추천글
커뮤니티 C 모두의광장 F 모두의공원 I 사진게시판 Q 아무거나질문 D 정보와자료 N 새로운소식 T 유용한사이트 P 자료실 E 강좌/사용기 L 팁과강좌 U 사용기 · 체험단사용기 W 사고팔고 J 알뜰구매 S 회원중고장터 B 직접홍보 · 보험상담실 H 크롤링테스트홈
공지잠시후(19일 0시) 서버 점검이 진행될 예정입니다. 더보기
l

팁과강좌

기타 유니티로 간단한 게임 만들기 18

59
프라다2
16,527
2023-06-11 11:22:00 수정일 : 2023-06-11 19:47:43 61.♡.190.182

안녕하세요?

유니티로 빠르게 간단한 게임을 만들어보는 강의를 준비했습니다 😊


이번에 만들 게임은 aa 라고 하는 요상한 제목을 가졌는데요.

놀랍게도 전세계적으로 5,000 만 이상의 다운로드를 기록한 간단하면서도 재밌는 게임이랍니다.


플레이 모습은 이런데요.

화면을 터치해서 빙글빙글 돌아가는 동그라미에 작은 동그라미를 쏩니다.




그러면 마치 핀이 꽂히는 것처럼 작은 동그라미가 큰 동그라미에 달라붙고 함께 돌게 돼요.

이렇게 모든 동그라미를 쏴서 맞히는 것이 목표입니다.



하지만 작은 동그라미끼리 부딪치게 되면 그 즉시 게임은 끝나게 돼요




무척 간단하죠?

레벨이 올라갈수록 돌아가는 속도가 달라지거나 방향이 바뀌거나 목표가 높아지는 등 난이도가 높아지는데, 

빠르게 돌아가는 동그라미의 좁은 틈 사이로 쏙 하고 집어 넣게 되면 짜릿한 쾌감마저 느낄 수 있답니다 🤣


찾아보니 같은 아이디어를 빌려서 만든 게임도 있더라구요

그래픽이 들어가니 또 새로운 재미가 있는듯도 합니다.





aa 는 상대적으로 만들기가 수월한 게임입니다.

게임 이미지를 구할 필요가 없거든요

딱 원하는 게임 이미지 구하는게 참 힘든데 aa 는 단색 배경에 까만색 동그라미, 선이면 충분합니다.


5.png


그럼 먼저 게임 배경을 만들어볼게요.

유니티에서 배경은 카메라 선택하고 원하는 색으로 바꿔주면 끝이에요.


6.png



이번에는 동그라미를 만들고 색을 까맣게 해줍니다.

크기를 적당히 조정하고 화면 조금 윗쪽에 배치시켜볼게요. 

여기에 작은 동그라미를 마구 쏠 겁니다.


7.png



일단 한 번 빙글빙글 돌려볼까요? 

그냥 돌리면 티가 나지 않으니 확인을 위해 작은 하얀 동그라미를 하나 붙여볼게요.


8.png



스크립트로 간단하게 transform.Rotate() 메소드를 써서 돌려봤더니 빙글빙글 잘 도네요.




이번에는 작은 동그라미, 우리가 쏠 녀석을 만들어볼게요.

편의상 핀(Pin)이라고 하겠습니다.


큰 동그라미때와 같은 방식으로 작은 동그라미를 만들구요.


10.png



윗쪽 방향으로 슉 올라가도록 스크립트를 적용하겠습니다.

나중에는 마우스로 클릭하면 이렇게 슉 쏘는 형태가 될 거에요.




이제는 충돌 처리를 해볼까요?

작은 동그라미가 올라가다가 큰 동그라미와 닿으면 그 즉시 멈추고 큰 동그라미에 달라붙어서 함께 빙글빙글 돌아가면 되겠네요.


큰 동그라미, 작은 동그라미에 충돌 영역을 설정하기 위해 Circle Collider 2D 컴포넌트를 추가합니다.

물리법칙을 적용하기 위해 Rigidbody 2D 컴포넌트도 추가해주세요.



12.png


13.png



스크립트에서 충돌 됐을 때 작은 동그라미가 큰 동그라미에 달라붙도록 하기 위해서는 transform.SetParent() 를 쓰면 됩니다.




잘 붙네요!


그런데 원래 게임에서는 두 동그라미가 이렇게 직접 맞닿지는 않았습니다.

그리고 둘을 서로 연결하는 길쭉한 선이 있었지요?


15.png



이 부분은 어떻게 처리할까 고민하다가 그냥 큰 동그라미의 충돌 영역을 조금 키워주기로 합니다.

그러면 동그라미와 다소 떨어져 있어도 이 곳에서 작은 동그라미는 멈추게 되겠지요.


16.png



그리고 작은 동그라미에는 충돌 영역이 없는 선을 하나 만들어줍니다.


17.png



처음에는 선을 안 보이게 숨겼다가 큰 동그라미와 충돌하게 되면 그때 이 선을 보여줄거에요.


감쪽같죠?




지금까지는 핀을 하나만 쐈었는데 이번에는 마우스를 클릭해서 여러개를 쏠 수 있도록 해보겠습니다.

똑같은 형태의 핀을 여러 번 중복해서 만들기 위해서 핀을 프리팹으로 관리할게요.

프리팹은 마치 주문제작과 비슷하다고 생각하시면 됩니다.


어느 회사에서 단체로 옷을 맞추기로 한다면 업체에 디자인을 보내서 먼저 샘플을 만들어 볼겁니다.

그런 다음에 색이나 모양 등이 마음이 드는지 보고 필요하면 수정을 거듭해서 최종적으로 마음에 드는 결과물을 만들겠죠.

그때부터는 그 결과물과 똑같은 옷을 회사에서 주문하는 만큼 여러 벌 만들게 될겁니다.


19.png



프리팹도 동일해요.

어떤 게임 오브젝트(여기서는 핀)를 만들어서 크기와 모양 색깔, 충돌 영역 등 다양한 속성을 원하는 만큼 수정한 다음에 이와 똑같은 게임 오브젝트를 여러 개 만들 수 있도록 하기 위한 것이 바로 프리팹입니다. 총알이나 미사일, 아이템이나 적 캐릭터 등 여러 번 등장하는 것들은 매번 새롭게 만들 필요 없이 하나를 잘 만들어둔 다음에 복사해서 쓰면 되는 것이죠!



핀 프리팹을 만든 다음 정해진 위치(화면 아래)에서 핀이 만들어지도록 합니다.

마우스로 클릭해서 준비된 핀을 쏘고 나면 다음 핀을 준비시키도록 하면 되겠네요.




이어서 목표 설정을 하겠습니다.


진짜 게임에서는 큰 동그라미 가운데에 현재 레벨이 숫자로 표시되는데, 우리는 그 위치에 목표로 하는 작은 동그라미의 수를 적도록 할게요.

10이라고 적혀 있으면 10개의 핀을 쏴서 올바로 맞춰야 하는 겁니다.


21.png



UI - Text 를 이용하면 간단하게 만들 수 있는데, 충돌 처리 부분을 조금 보완해서 핀을 잘 쏜다면 목표 수를 감소 시켜주도록 하겠습니다.




거의 다 왔네요.


이번에는 게임 오버 처리를 하겠습니다.

목표 수 만큼 모든 핀을 큰 동그라미에 올바로 꽂는다면 성공,

다른 핀과 쿵 하고 충돌하게 되면 실패로 끝나는 겁니다.


성공일 때는 배경색을 초록색으로,

실패일 때는 배경색을 빨간색으로 바꿔서 진짜 게임과 동일하게 해볼까요?




성공과 실패, 게임 결과에 따라 색이 잘 표시되는 것을 확인할 수 있네요!



이제는 게임이 끝나면 다시 시작할 수 있는 재시작 버튼을 넣어주겠습니다.

UI - Button 을 이용해서 기본 색상에 글자만 키워주도록 할게요.


25.png



그리고 이 버튼을 누르면 지금 만들고 있는 이 게임 화면(Scene) 을 다시 로딩해서 새 게임을 시작할 수 있도록 하겠습니다.



훌륭하네요!



마지막으로 난이도 조절을 해볼까요?


그냥 끝내기에는 뭔가 밋밋하고 조금 아쉬운 감이 없잖아 있어요.

왜냐면 한쪽 방향으로 같은 속도로 계속 돌아가니 게임이 너무 쉽거든요.


애니메이션 편집을 이용해서 1초는 빠르게 시계 방향으로, 1초는 느리게 반시계 방향으로 회전하는 것을 반복시켜볼게요.


27.png



그러면 잘 돌다가 잠깐 반대로 돌다가, 또 잘 돌다가 반대로 돌다가, 핀을 쏠 타이밍을 잡기 어렵게 되었습니다.




훨씬 더 쫄깃한 맘으로 게임을 할 수 있겠죠?


이렇게 해서 모든 게임이 완성되었습니다.


아주 간편하면서도 재미있는 게임, 어린 자녀분들과 함께 플레이 해보면 정말 좋아할 거예요 😊 

(못한다고 놀리거나, 너무 어렵게 만들지는 마세요 ㅋ 울어요...    해봐서 알아요)


29.png



게임을 만드는 방법은 이 곳에 하나의 영상으로 소개되어 있습니다.



유니티 게임 개발에 관심 있으신 분들께 도움되면 좋겠습니다!

긴 글 읽어주셔서 감사해요.


행복한 주말 되세요 🙌




프라다2님의 게시글 댓글
  • 주소복사
  • Facebook
  • Twitter
59명
댓글 • [18]
메모동기화
을 누르면 회원메모를 할 수 있습니다.
굥교육
LINK
#142776498
IP 182.♡.176.23
23-06-11 2023-06-11 16:10:29
·
엄지척입니다!
프라다2
LINK
#142777241
IP 61.♡.190.182
23-06-11 2023-06-11 17:12:45
·
@굥교육님 감사합니다 ^^
단축키
LINK
#142777141
IP 106.♡.128.48
23-06-11 2023-06-11 17:03:32
·
재미있네요
프라다2
LINK
#142777245
IP 61.♡.190.182
23-06-11 2023-06-11 17:13:10
·
@단축키님 참신한 게임 아이디어가 너무 부러워요 :)
카슈밀
LINK
#142779684
IP 211.♡.129.84
23-06-11 2023-06-11 21:02:31
·
잘 봤습니다. 모델링 하는것도 강의가 있나요?
프라다2
LINK
#142780808
IP 61.♡.190.182
23-06-11 2023-06-11 22:33:46
·
@카슈밀님 모델링 강의는 아직 없습니다 ^^;
박달냥
LINK
#142779706
IP 121.♡.61.95
23-06-11 2023-06-11 21:04:52
·
일단 공감 감사합니다!!
프라다2
LINK
#142780811
IP 61.♡.190.182
23-06-11 2023-06-11 22:33:56
·
@박달냥님 감사합니다!
안녕킴밥
LINK
#142780281
IP 125.♡.116.68
23-06-11 2023-06-11 21:50:51
·
이제 광고 붙여서 돈버는 법 알려주세요.ㅎㅎ
프라다2
LINK
#142780814
IP 61.♡.190.182
23-06-11 2023-06-11 22:34:25
·
@안녕킴밥님 구글 애즈 연동하는 것도 언젠가 한 번 다뤄보겠습니다 :)
아무개다
LINK
#142780390
IP 1.♡.167.22
23-06-11 2023-06-11 21:59:16
·
팁과강좌는 유튜브 홍보 게시판이구나..
프라다2
LINK
#142780817
IP 61.♡.190.182
23-06-11 2023-06-11 22:34:42
·
@아무개다님 유튜브 동영상이 불편하셨다면 사과드립니다.
OLD한량
LINK
#142781248
IP 223.♡.180.37
23-06-11 2023-06-11 23:07:55
·
이런 글 좋아요
재밌어요
프라다2
LINK
#142783776
IP 61.♡.190.182
08:41 2023-06-12 08:41:09
·
@OLD한량님 재밌게 봐주셔서 감사해요 :)
벗바리
LINK
#142781417
IP 14.♡.143.214
23-06-11 2023-06-11 23:23:53
·
오~ 재밋습니다. 강의 감사합니다. 그런데 crazy archery, twisty arrow란 게임들과 비슷하네요
프라다2
LINK
#142783786
IP 61.♡.190.182
08:42 2023-06-12 08:42:15
·
@벗바리님 twisty arrow 는 완전 똑같아 보이네요 ㅋㅋ 구글 플레이 스토어에는 유명한 게임이 하나 있으면 줄줄이 따라서 카피 게임들이 만들어지는 것 같아요 ㅎ
야하하하
LINK
#142783955
IP 61.♡.249.83
08:55 2023-06-12 08:55:25
·
와 신기하네요
문짝문씨
LINK
#142785236
IP 124.♡.216.32
10:14 2023-06-12 10:14:26
·
와 너무 멋지시네요!
새로운 댓글이 없습니다.
이미지 최대 업로드 용량 15 MB / 업로드 가능 확장자 jpg,gif,png,jpeg
지나치게 큰 이미지의 크기는 조정될 수 있습니다.
목록으로
글쓰기
글쓰기
목록으로 댓글보기 이전글 다음글
아이디·비번 찾기 회원가입
OTP 앱 인증코드
인증코드를 받지 못하는 경우
GIF 파일 다운로드
0 0 0 0
GIF 파일을 다운로드 받으려면
화면에 표시된 4자리 번호를 입력해주세요.
댓글 주소복사