co:bit Training Kit 기초강좌 4: 포텐쇼미터를 알아보자.

포텐쇼미터에 대해서 알아보자

포텐쇼미터는 가변저항이라고도 합니다. 아래와 같이 생긴 장치입니다. 포텐쇼미터는 일상 생활에서 라디오나 자동차 등에 부착된 오디오 볼륨 조절 장치 등으로 이용됩니다.

 

포텐쇼미터는 3개의 핀을 가지고 있습니다. 각각의 핀에 대한 설명은 아래 그림과 같습니다. VCC 핀은 배터리의 +가 연결되는 핀입니다. GND 핀은 배터리의 -가 연결되는 핀입니다. OUT 핀은 포테쇼미터의 스위치의 위치에 따라 0~1024 범위의 값이 출력되는 핀입니다. 

 

co:bit Training Kit에 포함된 포텐쇼미터는 0 ~ 1024 범위의 값을 출력해 줍니다. 포텐쇼미터에 달린 스위치를 오른쪽 왼쪽으로 돌릴 수 있습니다.

 

포텐쇼미터의 스위치를 왼쪽으로 끝까지 돌리면 0값이 출력됩니다. 스위치를 오른쪽 끝까지 돌리면 1024값이 출력됩니다. 이 스위치를 이용해서 co:bit Training Kit의 다양한 장치들을 제어할 수 있습니다. 우선 이번 클래스에서는 포텐쇼미터의 기본적인 동작을 배워보도록 하겠습니다.

준비물

이번 강좌의 준비물은 다음과 같습니다.

  • co:bit training kit 베이스 보드 (micro:bit 장착한 상태)
  • 마이크로 USB 케이블
  • 웹브라우저 연결 가능한 PC (맥북, 리눅스 포함) 혹은 크롬북
  • 포텐쇼미터 (co:bit Training Kit에 포함되어 있습니다.)

하드웨어를 준비해 봅시다.

제일 먼저 co:bit 베이스 보드에 micro:bit를 장착을 합니다. 장착을 할 때는 micro:bit의 LED와 버튼이 위로가게 장착을 합니다.

 

그리고 PC와 co:bit 베이스보드를 마이크로 USB 케이블로 연결을 합니다. 그리고 PC에서 웹브라우저를 실행합니다. 웹브라우저는 마이크로소프트의 에지 혹은 익스플로러, 구글의 크롬 등 어떤 브라우저라도 상관이 없습니다.

 

이번에는 포텐쇼미터를 아래 사진과 같이 co:bit 베이스보드에 연결합니다. 연결할 때 아래 사진에서 설명하는 데로 연결을 해야 제대로 동작합니다. 제일 먼저 co:bit 베이스보드와 포텐쇼미터를 준비합니다.

 

그 다음에는 co:bit 베이스보드를 자세히 보면 영어로 “Potentiometer”라고 적힌 핀단자를 볼 수 있습니다.

 

이 단자에 포텐쇼미터를 연결합니다. 연결할 때 아래 사진과 같이 포텐쇼미터의 VCC 핀에 연결된 전선이 베이스보드의 흰 색 사각형이 위치한 부분에 연결되도록 합니다.

 

위 사진에서 VCC 핀에 연결된 빨간색 전선이 co:bit 베이스보드의 흰색 사각형이 위치한 부분에 연결된 것을 볼 수 있습니다. (단, 굳이 빨간색 전선일 필요는 없습니다.) 이와 같이 연결했다면 하드웨어 준비가 완료된 것입니다.

 


코딩과제 1: 포텐쇼미터 값으로 그래프를 그리자. 

프로젝트 개요

이번 프로젝트에서는 co:bit  베이스 보드에 연결된 포텐쇼미터의 현재 값을 읽고, 이 값을 LED 스크린에 그래프로 그려보는 코드를 만들어 봅시다. 코드의 동작은 다음과 같습니다.

  1. 코드가 실행되면 “Potentio” 문자열을 스크롤합니다.
  2. 그 다음 포덴쇼미터의 값을 읽어서 “포텐” 변수에 저장합니다.
  3. “포텐” 변수의 값을 LED스크린에 디스플레이 합니다.
  4. 2번부터 계속 반복합니다.

정확히 코딩이 되었다면 다음과 같이 동작을 할 것입니다.

 

블럭코딩의 흐름도

프로젝트를 코딩하기 위해서 먼저 블럭코드의 흐름도를 봅시다.

 

블럭코딩 하기

클래스 1/2/3에서는 블럭 에디터에서 바로 코딩을 할 수 있었는데, 포텐쇼미터 클래스는 코딩을 하기 위해서 특별한 프로젝트를 사용해야 합니다. 포텐쇼미터를 읽는 확장블럭이 사용되었기 때문입니다. 다음에 링크된 블럭 에디터의 프로젝트를 사용하시기 바랍니다.

https://makecode.microbit.org/_0T3bJDhsEhrC

위 링크로 가면 블럭 에디터에 빈 프로젝트가 화면에 나타날 것입니다. 하지만 다른 비어있는 프로젝트와는 달리 “Cobit-base”라는 확장블럭이 있습니다. 이 “Cobit-base” 확장블럭은 다음과 같습니다.

 

이중에서 우리는 “포텐쇼미터 읽기” 블럭을 이번 프로젝트에서 사용합니다.

 

아래 있는 전체 프로젝트 보기를 클릭해도 이 확정블럭은  사용할 수 있습니다. 코드가 실행되면 제일 먼저 “Potentio” 문자열을 스크롤 합니다.  이 부분은 다음과 같이 코딩을 합니다.

 

“포텐쇼미터 읽기” 블럭은 co:bit 베이스보드에 연결된 포텐쇼미터의 값을 읽어드립니다.  다음에는 “포텐”이라는 변수를 만듭니다. 그리고 포텐쇼미터의 값을 읽어서 “포텐” 변수에 저장을 합니다. 저장하는 코딩은 다음과 같습니다.

 

그 다음에는 변수 “포텐”의 값에 비례해서 LED스크린애 그래프를 그려봅시다. 정해진 값에 따라 그래프를 그리는 블럭은 다음과 같은 블럭입니다. 이 블럭의 오른쪽에는 두가지의 변수가 필요합니다. 하나는 그래프를 표시할 값. 여기서는 변수 “포텐”입니다. 그리고 또 하나는 최대값. “포텐” 변수에는 포텐쇼미터의 출력값이 저장되므로 최대값은 1024입니다. 포텐쇼미터가 0 ~ 1024까지 값을 출력하기 때문입니다. 다음의 블럭은 “포텐” 변수의 값이 1024이면 LED스크린 전체가 켜집니다. “포텐”변수의 값이 1024 이하이면, “포텐”의 값에 비례해서 LED스크린의 LED가 켜집니다.

 

두가지 동작 – 포텐쇼미터를 읽어서 “포텐”에 저장, “포텐” 값에 따라 그래프 그리기는 “무한 실행 블럭”에 넣어서 계속 동작시킬 것입니다. 이 모든 것을 합한 것은 다음과 같은 블럭입니다.

 

전체 프로젝트

전체 블럭 프로젝트는 아래와 같습니다. 맨 오른쪽 위 모서리에 있는 ‘편집’ 버튼을 클릭하면 자신의 컴퓨터로 전체 블럭 프로젝트가 임포트 됩니다.

따라해보기
포텐쇼미터의 값을 읽어서 “포텐” 변수에 저장하고, “포텐” 변수를 2로 나눕니다.
그리고 이 값에 따라서 그래프를 그려보도록 합시다.  원래 코딩 결과와 어떻게 다른지 확인해 봅시다.

코딩과제 2: 포텐쇼미터 값으로  LED 조도를 조절하기. 

프로젝트 개요

이번 프로젝트에서는 co:bit  베이스 보드에 연결된 포텐쇼미터의 현재 값을 읽고, 이 값에 따라서 LED 스크린의 밝기가 제어되는 코드를 만들어 봅시다. 코드의 동작은 다음과 같습니다.

  1. 코드가 실행되면 “Hello” 문자열을 스크롤합니다.
  2. 그 다음 포텐쇼미터의 값을 읽어서 “밝기” 변수에 저장합니다.
  3. “밝기” 변수의 값을 4로 나누어서 다시 “밝기” 변수에 저장합니다.
  4. “밝기” 변수 값에 따라 LED 스크린의 밝기를 제어합니다.
  5. 2번부터 계속 반복합니다.

정확히 코딩이 되었다면 다음과 같이 동작을 할 것입니다.

 

블럭코딩의 흐름도

프로젝트를 코딩하기 위해서 먼저 블럭코드의 흐름도를 봅시다.

 

블럭코딩 하기

이번 코딩 프로젝트 역시 확장블럭이 포함된 블록 에디터 프로젝트를 사용해야 합니다. 아래 링크의 블럭 에디터 프로젝트를 사용해 주기 바랍니다.

https://makecode.microbit.org/_0T3bJDhsEhrC

맨 처음 “시작하면 실행” 블럭에서는 두가지 일을 해야 합니다. “Hello” 문자열을 스크롤 하고, “하트” 이미지를 LED스크린에 출력합니다.  이 두가지 일을 하는 블럭 코딩은 아래와 같습니다.

 

“시작하면 실행” 블럭을 코딩한 후에는 “무한 반복 실행” 블럭을 코딩해 봅시다.  제일 먼저 “밝기”라는 이름의 변수를 만들고, 포텐쇼미터의 값을 읽어서 이 값을 “밝기” 변수에 저장합니다.

 

다음에는 이 “밝기” 변수의 값을 4로 나눕니다. 이렇게 하는 이유는 “밝기” 값의 범위를 조절하기 위해서 입니다.  포텐쇼미터의 값은 0~1024 범위의 값을 출력합니다. 따라서 포텐쇼미터의 값을 저장한 “밝기” 변수의 0~1024 사이의 값을 가집니다. 하지만 우리가 LED의 밝기를 조절하려고 하는 “LED 밝기 설정” 블럭은 0~255 사이의 값을 입력할 수 있습니다. 그래서 “밝기” 변수의 값을 4로 나주어 주면, “밝기” 변수의 값을 “LED 밝기 설정” 블럭에서 사용이 가능합니다. “밝기” 변수를 4로 나누는 것은 아래와 같이 하면 됩니다.

 

“밝기” 변수의 값의 범위를 0~1024에서 0~255로 조정했으니 이제는 “밝기” 변수의 값에 따라서 LED스크린의 밝기를 조절해 봅시다. 이것은 아래와 같이 블럭코딩을 하면 됩니다.

 

“무한 반복 실행” 블럭 전체는 아래와 같습니다.

 

전체 프로젝트

전체 블럭 프로젝트는 아래와 같습니다. 맨 오른쪽 위 모서리에 있는 ‘편집’ 버튼을 클릭하면 자신의 컴퓨터로 전체 블럭 프로젝트가 임포트 됩니다.

따라해보기
“밝기” 변수를 4가 아닌 2로 나누는 것으로 코드를 변경하고 실행해 봅시다.

코딩과제 3: 포텐쇼미터 값으로 버저의 템포 조절하기. 

프로젝트 개요

이번 프로젝트에서는 co:bit 베이스 보드에 연결된 포텐쇼미터의 현재 값을 읽고, 이 값에 따라서 버저의 템포를 조절하는 코드를 만들어 봅시다. 코드의 동작은 다음과 같습니다.

  1. 코드가 실행되면 “Tempo control” 문자열을 스크롤합니다.
  2. 버튼 A를 누르면 “하트”아이콘이 LED 스크린에 출력되고 경고음이 울립니다.
  3. 버튼 B를 누르면 “하트” 아이콘이 LED스크린에 출력되고 경고음이 동작을 멈춥니다.
  4. 버튼 A를 늘러서 경고음을 동작 시키고 포텐셔미터의 스위치를 왼쪽으로 끝까지 돌리면 템포가 느려집니다.
  5. 포텐쇼미터의 스위치를 오른쪽 끝까지 돌리면 템포가 빨라집니다.
  6. 4와 5를 무한 반복합니다.

정확히 코딩이 되었다면 다음과 같이 동작을 할 것입니다.

 

블럭코딩의 흐름도

프로젝트를 코딩하기 위해서 먼저 블럭코드의 흐름도를 봅시다.

 

블럭코딩 하기

이번 코딩 프로젝트 역시 확장블럭이 포함된 블록 에디터 프로젝트를 사용해야 합니다. 아래 링크의 블럭 에디터 프로젝트를 사용해 주기 바랍니다.

https://makecode.microbit.org/_0T3bJDhsEhrC

제일 먼저 “시작하면 실행” 불럭 부분을 코딩해 봅시다. “시작하면 실행” 블럭에서는 다음 3가지 일을 해야 합니다.

  1. “Tempo control” 문자열 스크롤
  2. “X” 아이콘을 LED 스크린에 출력
  3. “시작”이라는 이름의 변수를 만들고 0을 저장

이렇게 코딩하려면 다음과  블럭코딩을 하면 됩니다.

 

다음에는 버튼 A/B가 눌러질 때 동작을 코딩해 봅시다. 버튼 A가 눌러지면 다음 두가지 동작을 해야 합니다.

  1. 변수 “시작” = 1
  2. “하트” 아이콘을 LED스크린에 출력

 

버튼 B가 눌러지면 다음 두가지 동작을 해야 합니다.

  1. 변수 “시작” = 0
  2. “X” 아이콘을 LED스크린에 출력

 

다음에는 “무한 반복 실행” 블럭을 코딩해 봅시다. “무한 반복 실행”은 다음 일들을 무한 반복 합니다.

  1. (만약 변수 “시작” = 1이면) 포텐쇼미터의 값을 읽어서 “탬포” 변수에 저장합니다.
  2. (만약 변수 “시작” = 1이면)”탬포”를 2로 나누어서 다시 “탬포” 값에 저장합니다.
  3.  (만약 변수 “시작” = 1이면)”탬포” 변수 값에 맞추어서 “솔(G)”음을 버저로 출력 합니다.
  4. 0.05초 쉽니다.

 

위 “무한 반복 실행” 코드는 “시작” 변수 값에 따라서 “만약 ~ 이면 실행” 블럭 내부의 블럭들의 실행 여부가 결정됩니다. “시작” = 1 이면 포텐쇼미터 읽기, “솔(G)” 출력 등이 실행이 됩니다. 하지만 “시작” = 이면 실행이 되지 않습니다. 버튼 A를 누르면  포텐쇼미터 읽기, “솔(G)” 출력 등이 실행이 됩니다. 버튼 B를 누르면 실행이 되지 않습니다. 

 

전체 프로젝트

전체 블럭 프로젝트는 아래와 같습니다. 맨 오른쪽 위 모서리에 있는 ‘편집’ 버튼을 클릭하면 자신의 컴퓨터로 전체 블럭 프로젝트가 임포트 됩니다.

따라해보기
버저로 출력되는”솔(G)”음의 템포를 조절하기 위해서 프로젝트 코드에서는 “템포”값을 2로 나누었습니다.  이 값을 2가 아닌 다른 값으로 바꾸어서 프로젝트 코드를 실행해 봅시다.

코딩과제 4: 포텐쇼미터 값으로  대각선 그래프를 만들자. 

프로젝트 개요

이번 프로젝트에서는 co:bit  베이스 보드에 연결된 포텐쇼미터의 현재 값을 읽고, 이 값에 따라서 LED 스크린에 삼각형 모양으로 그래프를 출력해 봅시다. 코드의 동작은 다음과 같습니다.

  • 코드가 실행되면 “Graph2” 문자열을 스크롤합니다.
  • 포텐쇼미터의 값을 읽어서 변수 “포텐쇼값”에 저장합니다.
  • “포텐쇼값”의 범위에 따라서 삼각형 모양의 그래프를 그립니다.

  • “포텐쇼값” < 200 이면  그림 1을 LED스크린에 출력
  • 200<“포텐쇼값”<400 이면 그림 2를 LED스크린에 출력
  • 400<“포텐쇼값”<600 이면 그림 3를 LED스크린에 출력
  • 600<“포텐쇼값”<800 이면 그림 4를 LED스크린에 출력
  • “포텐쇼값” > 800 이면 그림5를 LED스크린에 출력

정확히 코딩이 되었다면 다음과 같이 동작을 할 것입니다.

 

블럭코딩의 흐름도

프로젝트를 코딩하기 위해서 먼저 블럭코드의 흐름도를 봅시다.

 

블럭코딩 하기

이번 코딩 프로젝트 역시 확장블럭이 포함된 블록 에디터 프로젝트를 사용해야 합니다. 아래 링크의 블럭 에디터 프로젝트를 사용해 주기 바랍니다.

https://makecode.microbit.org/_0T3bJDhsEhrC

코드가 실행되면 “Graph2” 문자열을 LED스크린에 출력합니다. 코드는 “시작하면 실행” 블럭 안에 넣으면 됩니다.

 

그 다음에는 “무한 반복 블럭” 안에 넣을 블럭을 코딩해 봅시다. 먼저 이름이 “포텐쇼값”인 변수를 하나 만듭니다. 그리고 포텐쇼미터의 값을 읽어서 이 “포텐쇼값”값에 저장합니다.

 

포텐쇼미터 값을 읽었으면 이 “포텐쇼값”의 구간에 따라 해당하는 이미지를 LED스크린에 출력하면 됩니다. “포텐쇼값”의 구간이 “포텐쇼값 ” < 200 일 경우 블럭 코딩은 다음과 같습니다.

 

“포텐쇼값”이 예를 들어 100이라면 “포텐쇼값” < 200 블럭은 1을 출력하고, 따라서 “만약 ~ 이면 실행” 블럭안에 있는 “show leds” 블럭이 실행됩니다.  “포텐쇼값”의 구간이 200 < “포텐쇼값” < 400일 경우 블럭 코딩은 다음과 같습니다.

 

“포텐쇼값” 의 구간 200 < “포텐쇼값” < 400을 코딩하기 위해서는 다음 3단계로 코딩합니다.

  • 200 < “포텐쇼값” 코딩
  • “포텐쇼값” < 400 코딩
  • 위 두 코딩을 “그리고” 블럭으로 합치기

먼저 블럭영역 -> 논리블럭 그룹에서 아래 블럭을 가져옵니다. 이 블럭은 왼쪽과 오른쪽의 입력값을 비교합니다. 비교해서 조건이 맞으면 1을 출력합니다. 그렇지 않으면 0을 출력합니다.

 

다음의 예에서 보듯이 만약 “포텐쇼값”이 200 이하이면 아래 블럭은 0을 출력합니다. “포텐쇼값”이 200이상이면 아래 블럭은 1을 출력합니다.

 

따라서 200 < “포텐쇼값” 의 코딩은 위와 같이 불럭 코딩을 하면 된다. 반면에 “포텐쇼값” < 400은 아래와 같이 블럭 코딩을 하면 된다.

 

이제 200 < “포텐쇼값” 블럭과 “포텐쇼값 < 400 블럭을 합쳐서 200 < “포텐쇼값” < 400 블럭을 만들어 봅시다. 이렇게 하기 위해서 블럭영역 -> 논리블럭에서 “그리고(and)” 블럭을 가져옵니다. “그리고(and)” 블럭은 왼쪽과 오른쪽에 입력된 값이 모두 1이면 1을 출력하고 하나라도 0이 있으면 0이 출력됩니다.

 

그 다음에 “그리고(and)” 블럭에 200 < “포텐쇼값” 블럭과 “포텐쇼값” <400 블럭을 넣습니다. 전체 블럭은 아래와 같습니다.

 

위 블럭을 설명하면 다음과 같습니다.

  1. 예를 들어 “포텐쇼값”이 300이라면, “그리고(and)” 블럭의 왼쪽 입력인 200 < “포텐쇼값” 블럭은 1이 출력됩니다.
  2. “그리고(and)” 블럭의 오른쪽 입력인 “포텐쇼값” < 400 블럭의 출력도 1이 됩니다.
  3. “그리고(and)” 블럭의 왼쪽 입력과 오른쪽 입력이 모두 1이므로 전체 출력은 1이 됩니다.

 

따라서 “포텐쇼값”이 300이라면 위 블럭에서 “만약 ~ 이면 실행” 블럭 안에 있는 “show leds” 블럭이 실행이 됩니다.  이제는 포텐쇼미터 값이 400 ~ 600일 경우를 코딩해 봅시다. 코딩은 다음과 같이 됩니다.

 

“포텐쇼값”값이 600~800, 800이상은 모두 위에서 셜명한 블럭들을 약간씩 변경하면 코딩이 가능합니다.

 

전체 프로젝트

전체 블럭 프로젝트는 아래와 같습니다. 맨 오른쪽 위 모서리에 있는 ‘편집’ 버튼을 클릭하면 자신의 컴퓨터로 전체 블럭 프로젝트가 임포트 됩니다.

따라해보기
포텐쇼미터 값의 범위를 마음대로 조절해 봅시다. 프로젝트에서는 200단위로 구간을 정했는데 이 구간 값을 마음대로 바꾸어 봅시다.

응용해보기

포텐쇼미터의 값의 범위에  따라서 LED 스크린에 그래프가 표시되는 것이 아니라 연속적인 이미지를 출력해서 초간단 애니메이션을 만들어 봅시다.