
앱인벤터로 나만의 감정 기록 앱 만들기, 복잡한 코딩 없이도 가능했답니다!
안녕하세요, 여러분!
저는 지난 10년간 수많은 분들이 자신만의 아이디어를
앱으로 현실화하는 과정을 지켜보고 또 함께해왔던
한양미래연구소의 콘텐츠 전문가랍니다.
처음에는 '나도 앱을 만들 수 있을까?' 하는 막연한 두려움을 가진 분들이 많았어요.
복잡한 코딩 언어와 어려운 개발 환경에 대한 선입견 때문이었죠.
하지만 저는 늘 말씀드렸답니다.
누구나 쉽게 앱 개발의 재미를 느낄 수 있는 도구가 있다고 말이죠.
바로 '앱인벤터'예요.
혹시 여러분 중에도 멋진 아이디어를 갖고 있지만,
프로그래밍 지식이 없어서 주저하고 계신 분들이 있나요?
걱정 마세요!
앱인벤터는 마치 레고 블록을 쌓듯이
시각적으로 코딩할 수 있도록 도와주는 아주 친절한 도구랍니다.
덕분에 코딩을 전혀 모르는 분들도 빠르게 자신만의 앱을 만들 수 있게 되었어요.
한양미래연구소에서는 이러한 앱인벤터를 활용한 여러 교육 활동을 통해
많은 분들이 앱 개발의 문턱을 넘을 수 있도록 돕고 있답니다.
최근에는 사내고등학교 학생들과 함께 특별한 앱 제작 프로젝트를 진행했었어요.
다름 아닌, 사용자들의 감정을 기록하고 돌아볼 수 있는 '감정 기록 앱'이었답니다.
학생들은 앱 개발이라는 말에 처음에는 긴장했지만,
앱인벤터의 직관적인 환경을 접하고는 금세 흥미를 붙였어요.
앱 개발, 이제 더 이상 어렵게만 느껴지지 않아요!
우리가 앱을 만들 때 가장 먼저 떠올리는 것은 아마
'어떤 화면으로 구성될까?' 하는 디자인적인 부분이겠죠?
그리고 그 화면이 우리가 원하는 대로 움직이도록 만드는 '프로그래밍' 과정이 필요하답니다.
앱인벤터는 이 두 가지 핵심 과정을 '디자이너'와 '블록'이라는 두 가지 영역으로 명확하게 나누어 제공해요.
'디자이너' 영역에서는 사용자들이 직접 보게 될 앱의 화면을 만들어요.
버튼, 텍스트 입력창, 이미지 등 다양한 구성 요소를
드래그 앤 드롭 방식으로 배치하고 디자인할 수 있죠.
마치 파워포인트나 한글 프로그램을 사용하듯이 직관적이라서
누구나 쉽게 따라 할 수 있답니다.
그리고 '블록' 영역에서는 이렇게 디자인된 화면 구성 요소들이 어떻게 작동할지,
어떤 기능을 수행할지를 블록 형태로 코딩하는 거예요.
예를 들어, '버튼을 클릭하면 어떤 일이 발생한다'와 같은 동작을
블록을 조립해서 만들 수 있어요.
복잡한 문법을 외울 필요 없이,
마치 퍼즐을 맞추듯 논리적인 흐름을 구성할 수 있어 앱 제작이 훨씬 수월해진답니다.
이러한 앱인벤터의 특성 덕분에,
처음 앱 개발을 접하는 학생들도 '감정 기록 앱'의 전체적인 틀을
빠르게 이해하고 아이디어를 구체화할 수 있었답니다.
화면 디자인과 프로그래밍이 이렇게 분리되어 있으니,
각자의 역할에 집중하면서도 전체적인 앱의 완성도를 높일 수 있었어요.

감정 기록 앱, 이렇게 기능을 분석하고 구현했어요
저희는 감정 기록 앱을 만들기 전에,
앱이 어떤 기능들로 이루어져야 사용자들에게 유용할지 먼저 분석하는 시간을 가졌어요.
앱 개발의 첫걸음은 언제나 '사용자 경험'을 깊
이 있게 이해하는 것에서 시작하니까요.
실제 앱 화면을 머릿속으로 그려보면서,
필요한 기능들을 하나씩 나열했답니다.
"사용자가 오늘 날짜를 쉽게 선택하고 확인할 수 있어야겠네!",
"간단하게 오늘의 감정 상태를 이모티콘으로 표현하고, 짧은 일기도 쓸 수 있으면 좋겠다!",
"가장 중요한 건, 기록된 내용이 잘 저장되고 필요할 때 삭제도 가능해야겠지?"
이런 식으로 말이죠.
그래서 감정 기록 앱에 필수적으로 포함되어야 할 기능들을 다음과 같이 정리했어요.
날짜를 선택하고, 선택된 날짜를 화면에 표시하는 기능
간단한 일기를 작성할 수 있는 텍스트 입력 기능
다양한 이모티콘을 이용해 그날의 감정을 기록하는 기능
기록된 내용을 저장하고, 원할 때 삭제할 수 있는 기능
이 기능들을 바탕으로 앱인벤터의 디자이너와 블록 영역을 오가며
실제 앱을 구현해 나갔답니다.
정말 하나하나 만들어지는 과정을 보면서 학생들도 저도 뿌듯함을 감출 수 없었어요.
날짜 선택과 출력 기능
감정 기록 앱에서 날짜는 가장 기본적인 요소였어요.
사용자가 특정 날짜를 선택하면
그 날짜에 대한 기록을 볼 수 있도록 해야 했으니까요.
앱인벤터의 'DatePicker' 컴포넌트를 활용해서 이 기능을 구현했답니다.
디자이너 화면에 DatePicker를 배치하고,
사용자가 이 컴포넌트를 클릭하면 달력이 나타나 날짜를 고를 수 있도록 했어요.
그리고 사용자가 날짜를 선택하면,
선택된 날짜가 화면의 텍스트 레이블에 바로 표시되도록 블록 코딩을 진행했답니다.
'DatePicker.AfterDateSet' 이벤트를 사용해서,
날짜 선택이 완료되면 선택된 연, 월, 일을 가져와 텍스트 형태로 조합한 다음,
지정된 레이블에 텍스트를 설정해 주었죠.
이렇게 하면 사용자는 자신이 어떤 날짜에 기록을 남기는지 명확하게 확인할 수 있어요.
앱 개발 과정이 이렇게 시각적으로 이해하기 쉬우니,
기능 하나하나를 추가할 때마다 완성도가 높아지는 게 눈에 보였답니다.

내 마음을 담는 공간, 일기 작성과 감정 표현
날짜 선택 기능이 완료된 다음에는,
사용자가 그날의 감정과 생각을 자유롭게 기록할 수 있는 공간을 만드는 데 집중했어요.
먼저 디자이너 화면에 'TextBox' 컴포넌트를 배치해서 사용자가 일기를 입력할 수 있도록 했답니다.
여러 줄의 텍스트를 입력할 수 있도록 속성을 조절했고요.
그리고 감정을 기록하는 기능은
여러 개의 'Button' 컴포넌트와 'Image' 컴포넌트를 조합해서 만들었어요.
예를 들어, '기쁨', '슬픔', '화남', '평온' 등의 감정을 대표하는 이모티콘 이미지를 각 버튼에 연결하고,
사용자가 특정 감정 이모티콘 버튼을 클릭하면 해당 감정이 선택되었다는 표시가 나타나도록 블록을 구성했죠.
버튼 클릭 시, 선택된 감정을 시각적으로 확인할 수 있게
테두리 색이나 작은 아이콘을 표시해주는 식으로 구성했답니다.
이렇게 시각적인 피드백을 주니 사용자가 앱과 상호작용하는 느낌이 훨씬 좋아졌어요.
모든 과정은 블록을 활용해 하나씩 구현해 나가면서 복잡한 코딩 없이도 충분히 원하는 기능을 완성할 수 있었어요.
사내고등학교 학생들도 이 부분에서 특히 흥미를 보였고요.
자신이 제작한 감정 이모티콘을 앱에 적용해보는 시간은 창의력까지 발휘할 수 있어서 정말 뜻깊었답니다.

소중한 기록을 위한 저장과 삭제
아무리 좋은 기록 기능이 있어도, 기록된 내용이 사라진다면 의미가 없겠죠?
그래서 저희는 사용자의 소중한 감정 기록이 안전하게 저장되고,
필요할 때 언제든 삭제할 수 있는 기능을 구현하는 데 신경을 많이 썼어요.
앱인벤터에서는 데이터를 앱 내부에 저장할 수 있는 'TinyDB'라는 간단한 컴포넌트를 제공하거든요.
TinyDB는 앱이 종료돼도 저장된 정보를 유지할 수 있어서 감정 기록 앱에는 꼭 필요한 요소였답니다.
각 기록은 날짜를 기준으로 '태그'를 설정하고,
해당 일기의 텍스트와 감정 이모티콘 정보를 함께 묶어 저장하는 방식으로 코딩을 구성했어요.
그리고 삭제 기능도 동일한 원리로 구성했어요.
사용자가 특정 날짜의 기존 기록을 삭제하고자 할 때는,
그 날짜의 태그를 기반으로 TinyDB에서 해당 정보를 찾아 제거하는 식이었죠.
이 과정을 통해 학생들은 데이터의 저장, 읽기, 삭제 개념까지 자연스럽게 체득할 수 있었어요.
앱 개발이라는 기술적 경험을 넘어서, 사용자 관점에서의 데이터 관리 방식까지 배웠다는 데 의미가 컸답니다.
앱인벤터를 활용해 감정 기록 앱을 함께 만들어보면서,
복잡한 개발 도구나 어려운 프로그래밍 없이도 하나의 앱을 완성할 수 있다는 자신감을 얻을 수 있었어요.
아이디어만 있다면, 누구나 직접 앱을 만들고 자신만의 이야기를 담아낼 수 있는 시대가
정말 가까워졌다는 걸 느낄 수 있었답니다.


앱인벤터로 감정 기록 앱을 만들어보면서 앱 개발이 생각보다 훨씬 친근하다는 걸 깨달을 수 있었어요.
직접 만들고 실행해보니 내가 상상한 아이디어가 눈앞에 구현되는 기쁨이 정말 크더라고요.
혹시 앱 개발에 관심은 있지만 시작이 망설여지셨나요?
한양미래연구소에선 앱인벤터를 활용한 다양한 진로·체험 교육을 통해
누구나 쉽게 첫걸음을 뗄 수 있도록 돕고 있답니다.
문의: 070-8064-0829
홈페이지: https://hyedu.kr/
캠프 예약: https://booking.naver.com/booking/12/bizes/252156
