mblock 아두이노 조이스틱 제어(미로게임 만들기)

Posted by JaGG
2018. 5. 28. 11:43 카테고리 없음

오늘은 아두이노에 사용하는 센서 중 가장 흥미로운 센서인 조이스틱을 다루어 보도록 하겠습니다.


먼저 목차로는

 1. 조이스틱에 대해서

2. 회로 스케치 및 브래드보드 레이아웃

3. 미로게임 만들기

4. Mblock으로 미로게임 코딩하기


로 진행하겠습니다.


1. 조이스틱 모듈



    


먼저 조이스틱 모듈은 다음과 같이 생겼습니다. 첫번째 사진 조이스틱 커버를 보면 우리가 흔히 볼 수 있는 게임기의 조이스틱이 있습니다.


이 조이스틱 모듈 안쪽에는 x, y축의 변화량에 따라 아날로그 값으로 출력이 되고 하나의 푸쉬버튼으로 구성이 되어 있습니다.


아날로그 출력 2핀, 버튼 1핀, Vcc, GND 까지 총 5개의 핀을 가집니다.



2. 회로스케치 및 브래드보드 레이아웃



회로도


브래드보드 레이아웃



부품과 아두이노 사이에 연결은 크게 어려운 부분은 없으리라고 생각이 듭니다. 


모듈의 Vcc, GND는 아두이노 +, -에 x, y 이동값에 대한 출력핀은 아날로그핀 A0, 1에 연결하면 됩니다.


남은 하나의 핀은 버튼에 대한 핀인데 일단 오늘은 사용하지 않습니다.


하지만 버튼까지 사용을 해야 한다면 버튼핀을 디지털핀에 연결한 뒤에 아두이노에서 버튼과 같은 방식으로 제어하면 됩니다.



3. Mblock을 이용하여 미로게임 만들기


지금까지 조이스틱을 제어하기 위한 방법에 대해서 살펴보았습니다. 


이 조이스틱과 엠블럭(Mblock)을 이용해서 간단한 게임을 만들어 보겠습니다.


먼저 엠블록을 실행합니다.




가장 먼저 연결된 아두이노의 시리얼 포트를 잡아줍니다. 


연결 > 시리얼포트 에서 컴퓨터에 연결된 포트를 볼 수 있습니다.



다음으로 사용하고 있는 아두이노 보드를 설정합니다.


저는 아두이노 우노 보드를 사용하고 있기 때문에 "Arduino UMO"를 선택 했습니다.



그리고 연결에서 "펌웨어 업그레이드"를 클릭해서 아두이노 보드에 Mblock펌웨어를 다운받습니다.


s4a에서 아두이노 펌웨어를 다운받고 시작하는것과 같은 원리 입니다.


이 펌웨어를 다운받지 않으면 엠블럭에서 아두이노의 블록의 기능을 사용 할 수 없습니다.


기능은 활성화되지 않지만 블록은 활성화가 되어 있기 때문에 처음 시작하시는 분들은 여기서 아두이노가 동작하지 않아 혼등을 겪을수도 있습니다.



펌웨어까지 업로드 받았다면 기능이 정상적으로 활성화 되고 있는지 살펴보겠습니다.


위의 사진과 같이 클릭 했을때 아날로그 1번핀에 값을 말하기 라고 간단하게 코딩 해보았습니다.


그러니 팬더가 현재 연결된 센서(조이스틱 x축)값을 출력하는것을 볼 수 있습니다.


여기까지 세팅이 완료 되어야만 정상적인 엠블록 코딩이 가능해 집니다.



한가지 더 팁을드리면 굳이 센서값을 말하라는 코딩을 하지않아도 블록목록에 "아날로그x값 읽기"블록을 클릭하면 위와 같이 센서값이 블록에 출력이 됩니다.


하지만 이 값은 변동되지 않고 출력되는 값 또한 위와 같이 40 정도의 오차를 가지는 모습입니다.


지금까지 엠블록을 이용한 코딩을 하기위한 초기 설정을 해보았습니다.


그리고 게임을 본격적으로 코딩하기 이전에 한가지 더 세팅 해야할 부분이 있습니다.


바로 배경과 스프라이트를 만드는 것입니다.


엠블록을 처음 실행하면 배경은 흰색배경에 스프라이트는 시그니처 케릭터인 팬더가 있습니다. 


미로게임을 만들기 위하여 배경에 미로를 만들고 스프라이트의 크기를 줄여주는 작업이 필요합니다.


먼저 배경설정에서 "배경 새로그리기"버튼을 클릭합니다.



그러면 다음과 같이 배경을 그릴 수 있는 페이지로 이동이 됩니다.


여기서 선을 선택하고 선 굵기를 적절하게 선택한 후 사진과 같이 배경에 선을 그어줍니다.


직각의 선을 그을때는 shift를 누른채로 선을 그으면 됩니다.



이렇게 대략적인 미로 배경이 완성되었습니다.



다음으로 팬더 스프라이트가 미로에 비해 크기가 크기 때문에 스프라이트의 크기를 출여야 합니다.


스프라이트의 모양에 들어가서 팬더 그림을 클릭하면 쉽게 크기를 줄이고 늘릴 수 있습니다.



4. Mblock으로 미로게임 코딩하기


엠블록과 아두이노의 연결, 펨웨어 업그레이드, 보드의 동작상태를 확인하고,


스프라이트와 배경의 세팅이 완료되면 지금부터 코딩을 시작합니다.


미로게임을 하기 위해서 필요한 기능은 크게


1. 조이스틱으로 스프라이트 움직이기

2. 미로 안에서 스프라이트가 벽을 넘지 못하게 하기

3. 출발선과 도착선 만들기

4. 목숨을 설정해서 게임의 긴장도 높이기

5. 미로 사이에 아이템을 배치하기


엠블록 코딩에 대해서는 블록 하나하나 설명하는 것 보다 소스코드를 직접 보는것이 더 이해가 빠르기 때문에 완성된 코드만 보여드리는 것으로 코딩 설명은 길게 하지 않겠습니다.

먼저 제가 만든 미로 배경입니다.


게임의 완성도를 높이기 위한 바나나 아이템도 게임에 넣어서 만들었습니다.


이렇게 작은 기능을 하나하나 추가 함으로써 작품이 더 높은 완성도를 가지게 되는 것입니다.


판다 스프라이트 코딩


바나나 아이템 스프라이트 코딩



아두이노 LED, 버튼 제어하기

Posted by JaGG
2018. 5. 21. 18:03 카테고리 없음

오늘은 아두이노 기초 LED와 버튼을 함께 제어하는 방법에 대해서 살펴보겠습니다.


아두이노 제어에서 LED제어는 c언어에서 Hello World문을 출력하는것과 같은 기초 필수코스라고 볼 수 있습니다.


그 이유는 C언어의 문자열 출력문과 같이 이후에 가장 많이 사용되는 개념이기 때문입니다.


오늘 LED와 버튼을 제어하기 위해서 살펴볼 목차는 다음과 같습니다.


 1. LED와 버튼의 특징

2. 아두이노 회로 만들기

3. 아두이노 스케치 소스코드 만들기

4. Mblock 블록코딩으로 소스코드 만들기



1. LED와 버튼의 특징 및 사용방법



발광 다이오드(發光diode)는 순방향으로 전압을 가했을 때 발광하는 반도체 소자이다. LED(Light Emitting Diode)라고도 불린다. 발광 원리는 전계 발광효과를 이용하고 있다. 또한 수명도 백열등보다 더 길다.


위는 위키백과에서 소개하고 있는 LED에 대한 간단한 설명입니다.


LED를 사용하기 위해서는 부품 그리고 회로에서 어느부분이 Vcc인지 GND인지 정확하게 알고 사용을 해야합니다.


극성을 모르고 연결한다면 LED가 동작하지 않기 때문에 필수적으로 이 부분에 대한 선행학습이 먼저 되어야 합니다.


LED는 두개의 다리를 가지고 있으며 각 다리의 길이가 다른데 대표적으로 이 다리의 길이를 통해서 극성을 파악할 수 있습니다.


LED의 다리중 긴쪽이 +(Vcc) 짧은쪽이 -(GND)입니다.


그리고 만약 다리를 잘라서 이후에 다리길이가 똑같아 졌을 경우, 이때는 다리길이를 통한 극성파악은 불가능해집니다.


그럴때는 LED의 내부를 살펴봄으로써 극성을 찾아낼 수 있습니다.


내부를 살펴보면 위의 그림과 같이 +부분에 ( l )형태 -부분에 (ㄱ)형태로 되어있는 것을 확인 할 수 있습니다.


이 때 ㄱ형태로 되어있는 부분이 -(GND)라는것을 확인 하실 수 있습니다.


  

출처 :  www.directindustry.com & 코코아팹


다음은 버튼에 대한 설명을 드리겠습니다.


버튼은 아두이노 뿐만아니라 우리 생활에서도 땔수 없는 대표적인 부품중에 하나 입니다.


실생활 어디를 보더라도 버튼이 있는것을 확인 하실 수 있습니다. 스마트폰, 전등 등등


실생활에 필수적인 부품인 만큼 아두이노에서 프로젝트를 설계할 때도 절대로 빠질 수 있는 대표적인 부품이 버튼 입니다.

그렇다면 버튼은 어떻게 사용해야 할까요?


위에서 LED는 두개의 다리가 극성을 가지는 특성을 가지고 있었습니다.


그렇다면 버튼도 극성을 가지고 있을까요? 그렇지 않습니다. LED처럼 전기를 받아야 동작하는 부품의 경우에는 극성을 가지지만 버튼은 전기가 흐르는 선의 중간에서 연결과 단락의 역할을 할 뿐 전기적인 입력이 필요 없기 때문에 극성은 따로 존재하지 않습니다.


하지만 그렇다고 해서 버튼의 다리가 가지는 특성을 알 필요가 없는것은 아닙니다.


버튼의 사용방법을 모른다면 위의 그림의 뜻이 이해가 되지 않을것 입니다.


위의 그림과 같이 버튼은 4개의 다리를 가집니다. 하지만 여기서 회로에 연결하기 위해 필요한 다리는 단 2개 입니다.


즉 A, C와 B, D의 다리는 서로 연결이 되어 있다는 뜻입니다.


따라서 A, C중에서 하나 B, D다리 중에서 하나를 무작위로 선택해서 사용하면 된다는 뜻입니다.


그러면 위에 사진에서 버튼의 회로표기법에 대해서 이해가 가실것입니다.




2. 버튼, LED로 아두이노 회로 만들기 



다음은 위에서 살펴본 부품을 이용해서 아두이노 회로를 구성해 보도록 하겠습니다.


먼저 회로를 구성하기 위해서 필요한 부품은 아두이노 우노보드, LED, 버튼, 저항(330), 저항(10k), 브래드보드와 점프선 입니다.


 

 

 


 


 


 



회로의 구성을 위해서 먼저 회로도와 연결된 결과의 이미지를 보여 드리겠습니다.



위의 사진은 아두이노와 버튼, LED의 회로도 입니다. 전자를 처음 접하시는 메이커스 분들은 생소 하실 수 있지만 익숙해 지셔야 합니다.




위에서 살펴본 회로도를 실제로 연결한 모습입니다.


이 회로를 구성하기 전에 브래드보드의 사용방법을 꼭 숙지 하셔야 합니다.


브래드보드는 위의 사진과 같이 +, - 전원을 연결 할 수 있는 위쪽에 가로줄 그리고 중간에 부품을 연결하는 세로줄로 구성이 되어 있습니다.


위쪽에 두 줄은 각각 내부적으로 가로로 쭉 연결이 되어 있습니다. 즉 파란색 줄은 처음부터 끝까지 연결된 것이고,


두번째 빨간색 줄 역시 가로로 쭉 연결된 것입니다.


그리고 중간에 있는 칸들은 가로가 아닌 세로로 즉 세로 한줄(5칸)이 하나로 연결되어 있는 것입니다.



위에서 만들었던 버튼, LED를 3개씩 회로에 구성하면 다음과 같은 결과물이 만들어집니다.


하나씩 연결된 회로를 먼저 보여드린 이유는 처음 접하시는 분들이 이렇게 많이 연결된 회로를 보면 간단해도 햇갈리는 경우가 많기 때문입니다.



바로 위에 있는 회로를 실제로 만든 모습입니다.


브래드보드는 제품을 만드는 단계에서 최소의 비용으로 테스트 해볼 수 있다는 장점을 가지고 있지만, 반면에 사진과 같이 보기 좋지 않다는 것이 가장 큰 단점입니다.



LED와 저항이 위의 회로와 같이 연결된것을 확인 하실 수 있습니다.



마찬가지로 버튼 역시 회로도와 똑같이 만들어진 모습입니다.



3. 아두이노 스케치 소스코드 만들기



int Button1 = 8, Button2 = 9, Button3 = 10;        //디지털 연결핀 8, 9, 10을 버튼 1, 2, 3으로 정의

int LED_R = 3, LED_G = 4, LED_B = 5;                  //디지털 연결핀 3, 4, 5을  LED 1, 2, 3으로 정의


void setup() {

  pinMode(Button1, INPUT);                                //디지털 핀의 모드를 버튼은 입력 LED는 출력으로 설정

  pinMode(Button2, INPUT);

  pinMode(Button3, INPUT);

  pinMode(LED_R, OUTPUT);

  pinMode(LED_G, OUTPUT);

  pinMode(LED_B, OUTPUT);

}


void loop() {


  digitalWrite(LED_R, HIGH);                                //LED가 연결된 핀에 HIGH(1)로 세팅함으로써 LED가 켜진다.

  digitalWrite(LED_G, HIGH);

  digitalWrite(LED_B, HIGH);


  delay(1000);


  digitalWrite(LED_R, LOW);                                //LED가 연결된 핀에 LOW(0)로 세팅함으로써 LED가 꺼진다.

  digitalWrite(LED_G, LOW);

  digitalWrite(LED_B, LOW);


  delay(1000);                                                      // 1000ms(1초) 동안 대기한다.

}


위의 코드는 아두이노 스케치로 작성한 가장 기본적인 소스코드 입니다.


아래는 이 프로젝트로 할 수 있는 여러가지 프로그램 예제 입니다.


/////////////////////////////예제 2///////////////////////

int Button1 = 8, Button2 = 9, Button3 = 10;

int LED_R = 3, LED_G = 4, LED_B = 5;


void setup() {

  pinMode(Button1, INPUT);

  pinMode(Button2, INPUT);

  pinMode(Button3, INPUT);

  pinMode(LED_R, OUTPUT);

  pinMode(LED_G, OUTPUT);

  pinMode(LED_B, OUTPUT);

}


void loop() {


  int B_1 digitalRead(Button1);

  int B_2 digitalRead(Button2);

  int B_3 digitalRead(Button3);


  digitalWrite(LED_R, LOW);

  digitalWrite(LED_G, LOW);

  digitalWrite(LED_B, LOW); 

  

  if(B_1 == 1){

    digitalWrite(LED_R, HIGH);

  }

  else if(B_2 == 1){

    digitalWrite(LED_G, HIGH);

  }

  else if(B_3 == 1){

    digitalWrite(LED_B, HIGH);

  }

  

}


/////////////////////////////예제 3///////////////////////


int Button1 = 8, Button2 = 9, Button3 = 10;

int LED_R = 3, LED_G = 4, LED_B = 5;


void setup() {

  pinMode(Button1, INPUT);

  pinMode(Button2, INPUT);

  pinMode(Button3, INPUT);

  pinMode(LED_R, OUTPUT);

  pinMode(LED_G, OUTPUT);

  pinMode(LED_B, OUTPUT);

}


void loop() {


  int B_1 digitalRead(Button1);

  int B_2 digitalRead(Button2);

  int B_3 digitalRead(Button3);

  

  if(B_1 == 1){

    digitalWrite(LED_R, HIGH);

    digitalWrite(LED_G, HIGH);

    digitalWrite(LED_B, HIGH); 

  }

  else if(B_2 == 1){

    digitalWrite(LED_R, LOW);

    digitalWrite(LED_G, LOW);

    digitalWrite(LED_B, LOW); 

  }

  

}


/////////////////////////////예제 4///////////////////////


int Button1 = 8, Button2 = 9, Button3 = 10;

int LED_R = 3, LED_G = 4, LED_B = 5;

int Button_mode = 0, num = 3;


void setup() {

  pinMode(Button1, INPUT);

  pinMode(Button2, INPUT);

  pinMode(Button3, INPUT);

  pinMode(LED_R, OUTPUT);

  pinMode(LED_G, OUTPUT);

  pinMode(LED_B, OUTPUT);

}


void loop() {


  if(B_1 == 1){

    Button_mode = 1;

  }

  else if(B_2 == 1){

    Button_mode = 2;

  }


  if(Button_mode == 1)

  {

    digitalWrite(LED_R, HIGH);

    digitalWrite(LED_G, HIGH);

    digitalWrite(LED_B, HIGH);


    delay(1000);


    digitalWrite(LED_R, LOW);

    digitalWrite(LED_G, LOW);

    digitalWrite(LED_B, LOW);


    delay(1000);

  }

  else if(Button_mode == 2)

  {

    digitalWrite(num-1, LOW);

    digitalWrite(num, HIGH);

    num++;

    delay(1000);

    if(num == 7)  num = 3;

  }

}



4. Mblock 블럭코드로 소스코드 만들기




위 코드는 Mblock으로 만든 블록코드 입니다.


출력 결과는 위의 아두이노 첫번째 스케치와 완전하게 동일한 결과를 가집니다.


나머지는 아래 예제 2, 3, 4에 대한 Mblock 코드 입니다.


/////////////////////////////예제 2///////////////////////


/////////////////////////////예제 3///////////////////////


/////////////////////////////예제 4///////////////////////








 



아두이노 기초_ 조도(cds)센서 제어하기

Posted by JaGG
2018. 4. 27. 00:35 카테고리 없음





조도센서란?



조도센서는 주변의 밝기를 측정하는 센서입니다.


빛이 입사하면 전도성이 되는 반도체로서, 빛의 세기에 따라 저항 값이 변하는(빛의 세기가 셀수록 저항이 작아진다) 광 가변저항입니다.

일반적으로 Cds(황화카드뮴)를 사용하므로 Cds센서 라고 합니다.

광센서중에 하나로 가장 간단하고 저렴하지만 우리 주변의 많은 곳에 쓰이고 있습니다.


아두이노 조도센서 연결



위의 설명처럼 조도센서는 수많은 광센서 중 가장 간단하고 저렴합니다. 때문에 아두이노 기초 예제 및 간단 프로젝트에는 이 조도센서만한 부품이 없습니다.


조도센서를 테스트 하기위해 아두이노, 조도센서, 저항(10k) 을 준비합니다.


그리고 조도센서의 값에 따른 결과를 직접 확인하기 위한 방안으로 LED를 함께 연결해서 테스트 해보겠습니다. LED저항(330)을 추가로 준비해주세요.


아두이노와 부품 사이의 연결은 위 사진과 같습니다.


먼저 브래드보드 위쪽 Vcc, GND라인과 아두이노 Vcc, GND라인을 연결합니다.

(아두이노에서 +와 - 즉 전원이 출력되는 핀의 개수가 한정적이기 때문에 브래드보드를 이용한 실습시 항상 가장 먼저 해야할 작업이 전원 라인을 연결하는 것입니다.)


다음으로 조도센서저항(10k)를 브래드보드에 그림과 같이 연결합니다. 저항과 센서가 연결된 핀이 밝기값을 출력해주는 데이터핀이 됩니다. 

(조도센서는 극성이 없기 때문에 다리의 방향은 고려하지 않아도 됩니다.)


마지막으로 LED저항(330)을 연결합니다. LED는 조도센서와 반대로 다리의 극성을 가지고 있기 때문에 유의하여 연결해야 원하는 출력을 확인할 수 있습니다.

LED의 -핀은 브래드보드의 GND에 저항핀을 아두이노 데이터핀(그림에서는 pin2)에 연결합니다.

(LED의 극성은 다리가 긴쪽이 "+" 짧은쪽이 "-"입니다.)


아두이노 스케치 코드 



/*

 * 제목 : 아두이노 기초 조도센서 제어하기

 * 내용 : 조도센서를 이용해서 어두워지면 LED가 켜지고 밝아지면 LED가 꺼지도록 한다

 */



int cds_sensor = A0;  //조도센서를 아날로그 A0핀으로 설정

int LED = 2;  //LED를 디지털 2번 핀으로 설정


void setup() {

  Serial.begin(9600); //조도센서값을 확인하기 위한 시리얼통신 설정

  pinMode(LED, OUTPUT); //LED핀을 출력으로 설정

}


void loop() {

  int cds_val = analogRead(cds_sensor); //cds센서값을 cds_val변수에 저장


  Serial.print("Cds = "); //시리얼 모니터에 다음의 문자열 출력         print<< 그냥 출력

  Serial.println(cds_val);  //위의 문자열 바로 다음에 cds센서값 출력   println<< 내용 출력 후 줄바꿈


  if(cds_val > 500){            //센서값이 500보다 크다면 

    digitalWrite(LED, HIGH);    // LED를 켠다

  }

  else{

    digitalWrite(LED, LOW);     //아니면(센서값이 500보다 작다면

    Serial.println("LED OFF");  // LED를 끈다

  }

  delay(500);                   // 0.5초 대기

}


mblock 코드 


mblock을 이용한 블록코딩으도 위의 아두이노 스케치와 같은 결과물을 만들어 낼 수 있습니다.


mblock은 스크래치를 기반으로 만들어진 블록코딩툴 입니다. 기존의 인터페이스와 기능은 스크래치와 동일하지만 mblock은 라이브러리를 직접 블록으로 제작할 수 있고 타인이 만든 라이브러리를 다운받아서 자유롭게 사용할 수 있습니다.


이 기능은 스크래치, 엔트리, 마이크로비트 등 어디에도 없었던 방식이며 개인적으로 블록코딩의 본질을 가장 잘 이해하고 개발되어진 프로그램 이라고 생각합니다.


다음 코드는 위의 아두이노 스케치의 코드와 100% 동일한 코드입니다.



mblock 프로그램 내에서 사진과 같이 블록코딩한 결과를 아두이노 스케치로 변환하여 볼 수 있습니다. (편집 -> 아두이노 모드)


그리고 아두이노 모드에서 코드 위부분에 "아두이노 업로드"버튼을 누르게 되면 mblock프로그램에서 바로 보드로 프로그램 업로드를 할 수 있습니다.

(업로드를 하기 위해서는 연결 -> 시리얼포트 에서 아두이노에 연결된 COM포트를 설정 해야합니다.)


다만 위에서 제가 작성한 프로그램과 달리 조금 난잡하게 코드가 생성된 것을 확인할 수 있습니다. (윈도우에서는 제대로 될지 모르겠습니다.)


다음과 같이 생성된 프로그램을 아두이노IDE에서 복사해서 사용하려면 위에서 "__var__67___68...."과 같은 코드를 전부 수정해야 합니다.


수정을 하지않아도 사용할 수 있으나 난잡해 보일수 있기 때문에 초보자들은 오히려 더 혼동이 올 수 있을 것 같습니다.