교컴로고초기화면으로 header_kyocom
교컴메뉴
교컴소개 이용안내 소셜교컴 나눔마당 배움마당 자료마당 교과마당 초등마당 특수마당 글로벌교컴 온라인프로젝트학습 교컴 UCC
회원 로그인
정보기억 정보기억에 체크할 경우 다음접속시 아이디와 패스워드를 입력하지 않으셔도 됩니다.
그러나, 개인PC가 아닐 경우 타인이 로그인할 수 있습니다.
PC를 여러사람이 사용하는 공공장소에서는 체크하지 마세요.
소셜네트워크 서비스를 통해서 로그인하시면 별도의 로그인 절차없이 회원서비스를 이용하실 수 있습니다.
교컴 키우기 자발적 후원


:::: 교컴가족 로그인(1)
구도중생 (01:34)

  • 주간 검색어
  • 현재 검색어
  1. 민주주의와 교육
  2. 수학 42
  3. ADHD 1
  4. 국어
  5. 모둠 1
  6. 4학년1학기 사회
  7. 비상연락망
  8. 동아리 13
  9. 힘찬이 2
  10. 생활기록
기간 : ~
기간 : 현재기준

교컴 포토갤러리

플래시수업

교플강7-물체의 가속도 운동 구현하기

민서아빠 | 2009.02.15 22:36 | 조회 7164 | 공감 2 | 비공감 0

주제 : 플래시로 구현해보는 가속도 운동과 자유낙하 운동

☐ 주제설정의 취지 및 목적

플래시를 이용해서 가속도 운동과 자유낙하 운동을 표현해 보고자 한다. 우리가 알고 있는 등가속도 운동을 컴퓨터로 표현한다는 것은 생각처럼 쉬운일만은 아닐 것이다. 이 장에서 등가속도 운동을 컴퓨터로 시물레이션 해 봄으로써 컴퓨터로 움직임을 어떻게 표현하고 제어할 수 있는지를 알아 보고자 한다. 그리고 우리가 생각하는 공식을 컴퓨터가 이해하게 만들기 위해서 시간과 거리 표현을 어떤 방법으로 해야 할 것인지도 살펴보고자 한다. 조금 더 깊이 들어가 점화식을 만들어 보고 적용해 봄으로써 컴퓨터로 표현할 수 있는 운동의 개념을 이해하고 응용할 수 있게 될 것이다. 좀 더 자연스러운 움직임을 위해 어떤 것들을 고려해야 하며, 어떤 방법을 취해야 할지 고민해 보고 익혀보자.

☐앞으로 공부할 내용

1. 가속도에 따른 물체의 움직임을 표현할 수 있다.

가. 가속도 공식 유도

나. 컴퓨터를 이용한 속도 운동 시뮬레이션

다. 컴퓨터를 이용한 가속도 운동 시뮬레이션

(점화식과, onEnterFrame 이용)

2. 자유낙하 운동을 컴퓨터로 구현할 수 있다.

가. 자유낙하 운동 공식 이해

나. 자유낙하 운동 표현방법 구상

다. 자유낙하 운동 시뮬레이션

3. 관성효과를 이용한 공의 운동을 표현할 수 있다.

가. 키보드를 이용한 운동효과 구현

나. 마찰력에 따른 운동 감쇠 효과 구현

다. 중력장 안에서 움직이는 우주선의 효과 구현

4. 응용

가. 중력장 안에서 마우스로 공 집어던지기

나. 우주선 착륙 게임 만들기

다. 복잡한 산과의 충돌 구현

학습 활동

가속도에 따른 물체의 움직임 표현

가. 가속도의 운동의 공식 유도

속력이란 단위시간당 이동거리를 말한다. 우리가 화면상에서 물체를 움직이는 것도 엄밀히 말하면 속력을 이용하고 있는 것이다. 가속도 운동이란 시간에 따라 속력이 변하는 운동을 말한다. 시간에 따라 일정하게 속력이 변하는 운동을 등가속도 운동이라고 한다. 속력이 점점 빨라질수도 있고, 느려질수도 있다.

그렇다면 컴퓨터상에서 물체의 속력을 어떻게 표현할 것인가. 우리는 속도를 이용해서 물체의 움직임을 표현해 보고자 한다.

속도 = 이동거리/시간=(나중위치-처음위치)/시간 (v = s/t)

이동거리 = 속도 * 시간 (s = v*t)

플래시의 경우에는 프레임을 기반으로 만들어 졌기 때문에 시간은 불연속적이다. 가장작은 시간은 1프레임동안의 시간이 된다. 따라서 플래시 상에서의 속력은 1프레임당 몇픽셀을 이동했는지가 속도의 정의가 될 것이다. 우리가 살고있는 세상의 경우 매순간마다 시간이 흐르듯이, 플래시의 경우에도 정해진 시간마다 프레임이 하나씩 흘러 간다고 보면 된다. 즉 플래시 무비의 프레임갯수가 1개 뿐이더라도 프레임 단위로 시간이 흘러가고 있는 것이다. 예를 들어 ball 이라는 무비클립이 있고 프레임에 아래와 같은 액션스크립트를 주었다고 하면

onEnterFrame = function () {

ball._x = ball._x +5;

}

매 프레임 마다 ball이라는 무비클립은 x축으로 5만큼식 이동하게 되는 것이다.

위 ball의 속력은 한프레임 당 5픽셀씩 이동하므로 5픽셀/프레임이 될 것이다.

그렇다면 현재의 속력은 어떻게 알아낼 수 있을까? 현재의 속도를 구하기 위해서는 현재위치에서 이전프레임의 위치를 빼면 프레임당 속력이 나올 것이다.

이전프레임의 위치를 변수에 저장해 두었다가 이번프레임의 위치에서 이전프레임의 위치를 뺀다면 한프레임 동안 얼마만큼 이동했는지(속도)을 알 수 있다.

나. 컴퓨터를 이용한 속도 운동 시뮬레이션

우리는 앞시간에 공이 움직이는 것을 배웠다. 그것은 속력을 구한 것이 아니라 속력을 가지고 있는 공의 시간(프레임)에 따른 이동거리를 구해낸 것이다. 그렇다면 이번에는 마우스의 움직임에 따라 속력을 구해보자.

우선 ball이라는 무비클립을 하나 만들자. 그리고 프레임에 아래와 같은 스크립트를 작성해서 이동속력에 따라 ball 의 넓이를 변하게 해보자.

ball.startDrag(true);

//초기위치

prevx = ball._x;

prevy = ball._y;

onEnterFrame = function () {

  //현재 볼위치에서 초기위치를 빼면 프레임당 속력이 구해짐

  vx = ball._x-prevx; //x축의 속력

  vy = ball._y-prevy; //y축의 속력

  //속력만큼 볼의 넓이와 높이를 나타나게 한다.

  ball._width = Math.abs(vx);

  ball._height = Math.abs(vy);

  //다시 현재의 위치를 초기위치로 바꾼다.

  prevx = ball._x;

  prevy = ball._y;

};

이처럼 우리는 간접적으로나마 컴퓨터상에서 속력을 구하는 방법을 알아 보았다. 속력의 개념을 정확히 이해한다면, 물체의 움직임을 표현하는데 크게 어렵지는 않을 것이다.

다. 컴퓨터를 이용한 가속도 운동 시뮬레이션

가속도란 단위시간당 변한 속도를 말한다. 예를 들어 5초인 순간 5m/s로 움직이던 자동차가 6초인 순간 7m/s 가 되었다면 이 자동차의 속도는 1초동안 2m/s 만큼 증가했으므로, 가속도는 2m/s2 이 된다. 따라서 가속도의 정의는 다음과 같이 적을 수 있다.

가속도 = 속도의 변화량 / 시간의 변화량

=(나중속도-처음속도) / 걸린시간

만약 가속도가 0이면, 속도가 일정한 등속도 운동이 되고, 가속도가 양수면 속도가 점점 증가하는 운동, 가속도가 음이면 속도가 점점 감소하는 운동이 될 것이다. 등가속도 운동의 공식은 아래와 같다.

1번째 공식 : v=v0+at

2번째 공식 : s=v0t+(1/2)at²

v:나중속도(m/s), v0:처음속도(m/s), a:가속도(m/s²)

t:걸린시간(s), s:이동거리(m)

차가 출발할 때처럼 정지해있던 물체의 속력이 점점 빨라지는 운동을 플래시로 표현해 보자. 속력이 빨라지는 등가속도 운동이어야 하므로, 물체가 이동하는 위치는 시간이 지날 수록 처음위치 보다 더 많은 거리를 이동해야 할 것이다. 위 공식중 2번째 공식을 이용하여 작성하면 아래와 같다.

우선 ball이라는 무비클립을 하나 만든 후 프레임 스크립트에 아래와 같이 스크립트를 작성해 보자.

//초기값

s = 0; //초기위치

a = 1; //가속도 크기

t = 0; //시작 시간

v0 =0; //초기속도를 0이라고 하자.

//반복실행

onEnterFrame = function () {

//등가속도 운동에서의 이동거리 공식

  s = v0*t + 1/2*a*t*t;

  ball._x = s;

  //시간증가

  t = t+1;

}


<아래 버튼을 눌러 보세요>

displayMultimedia("files/attach/images/1569/988/008/accer.swf", "400","320", { autostart : false });

<토의>가속도(a) 값을 바꾸어 가면서 실행시켜 보자.
좋아요! 싫어요!
twitter facebook me2day
448개(1/23페이지) rss
플래시수업
번호 제목 글쓴이 조회 날짜
공지 [활용] 수업 활용 감동 플래시 150편 [37+1] 함영기 162611 2003.08.21 18:57
447 [기타플래시] 세상에서 가장 감동적인 이야기 [7] 교컴지기 20463 2010.08.27 20:26
446 [플래시강좌] 교플강12(마지막회)-대포게임 만들기 사진 첨부파일 [1] 민서아빠 11173 2009.02.15 22:46
445 [플래시강좌] 교플강11 -포물선 운동 구현하기 사진 첨부파일 민서아빠 11662 2009.02.15 22:45
444 [플래시강좌] 교플강10-중력장에서 우주선 착륙게임 만들기 사진 첨부파일 민서아빠 7036 2009.02.15 22:43
443 [플래시강좌] 교플강9 - 관성효과에 의한 운동-키보드 입력 첨부파일 민서아빠 7209 2009.02.15 22:42
442 [플래시강좌] 교플강8 - 자유낙하운동 첨부파일 민서아빠 8621 2009.02.15 22:39
>> [플래시강좌] 교플강7-물체의 가속도 운동 구현하기 첨부파일 민서아빠 7165 2009.02.15 22:36
440 [기타플래시] 투명인간 만들기1.0(웹캠이용) 사진 첨부파일 [1] 민서아빠 6847 2009.02.08 21:27
439 [플래시수업] 재미있는 플래시 만화 '재동이네' 48편 [3] 교컴지기 12774 2008.11.24 12:57
438 [플래시게임] 율동 플래시 - 얼굴 찌푸리지 말아요 첨부파일 [3] 교컴지기 13519 2008.11.11 15:20
437 [플래시유틸] 모둠 뽑기 플래시 첨부파일 [3] 교컴지기 23137 2008.11.11 15:19
436 [플래시유틸] 알람시계 플래시 첨부파일 [4] 교컴지기 11680 2008.11.11 15:17
435 [플래시수업] 플래시 생각 수업 : 세상에서 가장 아름다운 시 첨부파일 교컴지기 8736 2008.09.22 22:34
434 [플래시수업] [모듈자료] 기후 그래프 그리기 첨부파일 [1] 함영기 11369 2008.03.03 09:35
433 [플래시유틸] [프리웨어]각종 동영상포멧을 FLV와 SWF로 전환시켜주는 프램 첨부파일 유춘모 7689 2008.01.29 22:29
432 [플래시강좌] 서버에 실시간 AVI를 FLV로 변환하는 날개를 달자 첨부파일 유춘모 6728 2008.01.03 22:02
431 [플래시수업] 환경교육과 플래시가 만나면? [6] 함영기 7445 2007.10.29 14:48
430 [플래시수업] [수학] 정다면체의 전개도 애니메이션 자료~* 첨부파일 [1] 함영기 9974 2007.10.24 21:56
429 [기타플래시] [안내] 1~3분 분량의 주의집중 콘텐츠 공모 사진 함영기 6094 2007.10.24 21:36
428 [플래시강좌] 플래시로 쉽게 공부하는 포토샵 매뉴얼 함영기 8339 2007.10.24 21:29