블록 코딩으로 만드는 안드로이드 앱, 앱 인벤터
앱 인벤터는 MIT에서 제공하고 있는 모바일 앱 제작 서비스로 스크래치나 엔트리와 같은 블록 프로그래밍을 통해 손쉽게 안드로이드 앱을 만들 수 있도록 해줍니다. 이 도서는 앱 인벤터를 처음 접하는 학생과 독자들이 쉽고 재미있게 애플리케이션 제작을 익힐 수 있도록 쓰여져 있습니다. 앱 인벤터를 통해 버튼을 누르면 휴대폰이 진동하며 소리를 나도록 만들고, 카메라로 사진을 찍어 저장하는 등 다양한 프로젝트를 진행하며 코딩을 익힐 수 있습니다. 다양한 실습과 저자가 제작한 무료 동영상 강의를 통해 좀 더 자세하고 쉽게 앱 인벤터를 배울 수 있습니다.
상세이미지
저자 소개
저자 : 이준혁
전공이 경영/회계였으나 프로그래밍이 너무 좋아 프로그래머가 되었다. 메이커 관련 인터넷 강의(bit.ly/2KRvofB)를 제작하기도 했으며, 전 세계에 재미있고 신기한 메이커 프로젝트를 소개하는 페이스북 블로그(fb.com/neosarchizo.blog)를 운영 중이다. 덕분에 프로그램을 잘 모르는 어린이들이나 일반인들을 위해 친절하고 재미있게 잘 가르치는 소질이 생겼다. 현재는 회사를 나온 뒤 '새로운 시작'이라는 이름의 개인 사업을 하고 있다. 개인 사업을 통해 다양한 하드웨어와 소프트웨어를 개발하고 있는데, 예로 스마트폰으로 전동책상을 제어할 수 있도록 하는 블루투스 모듈, 미세먼지 측정기 등을 만들었다.
목 차
PART 01 - 앱 인벤터 소개
- 앱 인벤터의 탄생
- 스크래치
- 안드로이드
- 쉬어가는 페이지 (앱 인벤터로 할 수 있는 것들)
PART 02 - 앱 인벤터 준비하기
- 앱 인벤터 준비하기
- WiFi를 이용해 앱 인벤터 연결하기
- USB를 이용해 앱 인벤터 연결하기
- 에뮬레이터 연결하기
- 쉬어가는 페이지 (앱 인벤터에 도움되는 사이트들)
PART 03 - 앱 인벤터 살펴보기
- 디자이너
- 블록
- 쉬어가는 페이지 (저장하기와 체크포인트)
PART 04 - 버튼이 눌리면 야옹! 글자가 뿅!
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (앱 설치하기)
PART 05 - 버튼 눌러 글자 바꾸기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (글자 이쁘게 꾸미기)
PART 06 - 원하는 글자 입력하기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (텍스트박스의 다양한 기능)
PART 07 - 버튼에 고양이 사진 넣기
- 컴포넌트 추가하기
- 쉬어가는 페이지 (이미지 컴포넌트 사용하기)
PART 08 - 버튼이 눌리면 야옹! 소리내고 진동하기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (다양한 소리와 효과음 얻기)
PART 09 - 폰을 마구 마구 흔들어!
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (다양한 센서 살펴보기)
PART 10 - 그림판 만들기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (그림 그리기 앱들)
PART 11 - 선 굵기 바꾸기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (그림 저장하기)
PART 12 - 선 색 바꾸기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (모든버튼 사용하기)
PART 13 - 배경 이미지 추가하기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (배경 이미지도 지우기)
PART 14 - 사진을 찍어 배경으로 사용하기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (스마트폰 사진 불러오기)
PART 15 - 로켓을 기울여 움직이기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (스프라이트 이미지 얻기)
PART 16 - 펄럭펄럭 움직이는 새
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (애니메이션 블록 분리하기)
PART 17 - 통! 통! 공 튕기기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (아이콘 만들기)
PART 18 - 화면 바꾸기
- 컴포넌트 추가하기
- 블록 코딩하기
- 쉬어가는 페이지 (다른 스크린에 정보 전달하기)
출판사 서평
* 장별 요약
PART 01 - 앱 인벤터 소개
앱 인벤터가 어떻게 만들어지게 됐고, 어떤 특징을 가지고 있는지 살펴봅니다. 그리고 앱 인벤터를 시작하기 전에 도움이 될 수 있는 스크래치와 안드로이드에 대해 알아봅니다. 또한 앱 인벤터로 할 수 있는 프로젝트들에 대해 간단히 소개합니다.
PART 02 - 앱 인벤터 준비하기
앱 인벤터를 이용하기 위해 필요한 것들을 살펴봅니다. 앱 인벤터 안드로이드 앱을 설치하는 방법과 PC에서 앱 인벤터로 프로그래밍을 하기 위해 준비해야 할 것들을 소개합니다. 그리고 새로운 프로젝트를 만들고, 언어를 한글로 설정하는 방법도 소개합니다. 마지막으로 앱 인벤터와 안드로이드 기기 또는 에뮬레이터와 연결하는 것을 해봅니다.
PART 03 - 앱 인벤터 살펴보기
앱 인벤터의 구성 요소인 디자이너와 블록에 대해 살펴봅니다. 먼저, 디자이너에서 볼 수 있는 다양한 컴포넌트들에는 뭐가 있는지 소개합니다. 이렇게 추가한 컴포넌트들이 실제로 동작할 수 있도록 해주는 블록에는 어떤 것이 있는지 살펴봅니다. 마지막으로 앱 인벤터의 저장하기와 체크포인트 기능에 대해 알아봅니다.
PART 04 - 버튼이 눌리면 야옹! 글자가 뿅!
버튼과 알림 컴포넌트를 사용해봅니다. 이 버튼과 알림을 활용해 버튼을 눌렀을 때 화면에 글자가 표시되도록 만들어봅니다. 또한 앱 인벤터로 만든 프로젝트를 앱으로 만들어서 QR코드나 APK 파일로 공유하는 방법도 살펴봅니다.
PART 05 - 버튼 눌러 글자 바꾸기
원하는 텍스트를 표시할 수 있는 레이블 컴포넌트를 사용해봅니다. 레이블을 배치해서 원하는 텍스트를 표시하고, 버튼을 눌러 레이블의 텍스트를 바꾸는 작업을 해봅니다. 또한 레이블에 글자를 이쁘게 꾸미는 방법도 알아봅니다.
PART 06 - 원하는 글자 입력하기
원하는 텍스트를 입력할 수 있는 텍스트박스 컴포넌트를 사용해봅니다. 텍스트박스를 배치해서 원하는 텍스트를 입력하고, 버튼을 눌러 텍스트박스에 입력한 텍스트를 기존에 추가한 레이블의 텍스트로 설정해봅니다. 또한 텍스트박스의 다양한 기능들에 대해 살펴봅니다.
PART 07 - 버튼에 고양이 사진 넣기
버튼에 고양이 사진이 표시되도록 설정해봅니다. 이를 위해 이미지 파일을 어떻게 업로드하고 설정하는지 알아봅니다. 또한 사진이나 그림을 표시할 수 있는 이미지 컴포넌트에 대해서도 살펴봅니다. 이미지 컴포넌트의 각 속성에 대해서도 알아봅니다.
PART 08 - 버튼이 눌리면 야옹! 소리내고 진동하기
앱에서 소리를 낼 수 있게 해주는 소리 컴포넌트를 사용해봅니다. 기존에 추가한 버튼을 누르면 고양이 소리가 나도록 만들어봅니다. 또한 소리가 나는 동시에 진동도 나도록 만들어봅니다. 그리고 소리 컴포넌트에 사용할 수 있는 다양한 효과음을 얻는 방법도 살펴봅니다.
PART 09 - 폰을 마구 마구 흔들어!
스마트폰이 움직였는지 확인할 수 있는 가속도센서를 사용해봅니다. 이 가속도센서를 이용해 스마트폰을 흔들었을 때 고양이 소리가 나도록 만들어봅니다. 또한 가속도센서를 활용해서 만든 재밌는 앱 인벤터 앱들을 살펴봅니다.
PART 10 - 그림판 만들기
그림을 그릴 수 있는 캔버스를 사용해봅니다. 캔버스를 활용해서 손가락을 드래그해서 선을 그릴 수 있도록 만들어봅니다. 또한 우리가 그림 그리기 앱을 만들 때 참고하기 위해 다양한 그림 그리기 앱들을 살펴봅니다.
PART 11 - 선 굵기 바꾸기
드래그해서 값을 바꿀 수 있는 슬라이더를 사용해봅니다. 이 슬라이더를 이용해서 캔버스에서 그려지는 선의 굵기를 다르게 설정해봅니다. 또한 캔버스에 그린 그림을 파일로 저장하는 방법을 살펴봅니다.
PART 12 - 선 색 바꾸기
버튼 색에 맞춰서 캔버스의 선 색을 바꾸는 것을 해봅니다. 예로 들어 빨간 버튼을 누르면 빨강색, 파란 버튼을 누르면 파랑색으로 선 색이 바뀌도록 만듭니다. 또한 하나의 블록으로 모든 버튼을 제어할 수 있는 모든버튼 블록에 대해 살펴봅니다.
PART 13 - 배경 이미지 추가하기
캔버스에 배경 이미지를 추가하는 것을 해봅니다. 예로 색칠 공부를 할 수 있는 이미지를 추가해봅니다. 그리고 가속도센서를 이용해서 스마트폰을 흔들면 캔버스에 그린 것들을 지우게 만들어봅니다. 또한 배경 이미지를 아예 없애는 것도 해봅니다.
PART 14 - 사진을 찍어 배경으로 사용하기
카메라로 사진을 찍은 뒤 그 사진을 캔버스에 배경으로 설정하는 것을 해봅니다. 또한 이미지선택버튼을 이용해서 스마트폰의 사진을 불러와 배경으로 설정하는 것도 해봅니다.
PART 15 - 로켓을 기울여 움직이기
캔버스와 스프라이트를 이용해 게임처럼 로켓을 움직이는 앱을 만들어봅니다. 또한 게임을 만들 때 필요한 스프라이트 이미지를 많이 사용하는데, 이 스프라이트 이미지를 무료로 얻을 수 있는 사이트를 소개합니다.
PART 16 - 펄럭펄럭 움직이는 새
복수의 이미지를 이용해서 스프라이트로 애니메이션을 만들어봅니다. 바로 새 이미지를 이용해 새가 날갯짓을 하는 것처럼 구현합니다. 그리고 애니메이션 부분과 움직이는 부분을 분리하는 것을 해봅니다.
PART 17 - 통! 통! 공 튕기기
공을 추가해서 손가락으로 공을 튕길 수 있도록 만들어봅니다. 바로 손가락으로 튕긴 방향으로 공이 움직이고 모서리에 부딪치면 튕기도록 만들어봅니다. 또한 앱 인벤터로 만든 앱의 아이콘을 위해 웹 브라우저에서 아이콘을 제작하는 방법에 대해 알아봅니다.
PART 18 - 화면 바꾸기
앱 인벤터의 화면을 바꿀 수 있는 스크린에 대해 알아봅니다. 스크린 3개를 준비해서 순서대로 스크린이 바뀔 수 있도록 만들어봅니다. 또한 스크린에서 다른 스크린으로 바뀔 때 원하는 정보를 전달하는 방법에 대해 알아봅니다.
