모바일 어플리케이션
모바일 앱 만들기 1강
앱 인벤터
8강
간단한 앱 만들기 앱 인벤터 구성
앱 인벤터(App Inventor)
1 차시
2 차시 3 차시
2. 앱인벤터를 설치할 수 있다.
3. 앱인벤터의 구성을 알고 사용할 수 있다.
1. 앱인벤터를 이해하여 설명할 수 있다.
학 습 목 표
앱인벤터(App Inventor)
MIT App Inventor / Anyone Can Build Apps That Impact the World / visual coding of block building method / appinventor.mit.edu/explore / The Cyber University of Korea / CUK,edu
I T / D E S I G N / M O B I L E A P P L I C A T I O N
1차시
기 파일 시스템의 단점 보완
앱 인벤터란?
1
구글과 MIT 대학에서 개발한 블록 기반의 앱 제작 프로그래밍 툴 드래그-앤-드롭 방식의 비주얼 프로그래밍 언어
안드로이드 기반의 스마트 기기에 크롬 브라우저에 접속해서 사용
PC에서 에뮬레이터를 활용하여 앱 테스트 가능
SMS문자 앱 문자기능 활용 앱 등 로봇 제어 앱 LEGO 로봇 제어 앱 등 하이테크 앱 바코드 스캔, 말하기 앱 등
앱 인벤터 활용 2
게임
교육용 소프트웨어 정보제공이나 퀴즈 앱 등
위치기반 앱 GPS를 이용하여 주차한 곳 찾기 앱, 지역 투어 앱 등
앱 인벤터 구성
MIT App Inventor / Anyone Can Build Apps That Impact the World / visual coding of block building method / appinventor.mit.edu/explore / The Cyber University of Korea / CUK,edu
I T / D E S I G N / M O B I L E A P P L I C A T I O N
2차시
앱 인벤터 화면구성
기 파일 시스템의 단점 보완 Designer 모드 : 재료를 준비하는 단계
1
3 만들기
앱을 제작할 때 쓸 컴포넌트를 가져오고 그 속성을 설정한다.
1. Viewer
- 이곳에 컴포넌트를 배치하여 앱의 화면을 설계한다.
2. Palette
- Viewer 왼쪽에 위치하며, Viewer에 배치할 수 있는 컴포넌트 목록을 보여준다.
- User Interface, Layout, Media 등의 구역으로 구분되어 있다.
3. Components
- Viewer 오른쪽에 위치하며, 프로젝트에서 현재 사용하고 있는 컴포넌트를 보여준다.
- 선택한 컴포넌트를 계층적으로 보여준다.
4. Media
- 프로젝트에 포함된 그림이나 소리와 같은 미디어 파일을 보여준다.
5. Properties
- 화면의 맨 오른쪽에 위치하며, 컴포넌트의 속성을 보여준다.
앱 인벤터 화면구성
기 파일 시스템의 단점 보완 Blocks 모드 : 요리하는 단계
2
3 만들기
자세한 실습영상은
강의 속에서 확인하세요.
참고 자료
§ 쉽고 재미있게 만드는 앱 프로그래밍 앱 인벤터, 이종원 저, 2018, 한빛아카데미
간단한 앱 만들기
MIT App Inventor / Anyone Can Build Apps That Impact the World / visual coding of block building method / appinventor.mit.edu/explore / The Cyber University of Korea / CUK,edu
I T / D E S I G N / M O B I L E A P P L I C A T I O N
3차시
앱 인벤터로 앱 만들기
앱 만드는 단계
Blocks에서 컴포넌트가 할 일 지정하기 핸드폰에서 테스트하기
새 프로젝트 만들기
Designer에서 컴포넌트 추가하기
3 앱인벤터 시작하기
1. 크롬브라우저에서 appinventor.mit.edu 사이트로 가서
오른쪽 위에 있는 Create Apps 버튼을 클릭해서 앱인벤터를 사용하면 된다.
이것만으로도 앱인벤터는 사용할 수 있다.
2. 다운받아 설치하는 것은 앱인벤터에서 작업을 다 마친 후 결과를 확인하기 위해 필요한 사항.
또한 pc와 핸드폰이 같은 wifi를 사용한다면 다운받아 설치할 필요도 없다.
그럴 경우는 앱인벤터의 Connect > Ai companion 메뉴를 활용해 앱 확인을 할 수 있다.
3. 파일을 다운받아 설치하면 바탕화면에 aistarter 바로가기가 생긴다.
앱인벤터에서 작업을 마친 후 작업한 내용을 에뮬레이터로 확인할 때 먼저 바탕화면의 aistarter 바로가기를 더블클릭해서 실행시킨 후, 앱인벤터의 connect > emulator를 선택하면 가상핸드폰이 뜬다.
그걸로 작업한 앱을 확인할 수 있다.
3 만들기
자세한 실습영상은
강의 속에서 확인하세요.
참고 자료
§ 실습자료
사운드이펙트: http://soundbible.com/2007-Kid- Laugh-Long.html
