顯示具有 99160494陳孟琳 標籤的文章。 顯示所有文章
顯示具有 99160494陳孟琳 標籤的文章。 顯示所有文章

2013年1月14日 星期一

期末作品 Final


系統名稱:  <piano>

如何製作:

  1、用黑白膠帶纏住由冰棍製成的黑鍵與白鍵
  2、連接電路板、七個電阻、一個喇叭。
  3、製作由processing點選開始的畫面、進入鋼琴的畫面。
  4、撰寫arduino的程式碼。
  5、搜尋processing與arduino相互連接的程式。

圖片:
一開始執行的畫面
點選"Enter to play"後的畫面
按第一個按鈕,發出Do的聲音
按第二個按鈕,發出Re的聲音
按第三個按鈕,發出Me的聲音
按第四個按鈕,發出Fa的聲音
按第五個按鈕,發出So的聲音
小鋼琴圖片-1
小鋼琴圖片-2
小鋼琴圖片-3
電路板接線圖

程式碼

processing程式碼


import processing.serial.*;
Serial myPort;

PImage bg1,Do,Re,Mi,Fa,So,La,Si;

void setup() {
  size(800, 600);
  bg1 = loadImage("piano.jpg");  //載入圖檔
  Do = loadImage("piano-Do1.jpg");
  Re = loadImage("piano-Re1.jpg");
  Mi = loadImage("piano-Mi1.jpg");
  Fa = loadImage("piano-Fa1.jpg");
  So = loadImage("piano-So1.jpg");
  La = loadImage("piano-La1.jpg");
  Si = loadImage("piano-Si1.jpg");
  myPort = new Serial(this, "COM15", 9600);
}

void draw() {
  image(bg1, 0, 0, 800, 600);
  image(Do, 86, 82, 89, 333);
  image(Re, 169, 80, 89, 333);
  image(Mi, 253, 81, 89, 333);;
  image(Fa, 338.5, 84, 89, 333);
  image(So, 425, 81, 89, 333);;
  image(La, 509, 82, 89, 333);
  image(Si, 593, 82, 89, 333);
}


arduino程式碼


const int inPin1 = 1;
const int inPin2 = 2;
const int inPin3 = 3;
const int inPin4 = 4;
const int inPin5 = 5;
const int inPin6 = 6;
const int inPin7 = 7;

int val1 = 0, val2 = 0, val3 = 0, val4 = 0, val5 = 0, val6 = 0, val7 = 0;

void setup() {
   Serial.begin(9600);

   pinMode(inPin1, INPUT);
   pinMode(inPin2, INPUT);
   pinMode(inPin3, INPUT);
   pinMode(inPin4, INPUT);
   pinMode(inPin5, INPUT);
   pinMode(inPin6, INPUT);
   pinMode(inPin7, INPUT);
}

void loop() {
   val1 = digitalRead(inPin1);
   val2 = digitalRead(inPin2);
   val3 = digitalRead(inPin3);
   val4 = digitalRead(inPin4);
   val5 = digitalRead(inPin5);
   val6 = digitalRead(inPin6);
   val7 = digitalRead(inPin7);

      if(val1==HIGH){
         tone(8,524,8);
      }
      if(val2==HIGH){
         tone(8,588,8);
      }
      if(val3==HIGH){
         tone(8,660,8);
      }
      if(val4==HIGH){
         tone(8,698,8);
      }
      if(val5==HIGH){
         tone(8,784,8);
      }
       if(val6==HIGH){
         tone(8,880,8);
      }
       if(val7==HIGH){
         tone(8,988,8);
      }
}





心得介紹:
  我們在家執行時,程式碼是可以執行的;但在學校卻不能執行,經過老師的指導才知道原來
  是程式碼的問題,我們把之前在家裡寫得很完整的有些程式碼註解掉了,導致程式在執行
  時,狀況一堆 。
  原本我們的構想是想在這次的期末作品中,利用二維陣列寫出錄音的功能,可以記錄時間、
  音樂,讓玩家可以儲存自己在彈奏的旋律,並加入播放的功能,聲音是由電腦發出剛剛輸入
  的聲音。希望之後可以完成這兩項功能。

影片:




組員分工:

  陳孟琳:主要負責processing、arduino的程式碼。

  紀詠心:主要負責電路連接。

Week16,HW12

將期末作品的進度寫出來~

目前進度:

processing程式碼:

import processing.serial.*;
Serial myPort;

PImage bg1,Do,Re,Mi,Fa,So,La,Si;

void setup() {
  size(800, 600);
  bg1 = loadImage("piano.jpg");  //載入圖檔
  Do = loadImage("piano-Do1.jpg");
  Re = loadImage("piano-Re1.jpg");
  Mi = loadImage("piano-Mi1.jpg");
  Fa = loadImage("piano-Fa1.jpg");
  So = loadImage("piano-So1.jpg");
  La = loadImage("piano-La1.jpg");
  Si = loadImage("piano-Si1.jpg"); 
  myPort = new Serial(this, "COM15", 9600);
}

void draw() {
  image(bg1, 0, 0, 800, 600);
  image(Do, 86, 82, 89, 333);
  image(Re, 169, 80, 89, 333);   
  image(Mi, 253, 81, 89, 333);;
  image(Fa, 338.5, 84, 89, 333);
  image(So, 425, 81, 89, 333);;
  image(La, 509, 82, 89, 333);
  image(Si, 593, 82, 89, 333);
}

----------------------------------------------------------------------------------------

arduino程式碼:

const int inPin1 = 1;
const int inPin2 = 2;
const int inPin3 = 3;
const int inPin4 = 4;
const int inPin5 = 5;
const int inPin6 = 6;
const int inPin7 = 7;

int val1 = 0, val2 = 0, val3 = 0, val4 = 0, val5 = 0, val6 = 0, val7 = 0;

void setup() {
   Serial.begin(9600);
  
   pinMode(inPin1, INPUT);
   pinMode(inPin2, INPUT);
   pinMode(inPin3, INPUT);
   pinMode(inPin4, INPUT);
   pinMode(inPin5, INPUT);
   pinMode(inPin6, INPUT);
   pinMode(inPin7, INPUT);
}

void loop() {
   val1 = digitalRead(inPin1);
   val2 = digitalRead(inPin2);
   val3 = digitalRead(inPin3);
   val4 = digitalRead(inPin4);
   val5 = digitalRead(inPin5);
   val6 = digitalRead(inPin6);
   val7 = digitalRead(inPin7);

      if(val1==HIGH){
         tone(8,524,8);
      }
      if(val2==HIGH){
         tone(8,588,8);
      }
      if(val3==HIGH){
         tone(8,660,8);
      }
      if(val4==HIGH){
         tone(8,698,8);
      }
      if(val5==HIGH){
         tone(8,784,8);
      }
       if(val6==HIGH){
         tone(8,880,8);
      }
       if(val7==HIGH){
         tone(8,988,8);
      }
}


----------------------------------------------------------------------------------------

找素材(圖片):




素材:一包冰棍、黑白色膠帶各一綑、一片珍珠板、
            七個方形按鈕、七個電阻、一個喇叭等。

----------------------------------------------------------------------------------------

心得:

  這次的期末作業,我們想要用冰棍來製作小型的鋼琴鍵。
  可以發出:Do、Re、Mi、Fa、So、La、Si的音階,並
  可以錄音由玩家彈奏的一段旋律,並有儲存、播放的功能。




2012年12月18日 星期二

Wee13,HW11

01.將Arduino做出的鋼琴錄影上傳到youtube,再貼回部落格


02.發揮你的創意做出最特別的音樂

~~音樂 : 小蜜蜂~~
03.貼上程式碼

const int inPin1 = 7;
const int inPin2 = 6;
const int inPin3 = 5;
const int inPin4 = 3;
const int inPin5 = 2;
int val1 = 0, val2 = 0, val3 = 0, val4 = 0, val5 = 0;
void setup() {
   pinMode(inPin1, INPUT);
   pinMode(inPin2, INPUT);
   pinMode(inPin3, INPUT);
   pinMode(inPin4, INPUT);
   pinMode(inPin5, INPUT);
}
void loop() {
   val1 = digitalRead(inPin1);
   val2 = digitalRead(inPin2);
   val3 = digitalRead(inPin3);
   val4 = digitalRead(inPin4);
   val5 = digitalRead(inPin5);

      if(val1==HIGH){
         tone(8,524,8);
      }
      if(val2==HIGH){
         tone(8,588,8);
      }
      if(val3==HIGH){
         tone(8,660,8);
      }
      if(val4==HIGH){
         tone(8,698,8);
      }
      if(val5==HIGH){
         tone(8,784,8);
      }
}

心得:
這次在課堂上做了"1 2 3 4 5 "五個音階,但是我們按"2"的按鈕,發出來的聲音聽起來有點分岔,不是很悅耳。電線經過幾次的調整後,"2"的音終於比較正常了,但是"3"的音卻怪怪的,索性我們跟別組借了按鈕,五個音階終於正常了。

影片中的音樂是"小蜜蜂"。

2012年11月27日 星期二

Weel12,HW10

1、霹靂燈之影片分享

   藉由調可變電阻改變閃爍頻率


影片一、快速閃爍的霹靂燈

影片二、閃爍較慢的霹靂燈

影片三、調整閃爍頻率之霹靂燈



2、

圖一
圖二


3、程式碼


void setup() {
  // declare the ledPin as an OUTPUT:
  pinMode(13, OUTPUT);
  pinMode(12, OUTPUT);
  pinMode(11, OUTPUT);
  pinMode(10, OUTPUT);
  pinMode(9, OUTPUT);
  pinMode(8, OUTPUT);
  pinMode(7, OUTPUT);    
}

void loop() {

  // read the value from the sensor:
  sensorValue = analogRead(sensorPin);  
  // turn the ledPin on
  digitalWrite(13, HIGH);
  delay(sensorValue);
  digitalWrite(12, HIGH);
  delay(sensorValue);
  digitalWrite(11, HIGH);
  delay(sensorValue);
  digitalWrite(10, HIGH);
  delay(sensorValue);
  digitalWrite(9, HIGH);
  delay(sensorValue);
  digitalWrite(8, HIGH);
  delay(sensorValue);
  digitalWrite(7, HIGH);
  delay(sensorValue);
  // stop the program for <sensorValue> milliseconds:
  delay(sensorValue);        
  // turn the ledPin off:      
  digitalWrite(13, LOW);
  delay(sensorValue);
  digitalWrite(12, LOW);
  delay(sensorValue);
  digitalWrite(11, LOW);
  delay(sensorValue);
  digitalWrite(10, LOW);
  delay(sensorValue);
  digitalWrite(9, LOW);
  delay(sensorValue);
  digitalWrite(8, LOW);
  delay(sensorValue);
  digitalWrite(7, LOW);
  delay(sensorValue);
  // stop the program for for <sensorValue> milliseconds:
  delay(sensorValue);
  digitalWrite(13, HIGH);
  digitalWrite(12, HIGH);
  digitalWrite(11, HIGH);
  digitalWrite(10, HIGH);
  digitalWrite(9, HIGH);
  digitalWrite(8, HIGH);
  digitalWrite(7, HIGH);
  delay(sensorValue);
  digitalWrite(13, LOW);
  digitalWrite(12, LOW);
  digitalWrite(11, LOW);
  digitalWrite(10, LOW);
  digitalWrite(9, LOW);
  digitalWrite(8, LOW);
  digitalWrite(7, LOW);
  delay(sensorValue);
  digitalWrite(13, HIGH);
  digitalWrite(12, HIGH);
  digitalWrite(11, HIGH);
  digitalWrite(10, HIGH);
  digitalWrite(9, HIGH);
  digitalWrite(8, HIGH);
  digitalWrite(7, HIGH);
  delay(sensorValue);
  digitalWrite(13, LOW);
  digitalWrite(12, LOW);
  digitalWrite(11, LOW);
  digitalWrite(10, LOW);
  digitalWrite(9, LOW);
  digitalWrite(8, LOW);
  digitalWrite(7, LOW);
  delay(sensorValue);

  digitalWrite(7, HIGH);
  delay(sensorValue);
  digitalWrite(8, HIGH);
  delay(sensorValue);
  digitalWrite(9, HIGH);
  delay(sensorValue);
  digitalWrite(10, HIGH);
  delay(sensorValue);
  digitalWrite(11, HIGH);
  delay(sensorValue);
  digitalWrite(12, HIGH);
  delay(sensorValue);
  digitalWrite(13, HIGH);
  delay(sensorValue);
  // stop the program for <sensorValue> milliseconds:
  delay(sensorValue);        
  // turn the ledPin off:      
  digitalWrite(7, LOW);
  delay(sensorValue);
  digitalWrite(8, LOW);
  delay(sensorValue);
  digitalWrite(9, LOW);
  delay(sensorValue);
  digitalWrite(10, LOW);
  delay(sensorValue);
  digitalWrite(11, LOW);
  delay(sensorValue);
  digitalWrite(12, LOW);
  delay(sensorValue);
  digitalWrite(13, LOW);
  delay(sensorValue);
}

心得:

2012年11月20日 星期二

Week11,HW09

TODO:
1、有了 Processing + Arduino,可做出什麼?
     
      例如:wireless遊戲、搖桿遊戲、生活應用的東西、互動機器人。


2、找Arduino應用的影片。

 


 
 
 
 
 
 
 
 

2012年11月13日 星期二

Midterm

期中作品

影片



截圖


一開始的畫面
滑鼠點選"開始遊戲"後,切換到"鐵板"的畫面

滑鼠點選"遊戲說明"後,切換到"遊戲說明"的畫面
 
製作章魚燒的鐵板


Time's up  &  Game Over的畫面
(滑鼠點選"離開遊戲"後,切換到這個畫面) 




 程式碼

float r=0.01;
int savedTime; //計時器時間
int bg=1;
PImage bg1, vv, pp, over, e, fff, tako1, all;
int state=0;
int ellipse1 = 0;


void setup() {
  size(800, 600);
  savedTime = millis();  //儲存遊戲開始的時間(只執行一次)
  bg1 = loadImage("bg1.jpg");
  vv = loadImage("vv.jpg");
  pp = loadImage("pp1.jpg");
  over = loadImage("bg4.jpg");
  e = loadImage("turtle.jpg");
  fff = loadImage("fff.jpg");
  tako1 = loadImage("tako1.jpg");
  all = loadImage("06.jpg");
}

void draw() {
  println(mouseY);
  if (bg==1) {
    image(bg1, 0, 0, 800, 600);  //一開始執行的畫面
    if (mousePressed && mouseX>=555 && mouseX<=794 && mouseY>=261 && mouseY<=396) {
      image(pp, 0, 0);
      bg=2;  //滑鼠點選"開始遊戲"後,切換到"鐵板"的畫面
    }
    else if (mousePressed && mouseX>=550 && mouseX<=800 && mouseY>=420 && mouseY<=550) {
      bg=3;  /滑鼠/點選"遊戲說明"後,切換到"遊戲說明"的畫面
    }
  }
  if (bg==3) {
    image(vv, 0, 0, 800, 600);  //"遊戲說明"的畫面
    if (mousePressed && mouseX>=255 && mouseX<=465 && mouseY>=498 && mouseY<=594) {
      image(pp, 0, 0, 800, 600);
      bg=2;  //滑鼠點選"開始遊戲"後,切換到"鐵板"的畫面
    }
  }

  if (bg==2) {  //鐵板的畫面
    int passedTime = (millis() - savedTime)/100; //經過的秒數
    if (passedTime<600) {
      image(e, 683, passedTime, 120, 98);
    }
    else if (passedTime>=600) image(over, 0, 0, 800, 600);
    println(passedTime);
    if (mousePressed && mouseX>=485 && mouseX<=645 && mouseY>=542 && mouseY<=584) {
      image(over, 0, 0);
      bg=4;  //遊戲結束的畫面
    }
    if (mousePressed && mouseX>50 && mouseX<90 && mouseY>500 && mouseY<540) { 
      state = 1;
    }
    if (mousePressed && mouseX>150 && mouseX<190 && mouseY>500 && mouseY<540) {
      state = 2;
    }
    if (mousePressed && mouseX>250 && mouseX<290 && mouseY>500 && mouseY<540) {
      state = 3;
    }
    if (mousePressed && mouseX>350 && mouseX<390 && mouseY>500 && mouseY<540) {
      state = 4;
    }
    if (state == 1) {
      if (mousePressed && mouseX>40 && mouseX<160 && mouseY>40 && mouseY<160) {
        if (passedTime<100) {
          fill(239, 228, 176);  //白
          ellipse(100, 100, 120, 120);
        }
        else if (passedTime>=100 && passedTime<150) {
          fill(235, 194, 102);  //黃
          ellipse(100, 100, 120, 120);
        }
        else if (passedTime>=150) {
          fill(223, 147, 51);  //熟
          ellipse(100, 100, 120, 120);
        }
      }
      else if (mousePressed && mouseX>40 && mouseX<160 && mouseY>190 && mouseY<310) {
        if (passedTime<100) {
          fill(239, 228, 176);  //白
          ellipse(100, 250, 120, 120);
        }
        else if (passedTime>=100 && passedTime<150) {
          fill(235, 194, 102);  //黃
          ellipse(100, 250, 120, 120);
        }
        else if (passedTime>=100) {
          fill(223, 147, 51);  //熟
          ellipse(100, 250, 120, 120);
        }
      }
      else if (mousePressed && mouseX>40 && mouseX<160 && mouseY>340 && mouseY<460) {
        if (passedTime<100) {       
          fill(239, 228, 176);  //白
          ellipse(100, 400, 120, 120);
        }
        else if (passedTime>=100 && passedTime<150) {
          fill(235, 194, 102);  //黃
          ellipse(100, 400, 120, 120);
        }
        else if (passedTime>=150) {
          fill(223, 147, 51);  //熟
          ellipse(100, 400, 120, 120);
        }
      }
      else if (mousePressed && mouseX>190 && mouseX<310 && mouseY>40 && mouseY<160) {
        if (passedTime<100) {
          fill(239, 228, 176);  //白
          ellipse(250, 100, 120, 120);
        }
        else if (passedTime>=100 && passedTime<150) {
          fill(235, 194, 102);  //黃
          ellipse(250, 100, 120, 120);
        }
        else if (passedTime>=150) {
          fill(223, 147, 51);  //熟
          ellipse(250, 100, 120, 120);
        }
      }
      else if (mousePressed && mouseX>190 && mouseX<310 && mouseY>190 && mouseY<310) {
        if (passedTime<100) {        
          fill(239, 228, 176);  //白
          ellipse(250, 250, 120, 120);
        }
        else if (passedTime>=100 && passedTime<150) {
          fill(235, 194, 102);  //黃
          ellipse(250, 250, 120, 120);
        }
        else if (passedTime>=150) {
          fill(223, 147, 51);  //熟
          ellipse(250, 250, 120, 120);
        }
      }
      else if (mousePressed && mouseX>190 && mouseX<310 && mouseY>340 && mouseY<460) {
        if (passedTime<100) {         
          fill(239, 228, 176);  //白
          ellipse(250, 400, 120, 120);
        }
        else if (passedTime>=100 && passedTime<150) {
          fill(235, 194, 102);  //黃
          ellipse(250, 400, 120, 120);
        }
        else if (passedTime>=150) {
          fill(223, 147, 51);  //熟
          ellipse(250, 400, 120, 120);
        }
      }
      else if (mousePressed && mouseX>340 && mouseX<460 && mouseY>40 && mouseY<160) {
        if (passedTime<100) { 
          fill(239, 228, 176);  //白
          ellipse(400, 100, 120, 120);
        }
        else if (passedTime>=100 && passedTime<150) {
          fill(235, 194, 102);  //黃
          ellipse(400, 100, 120, 120);
        }
        else if (passedTime>=150) {
          fill(223, 147, 51);  //熟
          ellipse(400, 100, 120, 120);
        }
      }
      else if (mousePressed && mouseX>340 && mouseX<460 && mouseY>190 && mouseY<310) {
        if (passedTime<100) { 
          fill(239, 228, 176);  //白
          ellipse(400, 250, 120, 120);
        }
        else if (passedTime>=100 && passedTime<150) {
          fill(235, 194, 102);  //黃
          ellipse(400, 250, 120, 120);
        }
        else if (passedTime>=150) {
          fill(223, 147, 51);  //熟
          ellipse(400, 250, 120, 120);
        }
      }
      else if (mousePressed && mouseX>340 && mouseX<460 && mouseY>340 && mouseY<460) {
        if (passedTime<100) { 
          fill(239, 228, 176);  //白
          ellipse(400, 400, 120, 120);
        }
        else if (passedTime>=100 && passedTime<150) {
          fill(235, 194, 102);  //黃
          ellipse(400, 400, 120, 120);
        }
        else if (passedTime>=150) {
          fill(223, 147, 51);  //熟
          ellipse(400, 400, 120, 120);
        }
      }//第三排
    }

    //手(加章魚至麵糊)
    if (state == 2) {
      if (mousePressed && mouseX>40 && mouseX<160 && mouseY>40 && mouseY<160) {
        image(tako1, 70, 70, 65, 65);
      }
      else if (mousePressed && mouseX>40 && mouseX<160 && mouseY>190 && mouseY<310) {
        image(tako1, 70, 220, 65, 65);
      }
      else if (mousePressed && mouseX>40 && mouseX<160 && mouseY>340 && mouseY<460) {
        image(tako1, 70, 370, 65, 65);
      }
      else if (mousePressed && mouseX>190 && mouseX<310 && mouseY>40 && mouseY<160) {
        image(tako1, 220, 70, 65, 65);
      }
      else if (mousePressed && mouseX>190 && mouseX<310 && mouseY>190 && mouseY<310) {
        image(tako1, 220, 220, 65, 65);
      }
      else if (mousePressed && mouseX>190 && mouseX<310 && mouseY>340 && mouseY<460) {
        image(tako1, 220, 370, 65, 65);
      }
      else if (mousePressed && mouseX>340 && mouseX<460 && mouseY>40 && mouseY<160) { 
        image(tako1, 370, 70, 65, 65);
      }
      else if (mousePressed && mouseX>340 && mouseX<460 && mouseY>190 && mouseY<310) { 
        image(tako1, 370, 220, 65, 65);
      }
      else if (mousePressed && mouseX>340 && mouseX<460 && mouseY>340 && mouseY<460) {
        image(tako1, 370, 370, 65, 65);
      }
    }
  
   //叉子   
    if (state == 3) {
      if (mousePressed && mouseX>40 && mouseX<160 && mouseY>40 && mouseY<160) {
        fill(43);
        ellipse(100, 100, 120, 120);
        image(fff, 510, 280, 50, 50);
      }
      else if (mousePressed && mouseX>40 && mouseX<160 && mouseY>190 && mouseY<310) {
        fill(43);
        ellipse(100, 250, 120, 120);
        image(fff, 560, 280, 50, 50);
      }
      else if (mousePressed && mouseX>40 && mouseX<160 && mouseY>340 && mouseY<460) {
        fill(43);
        ellipse(100, 400, 120, 120);
        image(fff, 560, 330, 50, 50);
      }
      else if (mousePressed && mouseX>190 && mouseX<310 && mouseY>40 && mouseY<160) {
        fill(43);
        ellipse(250, 100, 120, 120);
        image(fff, 510, 330, 50, 50);
      }
      else if (mousePressed && mouseX>190 && mouseX<310 && mouseY>190 && mouseY<310) {
        fill(43);
        ellipse(250, 250, 120, 120);
        image(fff, 510, 380, 50, 50);
      }
      else if (mousePressed && mouseX>190 && mouseX<310 && mouseY>340 && mouseY<460) {
        fill(43);
        ellipse(250, 400, 120, 120);
        image(fff, 560, 380, 50, 50);
      }
      else if (mousePressed && mouseX>340 && mouseX<460 && mouseY>40 && mouseY<160) { 
        fill(43);
        ellipse(400, 100, 120, 120);
        image(fff, 560, 430, 50, 50);
      }
      else if (mousePressed && mouseX>340 && mouseX<460 && mouseY>190 && mouseY<310) { 
        fill(43);
        ellipse(400, 250, 120, 120);
        image(fff, 510, 430, 50, 50);
      }
      else if (mousePressed && mouseX>340 && mouseX<460 && mouseY>340 && mouseY<460) {
        fill(43);
        ellipse(400, 400, 120, 120);
        image(fff, 535, 480, 50, 50);
      }
    }//state3
    if (state == 4) {
      //background(96,125,165);
      translate(400, 300);
      rotate(r);
      r+=0.01;
      image(all, 0, 0, 300, 383);
      //image(over, 0, 0, 800, 600);
    }
  }
}



心得及問題討論

  我們這次的期中作業遇到了麵糊變換顏色時間倒數的問題,後來請教老師跟助教,
有了一點方向,經過不斷的嘗試跟調整,我們終於完成了麵糊可以從白色→黃色→褐色(時間約經過15秒),但是我們原本的想法是希望麵糊每經過10秒後會自己變色
另外,我們了解到秒數的倒數計時程式不可以用second(),而是要用millis()千分之一秒。
  計時器部分,我們原本希望可以用兩個clock來紀錄不同的時間(烏龜的倒數計時,與麵糊改變顏色的計時),這是我們需要改進的地方。

  問題:我們目前只能完成一盒章魚燒,希望能繼續延伸製作第二盒甚至更多章魚燒。
物件及畫面可以再做調整,並需要加入更多限制使遊戲更完整、更有挑戰性。



2012年10月30日 星期二

Week08,HW08

1. 請寫下以下資料:
1.1. 你之前完成了什麼?
      
       我們之前完成了烤章魚燒的烤盤。

1.2. 你今天計畫要做什麼?

       我們今天計畫完成
       (1)切換畫面(從一開始的畫面→點選"開始遊戲" → 切換到烤章魚燒烤盤的畫面)。
       (2)工具列(麵糊、叉子、刷子、手)。 
       (3)章魚燒可以成功變色(漸層變色,變色是用計時器來控制)
            白色 → 黃色(麵糊開始變色)
                     → 褐色(章魚燒成功的顏色)
                     → 黑色(章魚燒失敗的顏色,焦掉)。 
       (4)用小烏龜的移動代表時間的倒數。

1.3. 可能會遇到的問題... (及可能的解決方法)

       我們在麵糊變色遇到了很大的困難,花了我們很多時間去調整RGB數值,但是都沒有很
      成功。
      後來我們請教助教,顏色終於比較像了,在助教的幫忙下,有了計時器和漸層的功能。
     

2. 請把你目前期中作品的進度貼出來
 
一開始的畫面

點選"遊戲開始"後切換的畫面
小烏龜代表時間的倒數(時間一點一滴的流逝~~)
倒入麵糊、麵糊變色(變色是用計時器來控制)、
小烏龜的移動(時間在倒數)的畫面

2012年10月29日 星期一

week7 視訊

//小葉老師最短的視訊
import processing.video.*;
Capture video;
void setup(){
  size(640,480,P2D);
  video = new Capture(this, width, height);
  video.start();
  loadPixels();
}
void draw(){
  if(video.available()){
    video.read();
    video.loadPixels();
    for(int i=0;i<640*480;i++){
      pixels[i]=video.pixels[i];      
    }
    updatePixels();
  }




我們可愛的組員及頭上長花反串同學 XD


臉臭臭的組員在認真上課中 

 

2012年10月16日 星期二

Week06,HW06

TODO: "看" 別人的 HW05 的作品

TODO: HW06第一部分: "寫"作品建議, 讚美、寫賣點

邱舒曼:
感覺很好玩又緊張,如果滑鼠不小心碰到山壁,人就死掉了,富挑戰性。希望他們那組會成功。
林雨辰:
擠痘痘的遊戲感覺很生活化,再搭配感應手套感覺更真實。

TODO: HW06第二部分: 今天的進度: 做期中作品 --- 與 99160743 紀詠心 同組
(a) 素材
(b) 想流程,很細地寫下步驟
(c) 試 code 看想法是否可行
(a) 素材:
背景↓

工具列有麵糊、章魚、叉子、刷子、手,鐵板,顧客、暫停鍵、音樂鍵,盒子。


(b) 想流程,很細地寫下步驟:

章魚燒麵糊的顏色:由白色→淺黃色(未烤熟)→褐色(已烤熟)→黑色(焦掉)。
餡料:章魚、青菜。
叉子:可以翻面、將已烤好的章魚燒移至盤子。
刷子:塗醬料(原味、芥末口味)。
手:將已完成的章魚燒遞給客人。
顧客:點餐區、等候區。
暫停鍵:玩家可在不想玩的時候按下暫停鍵,休息一下。
音樂鍵:可以玩家喜好,播放音樂,或不播放音樂。

分數計算:計算在時間內製作完成的章魚燒總數量。

2012年10月9日 星期二

Week05,HW05

 HW05
作業5-1: 會自己動
程式碼↓
 
void setup(){
  size(600,600);
  //background(255,223,239);
}
float rrr=0.01,rr=0.00001;//旋轉
void draw(){
  background(255,223,239);
  fill(255,154,201);
  ellipse(295, 300, 132, 132);
  translate(300,300);//移動
  fill(182,90,180);
  for(int i=0;i<16;i++){
    rotate(rrr);rrr+=0.0001;//旋轉
    rotate( PI/8);//PI=180
    triangle(30, 55, 58, 30, 90, 65);
    }
  fill(128,0,255);
  for(int i=0;i<32;i++){
    rotate( PI/16);
    triangle(70, 55, 58, 30, 90, 65);
    }
  fill(255,0,0);
  for(int i=0;i<36;i++){
    rotate(rr);rr+=0.00000001;//旋轉
    rotate( PI/18);
    ellipse(80,150,180,20);
   }
}
 
作業5-2: 會和你互動
程式碼↓
 
import ddf.minim.*; //music
import ddf.minim.analysis.*; //music
Minim minim; //music
AudioPlayer song; //music
 
void setup(){

  minim = new Minim(this); //music
  song = minim.loadFile("marcus_kellis_theme.mp3", 2048); //music
  song.play(); //music

size(600,600);
  //background(255,223,239);
}
float rrr=0.01,rr=0.00001;//旋轉
void draw(){
  background(255,223,239);//畫面更新,不會有殘影
  translate(mouseX,mouseY);//移動
  //fill(255,154,201);
  //ellipse(mouseX,mouseY, 132, 132);
  fill(182,90,180);
  for(int i=0;i<16;i++){
    rotate(rrr);rrr+=0.0001;//旋轉
    rotate( PI/8);//PI=180
    triangle(30, 55, 58, 30, 90, 65);
    }
  fill(128,0,255);
  //fill(random(255),random(255),random(255));
  for(int i=0;i<32;i++){
    rotate( PI/16);
    triangle(70, 55, 58, 30, 90, 65);
    }
  fill(0,128,255);
  fill(random(255),random(255),random(255));//顏色 亂數
  for(int i=0;i<36;i++){
    rotate(rr);rr+=0.000001;//旋轉
    rotate( PI/18);
    ellipse(80,150,180,20);
   }
}
 
作業5-3: 期中作品你想做什麼 (請放圖、放文字) ---與 99160743 紀詠心 同組
 
製作章魚燒
 
 
http://game.sina.com.tw/littlegame/flash_show.php?id=10597

遊戲介紹:
顧客來的時候會顯示她要幾個章魚燒 →
滑鼠點左下角第一個水壺圖案 →
滑鼠點鐵板中的圓洞倒入麵糊 →
滑鼠點第二個章魚圖案放在麵團上 →
滑鼠點第三個叉子圖案翻面 →
章魚燒變褐色後,滑鼠點第三個叉子圖案,點擊變褐色後的章魚燒(會自動跑到盤子上) →
滑鼠點第四個醬料圖案的刷子,給盤子上的章魚燒上醬料 →
全部章魚燒上完醬料後 →
滑鼠點第五個手的圖案遞給顧客。

章魚燒少做顧客不給錢,多做也不多給錢,
所以要按照她的要求來做。

點第一個韓語按鈕開始。


2012年10月2日 星期二

Week04,HW04

作業4-1  製作自己的小畫家:
程式碼↓

void setup(){
  size(600,500);
  background(239,228,176);
  fill(237,28,36);//紅色
  rect(0,0,50,50);
  fill(255,127,39);//橙色
  rect(0,50,50,50);
  fill(255,242,0);//黃色
  rect(0,100,50,50);
  fill(34,177,76);//綠色
  rect(0,150,50,50);
  fill(0,162,232);//藍色
  rect(0,200,50,50);
  fill(163,73,164);//紫色
  rect(0,250,50,50);
  fill(255,255,255);//白色
  rect(0,300,50,50);
  fill(0,0,0);//黑色
  rect(0,350,50,50);
  fill(255,174,201);//淡粉色---存檔
  rect(0,400,50,50);
  fill(200,191,231);//淡紫色---讀檔
  rect(0,450,50,50);
  fill(255,255,255);//白色
  rect(550,0,50,50);//右1框框---變粗
  fill(0,0,0);
  ellipse(575,25,30,30);
  fill(255,255,255);//白色
  rect(550,50,50,50);//右2框框---變粗
  fill(0,0,0);
  ellipse(575,75,10,10);
}
int www=5;
void draw(){
  if(mousePressed && mouseX<50 && mouseY<50) stroke(237,28,36);//滑鼠觸碰後---紅色
  else if(mousePressed && mouseX<50 && mouseY<100) stroke(255,127,39);//滑鼠觸碰後---橙色
  else if(mousePressed && mouseX<50 && mouseY<150) stroke(255,242,0);//滑鼠觸碰後---黃色
  else if(mousePressed && mouseX<50 && mouseY<200) stroke(34,177,76);//滑鼠觸碰後---綠色
  else if(mousePressed && mouseX<50 && mouseY<250) stroke(0,162,232);//滑鼠觸碰後---藍色
  else if(mousePressed && mouseX<50 && mouseY<300) stroke(163,73,164);//滑鼠觸碰後---紫色
  else if(mousePressed && mouseX<50 && mouseY<350) stroke(255,255,255);//滑鼠觸碰後---白色
  else if(mousePressed && mouseX<50 && mouseY<400) stroke(0,0,0);//滑鼠觸碰後---黑色
  else if(mousePressed && mouseX<50 && mouseY<450) save("99160494.png");//滑鼠觸碰後---存檔
  else if(mousePressed && mouseX<50 && mouseY<500) {
    PImage file = loadImage("99160494.png");
    image(file, 0,0,600,500);
  }//滑鼠觸碰後---讀之前存的檔---復原
  else if(mousePressed && mouseX>450 && mouseY<50){
    strokeWeight(++www);
  }
  else if(mousePressed && mouseX>450 && mouseY<100){
    strokeWeight(--www);
    if(www<2)www=2;
  }
  else if(mousePressed)  line(mouseX, mouseY, pmouseX, pmouseY);//滑鼠觸碰後,不會亂跑
}


 
 
作業4-2 心得:
 
這禮拜學習製作自己的小畫家。
我自己的小畫家左邊色彩有:紅色、橙色、黃色、綠色、藍色、紫色、白色、黑色。
粉紅色是存檔、紫色是復原。
右邊第一個格的功能是加粗,第二個功能是變細。但是要注意,當點擊變粗的格子時,不要點擊太久,不然會變太粗。
自己做的小畫家很好玩,可以依自己的想法製作不同的需求。
而我自己也畫了兩張很像小朋友畫的圖。
我也有把這個小畫家給朋友畫畫看,他們說還不錯玩,很有趣。

2012年9月25日 星期二

Week03,HW03

作業3-1  跟著滑鼠動:
程式碼↓

void setup(){
  size(600,600);
  background(230,130,223); //背景色
}
void draw(){
  fill(100,100,100);
  rect(100,100,100,100);
  fill(255,255,0);
  ellipse(mouseX,mouseY,100,100);  //跟著滑鼠動
}

作業3-2  追著滑鼠跑:
程式碼↓

void setup(){
size(600,600);
//frameRate(1);
}
float x=100,y=100;
void draw(){
  background(250,100,223); //背景色 (在此處是刷新的意思)
  fill(255,255,0);
  ellipse(mouseX,mouseY,120,70);  //跟著滑鼠動
  fill(0,255,255);
  rect(y, 20, x, y);
  fill(0,110,70);
  triangle(30, x, 58, y, x, y);
  //rect(y,x,100,100);
  //x=(x+mouseX)/2;
  //y=(y+mouseY)/2;
  x=x*0.9+mouseX*0.1;
  y=y*0.9+mouseY*0.1;
}



作業3-3  心得:
 
這禮拜學了跟著滑鼠動和追著滑鼠跑,很好玩,想做不同的圖案跟變化,可是課堂時間很少。

2012年9月18日 星期二

Week02,HW02

作業2-1  5行產生50個方塊:

程式碼↓

size(600,600);
for(int i=0; i<50; i++){
  fill(random(255),random(255),random(255));
  rect(random(400),random(400),random(500),random(500));//random是亂數,rect是四邊形
}


作業2-2  漸層:

程式碼↓

size(800,600);
for(int i=0;i<40;i++){
   for(int j=0;j<20;j++){
     for(int k=0;k<40;k++){
        fill(i*255/50,j*255/10,k*255/10);
        quad(i*38, k*31, 86, 20, 69, 63, 30, 90);
      }
   }
}



作業2-3  很多大眼睛:

程式碼↓

size(800,600);
background(250,100,0);
noStroke();
for(int i=0;i<4;i++){
    for(int j=0;j<3;j++){
      fill(i*255/5,j*255/4,10);
      ellipse(i*200+100, j*200+100, 200, 200);
      fill(i*255/4,j*255/3,10);
      ellipse(i*200+100, j*200+100, 200, 100);
      fill(i*255/3,j*255/2,10);
      ellipse(i*200+100, j*200+100,100,100);
     }
}


作業2-4  心得:

這週學到了用5行程式就可以產生50個方形、兩個for迴圈的用法、顏色漸層的用法。
我覺得2-2比較好玩,我用了quad的程式+不斷的改變數字產生了特別的形狀。
數值的大小,會使形狀變得密集或不密集。