close_btn
로그인, 회원가입후 더 많은 혜택을 누리세요 로그인 회원가입 닫기

[IAL 2019-2 10주차] 회의록

울나 2019.06.27 14:10 조회 수 : 52

참여자 : 이정효, 이세민, 현지윤, 김나현

서기 : 김나현

 

[1부] 발표 : 이정효

https://docs.google.com/document/d/1AoGv4EnIZK3q5banV6p8i9JBB4U3uY3kct-QtCv7c80/edit

 

0. 사례

zach.lieberman - 다양한 AR시도

DIA Studio - 타이포 위주의 작업

SPACE TYPE GENERATOR - 텍스트를 넣고 모션을 옵션으로 조절할 수 있음

kiel.d.m 인스타그램

모션 포스터 - 실습때 사용해볼것임

텍스트 파티클 (?t=Hello 에  다른 텍스트 널어도 바뀜)

ertdfgcvb - html 문자 바로 나옴, 빠른것이 강렬

네이버 한글날 – 스페셜로고 - 한글날 기념

 

1. 왕복운동

function setup() {

  createCanvas(400, 400);

}

 

function draw() {

  background(220);

  

  var moveX = sin(frameCount*0.01) * 100;

  

  ellipse(width/2 + moveX, height/2, 100, 100);

}

 

2. 텍스트 그리기 (*문자중 아래로 내려가는 텍스트도 있기 때문에(ex : q ,y등) A 같은 텍스트의 경우 center를 해도 정중앙이 아니기 떄문에 강제로 내려야함)

function setup() {

  createCanvas(400, 400);

  background(200);

  textAlign(CENTER,CENTER);

  textSize(height*0.7);

  text('A',width/2,height*0.55); 

}

 

3. get 이해하기

var img;

 

function setup() {

  createCanvas(400, 400);

  img = loadImage('spiral-balloon.jpg');

}

 

function draw() {

  background(220);

  image(img,0,0,width,height);

 

  var c = get(mouseX,mouseY);

  

  fill(c);

  rect(10,10,50,50);

}

 

4. 모션포스터

var pg; //p5 grapic

var startX;

var startY;

var th;

var t;

var tw;

var gap = 4;

 

function setup() {

  createCanvas(400, 400);

  background(200);

  

  pg = createGraphics(width,height);

  

startX = 120;

startY = 100;

th = height * 0.7;

t = 'A';

  

  pg.background(255);

  pg.textAlign(LEFT,TOP);

  pg.textSize(th);

  pg.text(t,startX,startY); 

 

tw = pg.textWidth(t);

  // noFill();

  // rect(startX, startY, tw, th);

  

gap = 50;

     }

 

function draw(){

  background(255);

  image(pg,0,0,width,height);

    fill(255,0,0);

  for(var y=0; y<height; y+=gap){

    for(var x=0; x<width; x+=gap){

      var sx = x +sin(frameCount*0.1 + (x+y)*0.01)*50;

      copy(pg,floor(sx),y,gap, gap, x,y, gap, gap);

      // noFill();

      // stroke(255,0,0);

      // rect(x,y,gap,gap);

         }    

        }

}

 

보색으로 색조합, 색상에 대한 이슈 : 회화랑 디지털이랑 다름, 다음번에 발표하시기로

 

[2부] 

이세민 : 터치디자이너 오디오 작업

현지윤 : Atlantic waves, roberthenka

이정효 : 포트폴리오 홈페이지 리뉴얼 - 음악적 요소가미 reel rythm