일상 박형

카테고리       

앱인벤터 시작하기(어플리케이션 만들기)

 

안녕하세요 공대 박형입니다.

 

오늘은 앱을 제작할수 있는 앱인벤터 사이트에대해 소개해드리고 사용방법을 알려드리겠습니다.

 

앱 인벤터는 MIT 공대와 구글의 합작으로 간단한 어플리케이션을 만들 수 있는 도구입니다. 문자 코딩이 필요하지 않고 블록 코딩으로 프로그램을 제작하기 때문에 코딩이 익숙하지 않은 분들도 쉽게 따라하여 앱을 제작할 수 있습니다.

 

우선 아래 사이트에 접속합니다.

appinventor.mit.edu/

 

MIT App Inventor | Explore MIT App Inventor

MIT App Inventor for iOS on the App Store It is with great pleasure that the App Inventor team announces that the MIT App Inventor companion app for iOS is now generally available on the Apple App Store for iPhone, iPad, iPod Touch, and Mac. At over 66,000

appinventor.mit.edu

 

 

 

사이트에접속하면 Create Apps! 를 클릭합니다.

 

 

 

앱 인벤터를 사용하기 위해서는 구글 아이디가 필요합니다. 아이디가 없으신 분들은 회원가입을 진행해주시고 아이디가 있으신 분들은 로그인 해주세요.

 

 

 

로그인을 완료했다면 위 창으로 이동할 것입니다. 여기서 '새 프로젝트 시작하기'를 클릭해주세요.

 

 

 

프로젝트 이름을 원하시는대로 타이핑 하신 후 확인을 눌러주세요.

 

 

 

저는 프로젝트 이름을 'EX'로 정하였습니다. 확인을 누르면 프로젝트 화면으로 넘어오게 됩니다. 우선 가장 기본적인 버튼을 생성해보겠습니다. 왼쪽의 '사용자 인터페이스' 목록의 '버튼'을 스마트폰 화면 위로 드래그합니다.

 

 

 

그림과 같이 버튼이 생성되었습니다. 우선 버튼의 이름을 변경해보겠습니다. 우측의 '컴포넌트'에서 '버튼1'을 클릭하고 하단의 '이름 바꾸기'를 클릭합니다.

 

 

 

버튼의 이름을 마음대로 수정해주세요!

 

 

 

버튼의 이름은 바꾸었지만 스마트폰상에서 버튼의 텍스트는 변경되지 않은것을 볼 수 있습니다.

 

 

 

우측의 '속성'에서 '텍스트'를 변경합니다.

 

 

 

그러면 화면상에서 텍스트가 변경된 것을 확인할 수 있습니다.

 

 

 

저는 추가로 레이블을 하나 추가하였습니다. 그 다음으로 우측상단의 블록을 클릭합니다.

 

 

 

그러면 블록 생단 환경으로 넘어옵니다. 버튼을 컨트롤하기위해서는 좌측의 '블록' 목록에서 제가 지정한 버튼 이름인 '내맘대로버튼'을 클릭합니다.

 

 

 

그러면 버튼을 사용하여 실행할 수 있는 블록 목록을 볼 수 있습니다. 저는 가장 간단한 클릭 이벤트를 사용하겠습니다. 원하는 블록을 드래그하여 흰색 빈 화면에 드래그합니다.

 

 

 

버튼 조작으로 레이블의 텍스트 값을 변경시키기 위해 위의 '지정하기 내맘대로레이블 텍스트 값' 블록을 가져옵니다.

 

 

 

그리고 텍스트 값을 변경하기 위해 '텍스트'목록의 ""를 가져옵니다.

 

 

 

블록이 완성됐습니다! 이제 완성된 프로젝트를 앱으로 변환하겠습니다.

 

 

 

다시 디자이너 생성 환경으로 돌아와서 상단의 '빌드'에서 '앱(APK용 QR 코드 제공)'을 클릭합니다. APK파일을 다운받아서 폰으로 옮겨도 되지만 QR코드를 사용하면 더 편리하게 사용할 수 있습니다.

 

 

 

클릭하며 다운로드가 진행됩니다.

 

 

 

다운로드가 완료되면 QR코드가 생성됩니다. 스마트폰으로 QR코드를 인식하여 앱 다운로드를 진행합니다.

참고로 앱인벤터는 '애플 아이폰'은 사용할 수 없습니다. '삼성 갤럭시' 환경에서는 사용할 수 있습니다.

 

 

 

QR코드로 접속하거나 주소로 접속하면 다운로드를 진행할 수 있습니다. 참고로 스마트폰 설정에서 외부 앱을 다운로드 하는 권한을 허용해야 다운로드가 진행됩니다.

 

 

 

설치를 진행해주세요. 그러면 저희가 제작한 앱을 다운로드 완료할 수 있습니다. 

 

 
시연영상입니다.

간단하게 블루투스 통신앱을 만들기 편한 앱 인벤터입니다. UI와 앱 모양이 이쁘지 않다는 단점이 있지만 쉽게 만들 수 있다는 점에서 활용도가 높습니다.

앱 인벤터를 활용하여 LED점등 예제는 아래 주소에서 확인할 수 있습니다.
https://engineerparkbro.tistory.com/41?category=887726

 

[복사하고 따라하는 아두이노] 아두이노 블루투스 LED제어(feat.앱인벤터,HC-06)

[복사하고 따라하는 아두이노] 아두이노 블루투스 LED제어(feat.앱인벤터,HC-06) 안녕하세요 공대 박형입니다. 오늘은 블루투스 센서 HC-06을 통해 아두이노와 스마트폰을 무선 통신하여 LED를 제어해

engineerparkbro.tistory.com


저도 스마트홈 제품을 직접 제작중에 있는데 다른 앱 개발 도구를 배우기엔 시간이 부족하고 기능적으로 문제만 없으면 되기에 앱 인벤터를 사용중입니다.

오늘은 여기서 글을 마무리 하겠습니다.

읽어주셔서 감사합니다.


공유하기

facebook twitter kakaoTalk kakaostory naver band