'Research Topics' 카테고리의 글 목록 (6 Page)

'Research Topics'에 해당되는 글 91건

080426 스터디 모임

4.26 모임내용
----------------------------------------------------------------------------------------------
- 교재 스터디 진행 (~336p) : 김지연, 김지인, 류예림, 최윤정
- 중요한 내용 :
245p - 시간을 얻어낼 수 있는 함수 (이를 활용해서 비주얼한 시계 제작이 가능 하겠죠)
   280p - fill의 opacity 조절을 통한 rect 드로잉으로 잔상효과 내기
   292p - sine 곡선의 진동값을 활용한 모션
   301p - Array (배열) 활용
316p - Array 를 활용한 이미지 애니메이션
   328p - 간단한 타이포 애니메이션
   336p - mac os x 의 dock 애니메이션 구현 방법

공지사항
----------------------------------------------------------------------------------------------
- 다음주를 마지막으로 Processing - A Programming Handbook for Visual Designers and Artists
   책 스터디를 일단락 짓게 됩니다. 다음주 스터디 끝나고 맥주한잔 하죠 ^^

- 이후에는 전시회에 관한 계획과 작업 준비에 관한 이야기가 있을 예정입니다.

과제
----------------------------------------------------------------------------------------------

- background가 아닌 rect함수를 이용하여 잔상이 남는듯한 착시효과 주기

- 배열(array) 이용해보기

- sin곡선의 부드럽게 움직이는 특성을 살려 모션 제작해보기

중에 한가지 이상 사용하여 자유롭게 모션 제작해보기

<참고코드 - 슈퍼마리오 만들기>

지난번 <참고코드 - 초간단 키보드 방향키로 도형 움직이기> 에서
단지 움직이는 도형을 마리오 이미지로 바꾼 것 입니다.

아주 단순한데, 배경이미지를 한번 그려주고 마리오 이미지를 그려주는 방식이고,
마리오의 움직임을 표현하기위해 마리오 이미지는 2장을 번갈아 보여줍니다.
물론, 마리오 이미지는 키보드 좌우가 눌릴때 마다 x 좌표를 변화시켜서 보여주고요.

참고로, 이러한 캐릭터를 이미지로 만들때 중요한것은 테두리 밖의 여백이 투명하게 처리되어야
배경이 보이므로 포토샵에서 투명배경에 캐릭터만 올리고 투명도를 지원하는 gif 나 png 로 저장해야 됩니다.

// 변수들 선언
int x, y=375;
int toggle=1;
PImage imgBackground;
PImage marioSprite1, marioSprite2;

void setup()
{
size(800,500);
frameRate(60);
imgBackground = loadImage("mario_map.jpg"); // 배경 이미지

marioSprite1 = loadImage("Mario_sprite1.png"); // 마리오 이미지1
marioSprite2 = loadImage("Mario_sprite2.png"); // 마리오 이미지2
}

void draw()
{

image(imgBackground,0,0); // 먼저 배경을 그린다

if(keyPressed == true)
{
if(key == CODED)
{
if(keyCode == LEFT) // 키보드 왼쪽 방향키가 눌리면
{
x-=10; // x 좌표 10만큼 빼준다
}
else if(keyCode == RIGHT)
{
x+=10; // x 좌표 10만큼 더해준다
}
}
}

if(toggle==1) // 마리오 이미지 1,2 를 번갈아서 보여주기 위한 변수
{
image(marioSprite1,x,y); // 마리오 이미지 1
toggle=0;
}
else
{
image(marioSprite2,x,y); // 마리오 이미지 2
toggle=1;
}
}

위의 코드처럼 간단히 배경을 그리고 캐릭터를 특정 위치에 그려줌으로써
기본적인 게임의 골격이 시작됩니다.

위를 응용하면 오락실에 있는 슈팅게임도 만들 수 있겠지요? (충돌과 처리는 제외하고 일단 움직임만)
일단 배경을 그려주는 것과 좌우 방향키로 캐릭터 이미지를 그려줄 수 있으니
이를 응용해보면,

1. 세로로 아주 긴 배경이미지를 만들어서 draw 함수에서 그려주되 y 좌표를 증가시켜줌으로써
   배경이 아래로 조금씩 스크롤 되게 한다

2. 캐릭터를 우주선 이미지로 바꾼다. 좌우 이동은 위의 마리오에서 이미 구현 했죠.

3. 스페이스바나 기타 키를 눌렀을때 미사일이 나가도록 한다.
   일반적으로 미사일은 아래의 우주선에서 윗 방향으로 쭉 나가니까
   미사일 이미지를 만들고 load해서 그려주되 우주선의 현재 x 좌표에서 시작하고
   y 를 - 시켜주면 미사일이 위로 쭉 올라가겠죠.

4. 적들 이미지들도 만들어서 위에서 아래로 y 를 + 시켜주면서 움직여 내려오게 해주면 되겠죠.
   여러 적들을 만들때는 오늘 배운 array 를 쓰고, random 을써서 임의의 x 좌표에서 나타나게
   할 수 있겠죠.

5. 여기까지 하면 기본적인 슈팅게임 모양은 갖춰집니다.

아래는 예제에서 사용된 이미지들 입니다.
--------------------------------------------------------

Posted by 알 수 없는 사용자

[과제080426] 박정은

void setup() { size(500, 300); } int x=200, y=150; // 도형 처음 위치 int bx = 0, by = 0; // bar init void draw() { background(255); // 배경 흰색칠 x = constrain(x, 0,450); y = constrain(y, 20,280); if (keyPressed == true) // 키가 눌렸으면 { if(key == CODED) // 키보드 특수키 (ALT, CONTROL, SHIFT, UP,DOWN,LEFT,RIGHT) 이면 { if (keyCode == LEFT) // 왼쪽방향키인 경우 { x = x-1; // x 좌표 -1 해준다 } else if (keyCode == RIGHT) // 오른쪽방향키인 경우 { x = x+1; // x좌표 +1 해준다 } else if (keyCode == UP) // 윗방향키인 경우 { y = y-1; // y좌표 -1 해준다 } else if (keyCode == DOWN) // 아래방향키인 경우 { y = y+1; // y좌표 +1 해준다 } else if (keyCode == SHIFT) { bx = x+24; by = y-15; strokeWeight(5); stroke(0); line(bx, by, bx,0); } else if (keyCode == ALT) { bx = x+5; by = y; stroke(80); strokeWeight(1); line(bx,by,bx,0); line(bx+40,by,bx+40,0); } } } noStroke(); fill(100); rect(x, y, 50, 20); // 좌표 x, y 위치에 50x50 크기 네모 그리기 rect(x+17, y-15,16,15); }

Posted by 알 수 없는 사용자

080419 스터디 모임

우측 메뉴에서 program - study - processing code share 에 과제 및 참고코드들 올려놓았습니다.
앞으로 과제는 여기에 각자 파일을 올리는것으로 하겠습니다.
올릴때는 꼭 실행화면의 캡쳐 이미지도 함께 올려서 어떤 코드인지 파악이 쉽도록 합시다~

08.04.19 출석
----------------------------------------------------------------------------------------------

		4.19
학과(학년)	이름	출석	과제
CD2	박동윤	o	o
CD2	정용채	o
CD2	우준형
FD1	류예림	o
FD1	최윤정	o
FD1	심혜림	o
PD1	한재석	o	o
PD1	안성민	o
PD1	서리진	o
PD1	박정은	o
PD1	김지연	o
PD1	형예명	o
CD1	전정민
CD1	김지인	o
CD1	함경석	o	o
CD1	이현주	o
CD1	김재인	o
CD1	설승재
CD1	김유정	o	o
CD1	이정은	o	o
CD1	박근명

모임내용
----------------------------------------------------------------------------------------------
- 교재 스터디 진행 (~196p) : 한재석, 안성민, 박정은
- 중요한 내용 :
205p - 마우스 좌표값 : mouseX, mouseY 활용
   212p - 마우스가 눌렸는지 mousePressed 로 판별
   219p - 마우스로 그림그리기
   224p - 키보드 입력 활용
229p - 마우스, 키보드의 이벤트 방식의 처리 방법

공지사항
----------------------------------------------------------------------------------------------
- 늦거나 참석하지 못하신분들은 꼭 공부하셔서 오늘 진행상황까지 진행 하시기 바랍니다.
   (주위 멤버들 적극 활용)
- 당연한 이야기지만 교재책은 꼭 반드시 읽어 보시고, 스터디한 내용들은 꼭 직접 쳐보고 실행할것!
   (눈으로만 봐서는 절대 안됨 ^^;)
- 참석을 못하게 되는 분들은 미리 알려주시고, 과제를 이메일로 꼭 제출해 주기 바랍니다.
- 차주 발표하는 멤버 이외의 멤버들도 당연히 책을 읽어와야 됩니다.
   (공부할 내용도 모른채 강의를 듣는 개념으로 오면 안됨)

다음주 발표
----------------------------------------------------------------------------------------------
김지인, 류예림, 심혜림, 최윤정 (-336p)

이번주과제
----------------------------------------------------------------------------------------------

mouse 와 key event 함수를 사용하여 마우스나 키보드 에 따라
반응하는 각기 다른 기능을 3가지 이상 구현할것.

<참고코드 - 초간단 키보드 방향키로 도형 움직이기>

알다시피 draw()는 계속 불리게 되니 draw가 불릴때마다 다음 일들을 하는겁니다.

1. 키보드 키가눌렸는지 체크한다 if (keyPressed == true)
2. 눌린 키보드 키가 어떤종류인가체크
3. 눌린 키보드 키가 방향키인지 체크하고 좌표를 더하거나 빼줌

이 네모 도형을 케릭터 이미지로 대체하면 바로 게임속 캐릭터 움직이는게 되겠죠.^^

// 변수 선언
int x=200, y=150; // 도형 처음 위치

void setup()
{
size(500, 300);
}

void draw()
{
background(255); // 배경 흰색칠

if (keyPressed == true) // 키가 눌렸으면
{
if(key == CODED) // 키보드 특수키 (ALT, CONTROL, SHIFT, UP,DOWN,LEFT,RIGHT) 이면
{
if (keyCode == LEFT) // 왼쪽방향키인 경우
{
x = x-1; // x 좌표 -1 해준다
}
else if (keyCode == RIGHT) // 오른쪽방향키인 경우
{
x = x+1; // x좌표 +1 해준다
}
else if (keyCode == UP) // 윗방향키인 경우
{
y = y-1; // y좌표 -1 해준다
}
else if (keyCode == DOWN) // 아래방향키인 경우
{
y = y+1; // y좌표 +1 해준다
}
}
}

fill(0); // 도형은 검정색으로 칠한다
rect(x, y, 50, 50); // 좌표 x, y 위치에 50x50 크기 네모 그리기

}

Posted by 알 수 없는 사용자

[과제080419] 이정은

void setup()
{
size(500,500);

smooth();
noStroke();
}

int x;
int y=0;
int colorVar1=1,colorVar2=200,colorVar3=250;
float z=PI/500;
void leaf(int x, int y, int size, int dir)
{
pushMatrix();
translate(x, y);
scale(size);
beginShape();
vertex(1.0*dir, -0.7);
bezierVertex(1.0*dir, -0.7, 0.4*dir, -1.0, 0.0, 0.0);
bezierVertex(0.0, 0.0, 1.0*dir, 0.4, 1.0*dir, -0.7);
endShape();
popMatrix();
}

void draw(){
background(255);
int a = 100;
translate(50,50);
for (x=0;x<100;x=x+1)
if ( (z>0) || (z<PI/400) ){

rotate(z);
scale(1.05);

colorVar1 = int(random( 255));
colorVar2 = int(random(100, 250));
colorVar3 = int(random(100, 255));

fill(colorVar1, colorVar2, colorVar3, a);
leaf(40,10,35,1);

}
z=z+PI/1000;
}

Posted by 알 수 없는 사용자

[과제080419] 한재석

float angle = 0.0;

void setup(){
size(500,400);
background(255);
noStroke();
smooth();
frameRate(10);
}

void draw(){
background(255);
fill(190);
rect(0,365, 500,400);

PFont font;
font = loadFont("BankGothic-Medium-48.vlw");
textFont(font);
fill(0);
textSize(30);
textAlign(RIGHT);
text("sadi pd1 Han", 490, 390);

fill(255);

rythme( -PI/700, 150, 170);
rythme( PI/1000, 110, 170);
rythme( PI/650, 150, 190);
rythme( PI/1600, 90, 180);

}

void rythme( float v_angle, int waveSize, float offset) {
for (int waveX = 0; waveX <= width ; waveX +=20){
float unitSize = random(5,30);
float waveY = offset + (sin(angle)* waveSize);
fill(random(235), random(235), random(235), random(235));
ellipse(waveX, waveY, unitSize, unitSize);
angle += v_angle;
}
}

void mousePressed(){
noLoop();
}

void mouseReleased(){
loop();
}

Posted by 알 수 없는 사용자

[과제080419] 함경석

void setup(){
size(400,400,P3D);
frameRate(100);
}
float i = 0.0; // rotate speed
int r = int(random(255)); // initial RGB value
int g = int(random(255));
int b = int(random(255));
int rt = r;
int gt = g;
int bt = b;
void draw(){
   background(255);

   fill(r,g,b,100); //setting box color
   stroke(r,g,b,100);
// random rgb color and iteration
   if(( r >= rt) || (r <= 0)) { // red
   rt = r;
   r = r + 1;
   }
   if(( r>= 255) || (r < rt)) {
   rt = r;
   r = r - 1;
   }

if(( g >= gt) || (g <= 0)) { // green
   gt = g;
   g = g + 1;
   }
   if(( g>= 255) || (g < gt)) {
   gt = g;
   g = g - 1;
   }

   if(( b >= bt) || (b <= 0)) { // blue
   bt = b;
   b = b + 1;
   }
   if(( b>= 255) || (b < bt)) {
   bt = b;
   b = b - 1;
   }

   i += 0.01;
   translate(width/2, height/2 , 0);
   rotateY(i);
   box(100);
   if(i > TWO_PI) {
i = 0.0;
}
}

Posted by 알 수 없는 사용자

[과제080419] 박동윤

/***************************************
* 2008.4 Dongyoon Park
* cre8ive.park@gmail.com
* http://www.cre8ive.kr
****************************************/

// declare and initialize variables.
int tintVar=100, tintIncrease = 10;
int colorVar1, colorVar2, colorVar3, opacityVar, txtSize, txtVar;
int xpos, ypos;
String strText1 = "sadi Communication Design";
char letter = 'A';
int deg = 0;
PFont font;

void setup()
{
size(800,500); // set screen size.
background(0); // set background color.
smooth();
frameRate(200);
font = loadFont("Myriad-BdWeb-70.vlw");
}

void draw()
{
colorVar1 = int(random(255));
colorVar2 = int(random(255));
colorVar3 = int(random(255));
opacityVar = int(random(20,100));
txtSize = int(random(30,300));
txtVar = int(random(-50,50));

xpos = int(random(width-100));
ypos = int(random(height));
fill(colorVar1,colorVar2, colorVar3, opacityVar);
textFont(font);
textSize(txtSize);

letter += txtVar;
text(letter, xpos, ypos);

}

Posted by 알 수 없는 사용자

[과제080419] 박동윤

/***************************************
* 2008.4 Dongyoon Park
* cre8ive.park@gmail.com
* http://www.cre8ive.kr
****************************************/

void setup()
{
size(800,500); // set screen size.
background(0); // set background color.
smooth();
}

// declare and initialize variables.
int tintVar=100, tintIncrease = 10;
int colorVar1, colorVar2, colorVar3, opacityVar;
int xpos, ypos;

String strText1 = "sadi Communication Design";
PFont font;
font = loadFont("Myriad-BdWeb-70.vlw");

void draw()
{

colorVar1 = int(random(255));
colorVar2 = int(random(255));
colorVar3 = int(random(255));
opacityVar = int(random(100));

xpos = int(random(width-100));
ypos = int(random(height));

fill(colorVar1,colorVar2, colorVar3, opacityVar);
textFont(font);

text(strText1, xpos, ypos);

}

Posted by 알 수 없는 사용자

[과제080419] 김유정

void setup() {
size(400,200);
noStroke( );
smooth();
background(0);
}
float randomColor = random(0,360);
int cplus=1;
float randomR = random(0,90);
float offset= 100;
float scaleVal = 90;
float angleInc=PI/18.0;
float angle = 0.0;

void draw () {

randomColor = randomColor + cplus;
if ( (randomColor<0) || (randomColor)>360)
cplus=-cplus;

for (int x = 0; x <= width ; x += 10 ){
float y = offset + (sin(angle) * scaleVal);
fill(255);
ellipse(x,y,7,7);
y = offset + (cos(angle)*scaleVal);
fill(randomColor,100,100);
ellipse(x,y,7,7);
angle += angleInc;

}
}