플래시 자료 제작31 FLARToolkit - 실시간으로 웹캠과 연동해서 보여주기 최근에 각광받고 있는 내용입니다. 웹캠과 연동해서 특정한 기호의 패턴을 인식해서 사용자가 그 패턴을 출력해서 가지고 있으면 실시간으로 그 패턴위에 3차원 물체를 구현합니다. 나중에 지구본을 올려 돌려볼 수 있게 하면 재미있겠네요 교육적으로도 잘 개발하면 활용할 곳이 많을 것 같습니다. 아래 사이트를 참고하세요 http://cafe.naver.com/uiaa/281 http://flystone.tistory.com/34 아래는 응용한 동영상입니다. AR New Year Greeting Card from Saqoosha on Vimeo. FLARToolKit demo at Adobe MAX 2009 Japan from Saqoosha on Vimeo. 2013. 1. 16. 3dMax 에서 object 만들어서 flash로 가져오기 http://cafe.naver.com/papervision3d.cafe?iframe_url=/ArticleRead.nhn%3Farticleid=104 2013. 1. 16. 플래시 away3d class에 등록하는 방법 http://away3d.com/ 에서 프로그램을 다운받아 설치한 후 원하는 위치로 이동후 flash cs4를 실행시키고 편집 - 환경설정에 가서 액션스크립트를 선택하고 액션스크립트 3.0 세팅 선택후 + 버튼을 누르고 폴더를 선택하면 됨 이때 선택하는 폴더는 away3d 가 들어있는 폴더 바로 전 폴더를 선택해야 함 왜냐하면 import 할때 import away3d.etc 이런식으로 임포트 하기 때문임 2013. 1. 16. 다른경로에 있는 텍스트를 불러들이는 swf 화일 불러왔을때 경로문제 해결 보통 학급앨범과 같은 플래시 화일을 swf 화일로 불러들이면 제대로 동작하지 않는다. 이유는 swf 화일에서 같은경로에 있는 txt 화일을 불러와야 하는데 이 경로를 html 화일이 들어있는 경로로 인식하기 때문이다. 이럴때 제작한 플래시 화일 첫 액션스크립트에 this._lockroot=true; 라는 문구를 하나 추가시켜 주면 된다. 이렇게 하면 _root 는 불러들여진 플래시 화일을 의미한다. 불러들인 플래시 화일을 참고하려면 _level0 을 사용하면 된다. 이걸 이용하면 올 플래시 홈페이지 제작도 가능하다. 2013. 1. 16. 플래시 8 threshold 사용법 연구중 아래와 같이 사용되는 것으로 보인다. //그림그려질비트맵.threshold(비교할비트맵,범위,시작점,비교색상보다크냐작냐범위설정,비교색상, 조건만족시 칠해질 색상, 마스크색상, 복사여부) myBitmapData.threshold(myBitmapData1, new Rectangle(0, 0, 60, 120), new Point(0, 0), " 2013. 1. 16. 교플강12(마지막회)-대포게임 만들기 3. 포트리스 게임을 위한 키보드 입력방법 알아본다. 가. 키보드를 통한 상호작용 포트리스 게임(대포게임)을 제대로 만들기 위해 대포의 각도를 바꾸는 방법에 대해서 생각해 보자. 대포의 각도를 바꾸기 위해서 키보드의 방향키를 이용할 것이다. 상하 방향키를 이용하여 각도 변화를 만들어 보자. 우선 대포 무비 클립을 하나 만들어 인스턴스 네임을 ‘po’ 라고 하고, 키보드를 이용하여 회전시켜 보도록 하자. 메인프레임에 다음과 같이 적어 보자. //기초값 gak = 0; // 초기각도 onEnterFrame = function () { po._rotation = gak; if (Key.isDown(Key.UP)) { gak = gak-1; } if (Key.isDown(Key.DOWN)) { gak = gak.. 2013. 1. 16. 교플강11 -포물선 운동 구현하기 주제 : 플래시로 만들어 보는 포물선 운동과 포트리스 게임 ☐ 주제설정의 취지 및 목적 앞에서 우리는 플래시를 이용한 등속도 운동의 표현방법과, 등가속도 운동의 표현 방법에 대해서 공부했다. 이 장에서는 등속운동과, 등가속도 운동이 혼합된 운동, 포물선 운동에 대해서 공부하고자 한다. 실제 세계에서는 다양한 운동이 나타난다. 그런 다양한 운동을 표현하기 위해서는 그 물체에 작용하는 여러 가지 힘과, 마찰력, 운동방향등을 고려해 주어야 한다. 하지만 사실 이러한 물리적 현상을 모두 고려한다는 것은 쉬운 일은 아니다. 이 장에서는 간단한 방법을 이용하여 정확하지는 않지만 실제 세계와 유사한 상황을 표현할 수 있도록 좀더 접근해 보고자 한다. 간단한 포물선 운동을 통해 실제세계의 운동에 좀더 비슷하게 접근할 .. 2013. 1. 16. 교플강10-중력장에서 우주선 착륙게임 만들기 나. 착륙 우주선 게임 만들기 지금까지 배운 것을 토대로 우주공간에서 우주선을 키보드로 조절하여 우주기지에 착륙시키는 게임을 만들어보자. 1)고려해야 할 사항에 대해 토의해 보고 변수명을 정해보자. 우주선의 인스턴스명 (ufo) 지면의 인스턴스명 (san) 착륙장의 인스턴스명 (land) 2) 화면구성 3) 액션스크립트 //속도 초기화 vx = 0; vy = 0; g=0.01 //중력의 크기 onEnterFrame = function () { vy = vy+g; ufo._x = ufo._x+vx; ufo._y = ufo._y+vy; //산과의 충돌 구현 if (san.hitTest(ufo)) { delete onEnterFrame; //반복실행 없앰 trace("실패"); } //착륙장과 의 충돌 구현 .. 2013. 1. 16. 교플강9 - 관성효과에 의한 운동 3. 관성효과를 이용한 공의 운동을 표현할 수 있다. 가. 키보드를 이용한 운동효과 구현 이번에는 키보드를 사용하여 우주선을 조절해 보도록 하자. 키보드로 우주선을 조절하기 위해서는 우선 플래시에서 키보드가 눌렸는지를 감지해야 할 것이다. 그리고 눌려진 키가 무엇인지도 알아내야 할 것이다. onClipEvent 문을 사용하여 무비클립 자체에다 명령을 줄 수도 있으나, 우리는 지금까지 메인프레임에 액션스크립트를 부여해 왔기 때문에 조금 어렵더라도 액션스크립트에 명령을 부여 하는 방법을 택하도록 하겠다. 우선 키보드가 눌렸는지 체크하기 위해서는 아래와 같은 명령을 메인프레임에 적어 주면 된다. //프레임이 반복될때 마다 onEnterFrame = function () { //만약 커서키 중에 왼쪽커서키가 눌.. 2013. 1. 16. 교플강8 - 자유낙하운동 2. 자유낙하 운동을 컴퓨터로 구현할 수 있다. 가. 자유낙하 운동 공식 이해 자유낙하란 중력에 의해 물체가 지구중심으로 떨어지는 운동을 이야기 한다. 지구중심방향으로 떨어지는 물체는 중력가속도(g) 때문에 점점 속력이 빨라지는 등가속도 운동을 하게 된다. 이곳에서 자유낙하 운동을 다루고자 하는 이유는 우리 주변에서 항상 접하고 있는 사건이기 때문이다. 자유낙하 운동의 공식을 살펴보면 아래와 같다. 중력가속도 : g=9.8(m/s²) 속 도 : v=v0+gt 이 동거 리 : s=s0+v0t +(1/2)gt² v:나중속도(m/s), v0:처음속도(m/s), a:가속도(m/s²) t:걸린시간(s), s:이동거리(m) s0:초기위치(m) 나. 자유낙하 운동 표현방법 구상 우선 시간부터 생각해 보자. 시간 변화.. 2013. 1. 16. 교플강7-물체의 가속도 운동 구현하기 주제 : 플래시로 구현해보는 가속도 운동과 자유낙하 운동 ☐ 주제설정의 취지 및 목적 플래시를 이용해서 가속도 운동과 자유낙하 운동을 표현해 보고자 한다. 우리가 알고 있는 등가속도 운동을 컴퓨터로 표현한다는 것은 생각처럼 쉬운일만은 아닐 것이다. 이 장에서 등가속도 운동을 컴퓨터로 시물레이션 해 봄으로써 컴퓨터로 움직임을 어떻게 표현하고 제어할 수 있는지를 알아 보고자 한다. 그리고 우리가 생각하는 공식을 컴퓨터가 이해하게 만들기 위해서 시간과 거리 표현을 어떤 방법으로 해야 할 것인지도 살펴보고자 한다. 조금 더 깊이 들어가 점화식을 만들어 보고 적용해 봄으로써 컴퓨터로 표현할 수 있는 운동의 개념을 이해하고 응용할 수 있게 될 것이다. 좀 더 자연스러운 움직임을 위해 어떤 것들을 고려해야 하며, 어.. 2013. 1. 16. 교플강6(벽돌깨기 만들기 - 충돌이해)-벽돌깨기를 위하여 4. 무비클립간의 충돌을 이해하고, 충돌후 반응을 처리할 수 있다. 공도 화면상에서 움직이고, 조절바도 마우스를 따라 다니며 움직이도록 만들었다. 이제는 조절바로 내려오는 공을 받았을때 다시 튕겨 올라가게 만들어야 할 것이다 .그렇다면 조절바와 공이 충돌이 일어나는지 어떻게 알 수 있겠는가 가. 조절바와 공의 충동방법을 이해한다. (hitTest) 플래시 애션스크립트 중 hitTest 문을 이용하면 두 무비클립간의 충돌을 체크할 수 있다. hitTest는 두 무비클립이 충돌했는지 안했는지의 여부를 알려주는 역할을 한다. 무비클립A.hitTest.무비클립B 무비클립A 와 무비클립B가 충돌을 했는지를 판정해 줍니다. 무비클립A.hitTest.(x,y,true) 무비클립A가 우리가 지정해준 (x,y)좌표와 충.. 2013. 1. 16. 교플강5(화면을 못 벗어나게, 그리고 마우스를 따라다니는 움직임) - 벽돌깨기를 위하여 2. 변수를 이용하여 운동의 방향을 바꿀 수 있다. 가. 공 무비클립이 화면을 벗어나지 못하도록 조건문을 이용하여 잡아둘 수 있다. 이번에는 공이 화면을 벗어나지 않고 계속해서 움직이게 만들어보자. 화면오른쪽 끝까지 가면 방향을 왼쪽으로 바꾸고, 화면 왼쪽 끝까지 오면 다시 방향을 오른쪽으로 바꾸게 해보자. 마찬가지로, 공을 계속해서 x축방향으로 움직이게 해야 할 것이다. 그리고 공이 오른쪽 끝을 벗어나는 순간 -x축방향으로 움직이게 해야 할 것이다. 그러기 위해서 우리는 speed 라는 변수를 만들어 공의 움직임을 제어해 보고자 한다. 공의 움직임을 화면안에서만 돌아다니게 하기 위해서는 아래와 같은 스크립트를 만들어 주면 된다. speedx = 5; onEnterFrame = function () { .. 2013. 1. 16. 교플강4(무비클립과 화면상에서 움직임 이해) - 벽돌깨기를 위하여 주제 : 플래시로 구현해보는 운동과 벽돌깨기 ☐ 주제설정의 취지 및 목적 아무리 좋은 프로그램이라 할지라도 화면상에 원하는 형태로 표현할 수 없다면 좋은 프로그램이라고 할 수 없다. 필자는 새로운 프로그램을 접할 때 마다 구구단문제와 벽돌깨기를 꼭 만들어 본다. 이 2가지 프로그램을 쉽게 만들어 낼 수 있는 프로그램이라면 사용하기에 있어서 편리한 프로그램이라고 볼 수 있다. 이런 관점에서 본다면 벽돌깨기는 반드시 만들어 보아야 할 프로그램 중에 하나이다. 우리는 벽돌깨기를 만들어 봄으로써 화면상 원하는 위치에 물체를 표현해내는 방법과, 모니터상에서의 좌표체계, 또 플래시를 이용한 그래픽처리 방법에 대해서 배우게 될 것이다. 아울러 화면상의 물체를 제어하는 방법과, 충돌처리방법 그리고 마우스나 키보드를 이.. 2013. 1. 16. 교플강3(구구단 문제 출제 프로그램 만들기) 라. 성적표가 나오는 구구단 프로그램 만들기 컴퓨터가 구구단 문제를 출제하면 사용자가 문제를 풀고 문제를 풀때 마다 몇문제를 맞추었는지 알려 주는 프로그램을 만들어 보자. 1)사용할 변수가 최소한 몇 개가 될지 토의해 보고 변수명을 정해보자. //컴퓨터가 생각한 첫 번째 숫자 x1 //컴퓨터가 생각한 두 번째 숫자 x2 //곱한결과값 mun //사용자가 입력한 값 : dab //맞았는지 틀렸는지 내용출력은 : msg //확인버튼 인스턴스명 : ok_btn //문제출제 인스턴스명 : re_btn //출제된 문제수 : num_mun //맞춘 문제 갯수 : num_yes //틀린 문제 갯수 : num_no 컴퓨터가 구구단 문제를 출제하면 사용자가 문제를 풀고 문제를 풀때 마다 몇문제를 맞추었는지 알려 주는 프.. 2013. 1. 16. 교플강2(구구단 화면에표시하기,생각한 숫자 맞추기게임) 3. 플래시가 문제를 내면 사람이 맞추는 방법 가. 생각한 숫자 알아 맞추기 게임 활동 생각한 숫자 알아 맞추기 게임 1. 조원중에 술래가 종이에 1부터 100까지의 숫자중에 아무 숫자나 적는다. 2. 나머지 조원들은 1명씩 돌아가면서 술래가 생각한 숫자를 맞추기 위해 노력한다. 3. 술래는 다른 조원들이 돌아가면서 숫자를 말할 때 마다. 자신이 생각한 숫자가 조원들이 말한 숫자보다 큰지, 작은지를 알려 준다. 4. 조원들은 술래가 말한 숫자 범위내에서 다시 다른 숫자를 말한다. 4. 술래가 생각한 숫자를 정확하게 맞추는 사람이 우승자가 된다. 5. 우승자는 술래가 되어 처음부터 게임을 다시 진행한다. 지뢰피하기 게임 생각한 숫자 알아 맞추기 게임이랑 하는 방법은 똑같다. 다만 이번에는 술래가 생각한 숫.. 2013. 1. 16. 교플강1(구구단 만들기를 위한 기초개념) 주제 : 플래시로 구현해보는 구구단과 알고리즘 ☐ 주제설정의 취지 및 목적 플래시를 이용해서 구구단을 만들어 보고자 한다. 구구단을 주제로 잡은 이유는 구구단은 초등학교때부터 해오던 가장 기본적인 계산 방법이며 누구나 쉽게 계산해 낼 수 있으므로 컴퓨터가 맞았는지 쉽게 확인해 가며 프로그램을 작성할 수 있기 때문이다. 모든 프로그램에 있어서 반드시 익히고 넘어가야 하는 것 중에 하나가, 컴퓨터와의 상호작용이다. 그런면에서 본다면 구구단은 컴퓨터와 상호작용할 수 있는 가장 좋은 프로그램중에 하나이다. 구구단 프로그램을 작성해 보면 컴퓨터가 난수를 통해 문제를 내는 방법과, 계산하는 방법, 또 사용자가 컴퓨터에 입력하는 방법을 익힐 수 있다. 입력된 값이 정답인지를 어떻게 비교할 것이며, 정답여부를 어떻게 .. 2013. 1. 12. [강의] 민서아빠의 교사를 위한 플래시 강의(교플강) -1 2005년도에 플래시 MX가지고 만들었던 자료입니다. 간단하게 플래시를 활용한 개념을 잡는데 도움이 되리라 생각합니다. 강의순서 1강 플래시로 구구단 만들기 2강 생각한 숫자 알아맞추기 게임 만들기 3강 구구단 문제 출제 프로그램 만들기 4강 플래로 구현해 보는 운동과 벽돌깨기 5강 마우스를 따라다니는 움직임 구현하기 6강 벽돌깨기 - 충돌을 이해하고 충돌 후 반응처리하기 7강 물체의 가속도 운동 구현하기 8강 자유낙하 운동 9강 관성효과에 의한 운동 10강 중력장에서 우주선 착륙게임 만들기 11강 포물선 운동 구현하기 12강 대포게임 만들기 앞으로 이곳에서 플래시를 이용하여 교사들에게 도움이 되는 내용으로 강의를 진행해 보려고 합니다. 시작만 거창하고, 끝은 흐지부지 될지는 모르겠지만 제가 가지고 있는.. 2013. 1. 12. 동영상을 이용한 손접기 동영상을 이용해서 만든 손접기 프로그램입니다 마우스를 손가락 위에 가져다 대면 손가락을 접습니다. 2013. 1. 12. 무비클립 위에 마우스 올라갔을때 손가락 모양 나타나게 하기 보통은 버튼클립위에 마우스가 올라가면 손가락 모양으로 바뀌지만 무비클립위에 마우스가 올라가면 아무 변화가 없다. 얼마전에 이거 때문에 무비클립위에 마우스 올라왔을때 커서 모양 바뀌게 만드느라 고생한 적이 있다. 오늘 테스트 하다가 우연히 발견한 건데 무비클립 자체에다가 액션을 on(Press){ } 라고 주면 아무내용이 없어도 저절로 커서가 올라가면 마우스 모양이 생긴다. onClipEvent (mouseDown) { } 으로 쓰면 손가락 모양 커서가 안 나타남 2013. 1. 12. 이전 1 2 다음
