짧은 만화

more

고도 엔진

more

고도 엔진 슈팅게임 #7: 사운드&이펙트

[사운드]1. 사격 & 엔진사격과 엔진 사운드를 추가해 보자.Player에 AudioStreamPlayer 노드를 2개 추가하고 각각 LaserSound, EngineSound로 바꾼다. 먼저 사격 사운드를 위해 shoot()에 다음 코드를 추가한다.$LaserSound.play() 만약 소리가 너무 크거나 작다고 느껴지면 Volumne dB 에서 조절할 수 있다. 다음으로 엔진 사운드는 thrust 입력을 받고 있을 때만 재생되어야 하며, 입력을 누르고 있는 동안은 계속 재생되어야 한다.get_input()에 EngineSound를 조건부로 재생하고 멈추는 코드를 추가한다.if Input.is_action_pressed("thrust"): thrust = transform.x * engine_po..
토이프로젝트 2025.01.08 0

고도 엔진 슈팅게임 #6: 플레이어 보호막 기능

[플레이어 보호막]적이나 바위에 부딪혔을 때 혹은 적의 총알에 맞을 때 보호막이 작동해서 바로 목숨을 잃지 않도록 하는 기능을 추가할 것이다.  다음 코드를 player.gd 에 추가한다.signal shield_changed@export var max_shield = 100.0@export var shield_regen = 5.0var shield = 0: set = set_shieldfunc set_shield(value): value = min(value, max_shield) shield = value shield_changed.emit(shield / max_shield) if shield  코드에서 shield_changed 시그널을 보낼 때 shield/max_shield 로 보내는데, HU..
토이프로젝트 2024.12.20 0

고도 엔진 슈팅게임 #5: 적

[일시 정지]적 씬을 만들기에 앞서 '일시 정지' 기능을 추가해 보자. 고도에서 일시 정지는 SceneTree의 함수이며, paused 속성을 사용해 설정할 수 있다.SceneTree 가 일시정지되면 다음 3가지 일이 발생한다.물리 스레드 실행 중지_process()와 _physics_process()가 어떤 노드에서도 호출되지 않음_input()과 _input_event() 메서드가 입력이 있어도 호출되지 않음일시 정지가 트리거 되면 모든 노드가 개발자가 설정한 대로 반응한다.이는 [인스펙터] 창의 하단에 있는 Process - Mode 속성을 통해 설정할 수 있다.선택할 수 있는 옵션은 다음과 같다.Inherit: 해당 노드가 부모와 동일한 모드를 사용Pausable: 씬 트리가 일시 정지되면 해당 ..
토이프로젝트 2024.12.17 0

[HTML] HTML canvas로 Flow Field 구현하기

Flow Field Flow Field 는 시뮬레이션에 사용되는 그래픽 기술로, 각 지점에 대한 특정 방향으로의 흐름을 나타내는 표현 방법이다. (feat. chat GPT) 예시를 찾아보면 초등학생 때 철가루와 자석을 이용해 자기장을 표시하는 듯한 비주얼이다. generative art 결과물들을 보면 여기에서도 많이 쓰이는듯한데 p5.js 라는 라이브러리를 이용하면 좀 더 편하게 구현할 수 있는 모양이다. 하지만 간단한 건 직접 구현하기 그다지 어렵지 않으니 HTML canvas + JavaScript 로 직접 구현해 보자. 결과물 위처럼 마우스 드래그 할 때마다 Flow Field가 그려지도록 만들 것이다. Flow Field 구현 세세한 코드를 전부 올리진 않고(어차피 GitHub에 있으니..) ..
WEB 2024.02.20 0

인기 글

[CSS] 말줄임(...)표: 한줄 또는 여러줄 말줄임 표시

아래처럼 말줄임표를 표시하는 방법을 알아보자. 1. 한 줄일 때 말줄임표 말줄임표를 적용해야 하는 텍스트가 한 줄인 경우는 아래처럼 css를 작성한다. div { width: 200px; /* 오버되면 말줄임 적용할 최대 넓이 */ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } 결과 2. 여러 줄일 때 말줄임표 말줄임표를 적용해야 하는 텍스트가 한 줄인 이상인 경우는 아래처럼 css를 작성한다. div { width: 200px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; /* 2줄 넘어가면 말줄임 */ -webkit-b..
WEB 2023.03.30 0
고도 엔진으로 게임 만들기 #1: 플레이어 씬

[미리보기]이번 편에서 할 것: 플레이어 애니메이션과 움직임 구현    [환경 세팅] https://godotengine.org/ 에서 최신 버전 고도를 다운로드한다.* 스팀에서도 설치가능 (godot 로 검색 후 설치)   [프로젝트 생성하기]godot 를 실행하고 [+새로 만들기] 버튼으로 프로젝트를 생성한다.* 새로 만들 프로젝트 이름을 적어주고 프로젝트 이름 인풋 옆에 [폴더 만들기] 로 폴더를 먼저 만들어줘야 한다.    그 후 프로젝트 설정을 하면 되는데 앱용으로 게임을 만들것이기 때문에 세로 뷰로 창을 설정한다. 세로로 게임화면 설정하기1. [프로젝트 설정]으로 들어간다.  [창] 탭을 선택하고 아래 설정을 해준다.뷰포트 너비 480 / 높이 720‘스트레치' 에서 ‘모드'를 canvas_i..
토이프로젝트 2024.08.31 1
2년차 비전공자 프런트엔드 개발자의 6개월간의 이직 기록

요약 회사를 다니면서 3개월 + 퇴사 후 3개월 = 총 6개월간 이직 준비를 하였고 지금은 이직에 성공하여 번개장터에서 개발자로 일하고 있다! 2년 차 개발자였지만 비전공자에 거의 0년 차 개발자 수준이었던 내가 이직을 하게 된 과정을 정리하려고 한다. 이직 결심 2년간 중소기업 쇼핑몰에서 풀 스택 개발자(말이 풀 스택이지 프런트엔드, 백엔드 구분조차 없는 곳+개발자 없음으로 그냥 모든 일을 다 했다..)로 일했다. 이직을 결심했던 건 사실 꽤 오래되었는데 내일 채움 공제 적금을 넣고 있어서 1년만 더 참자.. 10개월만 더 참자.. 6개월만... 3개월만... 해가면서 2년을 버텨냈다. 이직을 결심한 이유는 크게 두 가지로 압축할 수 있다. 1. 개발 문화 없음, 개발자가 성장할 수 없는 환경 2. 낮..
기타 2022.07.01 0
[JavaScript] 숫자인지 문자인지 판단 정규식(+소수점 판단 정규식)

1. 입력된 데이터가 숫자인지 문자인지 판단 static IsNumber = (value: any) => { const reg = /^[0-9\s]*$/; if (reg.test(value)) { return true; //숫자 } else { return false; //문자 } }; 2. 입력된 데이터가 숫자(소수점 포함)인지 문자인지 판단 static IsNumber = (value: any) => { const reg = /^-?\d*(\.\d*)?$/; if (reg.test(value)) { return true; //숫자(소수점 포함) } else { return false; //문자 } };
JavaScript 2021.10.14 0

티스토리툴바