얼굴을 따라 움직이는
카드보드 로봇 만들기
웹캠으로 내 얼굴을 인식하면, 카드보드 로봇이 고개를 돌리고 눈을 깜빡이고 입을 움직여요. 마이크로비트와 서보모터 5개로 만드는 표정 짓는 로봇 프로젝트!
★한눈에 보기
프로젝트에 필요한 자료를 모아뒀어요. 만들면서 필요할 때마다 이 링크들을 눌러 사용하세요.
?로봇이 할 수 있는 움직임
이 로봇은 서보모터 5개로 사람처럼 표정을 짓고 고개를 움직여요.
1설계도 출력하고 자르기
먼저 설계도를 다운로드해서 인쇄하고, 카드보드(B골 2~3mm)에 붙인 다음 부품을 하나씩 오려냅니다.
🎨 나만의 디자인으로 바꾸고 싶다면?
정해진 모양 말고 직접 디자인하고 싶다면 KRAF Studio 채널에서 다양한 카드보드 설계도를 찾아볼 수 있어요. 원하는 모양을 골라 창의적으로 꾸며보세요.
2하드웨어 조립하기
부품을 다 잘랐다면 이제 본격 조립! 자르는 것만큼 조립도 만만치 않지만… 도전!! 💪
👉 90도 정렬 방법 먼저 익히기
양쪽 눈 조립하기
먼저 좌우 눈 부품을 각각 만들어 둡니다.
눈 주변 조립 (★ 90도 정렬)
눈과 눈 주변을 연결하는 단계예요. 눈 서보가 정확히 90도에 맞춰져야 나중에 눈을 잘 감았다 뜰 수 있어요. 나사·박스를 조립하기 전에 서보 날개를 90도로 정렬한 뒤 눈 부분과 연결하세요.
턱(입) 부분 조립 (★ 90도 정렬)
입도 마찬가지로 서보를 90도 정렬한 다음 이어서 조립합니다. 매우 중요!
눈과 턱 연결
만들어 둔 눈 부분과 턱 부분을 합쳐줍니다.
머리 윗부분(이마) 연결
머리 상단을 덮어 얼굴 형태를 잡아줍니다.
코 부분 연결
코 부품을 붙여 얼굴 가운데를 완성합니다.
입 연결하기
아래턱(입) 부품을 결합합니다.
입과 얼굴 연결
턱이 부드럽게 벌어지도록 얼굴 본체와 연결해줍니다.
눈동자 붙이기
눈동자 스티커를 붙이면 로봇 표정이 살아나요. 👀
목 부분 조립 (★ 90도 정렬)
고개를 좌우·상하로 움직이는 목 부분도 90도 정렬이 중요해요.
받침대에 연결해 완성
받침대에 목을 연결하고, 마지막으로 건전지로 무게중심까지 맞춰주면 완성! 끝~ 🎉
3마이크로비트 코드 올리기
조립이 끝났으면 서보모터를 S1~S5에 연결하고, 마이크로비트에 코드를 올린 뒤 잘 움직이는지 테스트해요.
🔌 먼저: DF-Driver 확장 설치
이 프로젝트는 서보 5개를 연결·전원 공급하기 위해 DFRobot 모터 드라이버를 사용해요. MakeCode에서 확장을 추가해야 합니다.
- github.com/DFRobot/pxt-motor 주소를 복사
- MakeCode 편집기 → 확장(Extensions) 클릭
- URL 붙여넣는 칸에 붙여넣고 추가
📏 1) 서보 90도 조정 코드
조립할 때 서보를 90도로 맞추기 위한 기본 코드예요. A/B 버튼으로 각도를 조절하며 정렬할 수 있어요.
▶ 서보 90도 조정 코드 열기 (MakeCode)🧩 2) 얼굴 추적 코드 올리기
아래 코드를 마이크로비트에 올리면 얼굴 인식 웹앱과 통신해 로봇이 움직여요.
▶ 얼굴 추적 코드 열기 (MakeCode)🔧 서보모터 연결 위치 (S1 ~ S5)
웹앱을 연 다음, 각 핀에 연결된 서보가 제대로 움직이는지 하나씩 테스트하세요.
4얼굴 인식 웹앱 실행하기
마지막으로 웹캠이 켜진 컴퓨터에서 웹앱을 열고, 마이크로비트와 연결하면 끝! 화면 속 내 얼굴을 따라 로봇이 움직여요.
+보너스: 웹앱 직접 만들어보기
앱을 그냥 쓰는 것에서 한 발 더! VS Code의 Live Server로 얼굴 추적 코드를 직접 실행해볼 수 있어요.
프로젝트 폴더 만들기
C드라이브에 폴더(이름 자유)를 만들고, 그 안에 index.html 파일과 models 폴더를 넣어요. models 폴더에는 얼굴 인식 모델 파일을 넣습니다.
Live Server 확장 설치
VS Code 왼쪽 확장(Ctrl+Shift+X) → “Live Server” 검색 → Ritwick Dey가 만든 확장 설치
실행
index.html을 열고 우측 하단 “Go Live” 클릭 → 브라우저가 자동으로 열려요 (http://127.0.0.1:5500).
📂 폴더 구성
프로젝트폴더/
├── index.html
└── models/
├── tiny_face_detector_model-weights_manifest.json
├── tiny_face_detector_model-shard1
├── face_landmark_68_model-weights_manifest.json
└── face_landmark_68_model-shard1※ 얼굴 인식 라이브러리는 face-api.js 또는 MediaPipe를 사용해요. 전체 코드는 별도 페이지에서 다룰게요.
📦필요한 재료 목록
아래 재료를 준비하면 누구나 만들 수 있어요. (구매 링크는 직접 추가해주세요)
| 번호 | 품명 | 수량 |
|---|---|---|
| 1 | 마이크로비트 V2.21 | 1개 |
| 2 | 모터 드라이버 (DFRobot) | 1개 |
| 3 | 마이크로비트 어댑터 (ring:bit V2) | 1개 |
| 4 | 마이크로 서보 MG90s | 4개 |
| 5 | 표준 서보 MG995 | 1개 |
| 6 | 3핀 점퍼 케이블 | 5개 |
| 7 | M3 너트·볼트 (12mm) | 여러 개 |
| 8 | 긴 볼트 (30mm 이상) | 2개 |
| 9 | M3 와셔 | 여러 개 |
| 10 | 더블클립(종이클립) | 3개 |
| 11 | 박스지 (B골 2~3mm) | 적당량 |
| 12 | 건전지 (무게중심용) | 약간 |
🧰 추가로 필요한 도구
자, 가위, 칼, 드라이버, 고무줄, 풀/글루건
✓완성!
이제 여러분만의 표정 짓는 로봇이 완성됐어요. 카메라 앞에서 고개를 돌려보고, 눈을 깜빡여보고, 입을 벌려보세요. 로봇이 똑같이 따라 한다면 성공! 🎉
움직임이 어색하면 코드의 각도 값을 조금씩 바꿔가며 나만의 최적값을 찾는 게 이 프로젝트의 진짜 재미예요. 친구들과 누구 로봇이 더 자연스러운지 겨뤄보는 것도 추천!