코딩 없이 나만의 운동 앱을 빌드하는 5단계

  * 본 아티클의 원문은 2021년 1월 20일 Google Cloud 블로그(영문)에 게재되었습니다. 

연휴도 지나고 새해가 시작된 지금은 보다 건강하고 행복한 삶을 꾸리기 위한 새로운 목표를 세우기 적당한 시기입니다. 작년 이맘때 저는 다른 사람들과 마찬가지로 엄격한 운동 계획을 세우고 진행 상황을 기록하기로 했습니다. 사용할 만한 피트니스 앱과 운동 앱을 몇 개 살펴봤지만 제가 원하는 방식으로 운동을 기록할 수 있는 앱은 없었습니다. 그래서 코드는 전혀 작성하지 않아도 되는 방식으로 직접 앱을 만들었습니다.

저와 비슷한 상황이라면 걱정하지 마세요. Google Cloud에서 제공하는 코딩 없는 앱 개발 플랫폼인 AppSheet를 사용하면 몇 번씩 몇 세트를 했는지, 중량이 얼마인지, 어떤 운동을 했는지 기록하고 진행 상태를 표시해 주는 커스텀 피트니스 앱을 빌드할 수 있습니다.

시작하려면 여기에서 완성된 버전을 복사하세요. 도중에 난관에 부딪히거나 궁금한 점이 있으면 AppSheet 커뮤니티에 마련된 스레드에 문의해 주세요. 

1단계: 데이터 설정 및 앱 만들기

먼저 데이터를 정리하고 AppSheet에 연결해야 합니다. AppSheet는 다양한 데이터 소스 연결을 지원하지만 가장 손쉬운 방법은 Google Workspace와 통합되어 더욱 편리해진 Google Sheets에 연결하는 것입니다. 여기에 샘플 데이터를 설정해 두었습니다. 두 개의 탭에 각각 표가 하나씩 있습니다. 첫 번째 표에는 매주 하는 운동 목록이, 두 번째 표에는 각 운동을 실행한 기록과 성과(기구의 중량, 실시한 횟수 등)가 포함되어 있습니다. 

이 시트를 복사해 앱을 시작할 때 자유롭게 사용하세요. 복사가 완료되면 Google Sheets에서 직접 앱을 만들 수 있습니다. 도구 > AppSheet > 앱 만들기로 이동하면 AppSheet에서 데이터를 읽어 앱을 설정해 줍니다. 다른 데이터 소스를 사용하는 경우에는 이 단계를 따라 AppSheet에 연결하면 됩니다.

2단계: 운동 로깅 양식 만들기

이제 AppSheet 편집기가 나타날 것입니다. 화면 오른쪽 상단에 앱 실시간 미리보기가 표시됩니다. 이때 AppSheet는 Sheets에 있는 두 개의 표 중 하나(앱 생성 시에 열려 있던 탭)에만 연결된 상태입니다. 다른 표도 마저 연결하기 위해 데이터 > 표 > '운동 로그'에 표 추가로 이동합니다.

양식을 만들기 전에 각 열에 어떤 유형의 데이터가 포함되어 있으며 해당 데이터를 어떻게 사용할 것인지 AppSheet에 지정해야 합니다. 데이터 > 열 > 운동 로그로 이동해 다음 열을 아래와 같이 설정하세요. 각 열의 왼쪽에 표시된 연필 아이콘을 클릭하면 열 설정을 조정할 수 있습니다.

아래 이미지는 '키', '1세트 중량(lbs)', '1세트 반복 횟수', '기분'을 조정한 화면입니다.

이제 이 양식을 위한 뷰를 만들어 보겠습니다. 뷰는 웹페이지와 유사하지만 앱에만 해당합니다. UX > 뷰로 이동하여 새 뷰를 클릭합니다. 뷰 이름을 '운동 기록'으로 설정하고 이 데이터에 표시 옆에 있는 '운동 로그'를 선택한 다음 뷰 유형을 '양식'으로 설정하고 위치를 '왼쪽'으로 설정합니다. 앱을 저장하면 앱에서 '운동 기록'을 클릭할 수 있게 되며 운동을 로깅할 수 있는 양식이 열립니다.

3단계: 디지털 운동 일지 설정하기

운동을 하는 도중에 반복 횟수와 중량을 정하기 위해 지난 운동 기록을 빠르게 확인하려고 합니다. 운동 일지를 만들려면 새 뷰를 생성해야 합니다. UX > 뷰로 이동하여 새 뷰를 클릭합니다. 이 뷰에 '일지'라는 이름을 지정하고 데이터로 '운동 로그'를, 뷰 형식으로 '표'를 각각 선택한 후 위치를 '오른쪽'으로 설정합니다.

4단계: 통계 대시보드 만들기

이 단계까지 왔다면 운동을 기록하고 검토하는 기능이 온전하게 작동하는 앱이 마련되어 있을 것입니다. 하지만 저 같은 데이터광은 그래프와 차트를 사용해 진행 상태를 기록하기를 즐깁니다. 기본적으로는 어떤 운동을 선택하든 통계를 보여주는 차트 기능을 갖춘 대화형 대시보드를 만들 것입니다. 이 단계는 좀 더 복잡하므로 원한다면 건너뛰어도 무방합니다. 본인이 원하는 앱을 만드는 것이 중요하니까요.

대시보드 뷰를 만들기 전에 어떤 측정항목을 표시할지 결정해야 합니다. 저는 세트별 총 반복 횟수와 함께 첫 번째 세트에서 들어올린 중량을 표시하고자 합니다. 중량 열은 이미 만들었지만(1세트 중량(lbs)) 총 반복 횟수를 계산하려면 가상 열이 필요합니다. 데이터 > 열 > 운동 로그 > 가상 열 추가를 선택하면 됩니다.

이러한 계산과 같은 고급 로직을 실행할 때 AppSheet는 Google Sheets에서 사용하는 것과 유사한 표현식을 사용합니다. 가상 열을 '총 반복 횟수'라고 명명하고 아래 수식을 팝업 상자 안에 추가하여 반복한 총 반복 횟수를 계산합니다. 

[1세트 반복 횟수] + [2세트 반복 횟수] + [3세트 반복 횟수] + [4세트 반복 횟수] + [5세트 반복 횟수]

이제 대시보드 뷰를 만들 준비가 되었습니다. AppSheet의 대시보드 뷰는 기본적으로 다른 몇 개의 뷰를 포함하는 형태입니다. 따라서 대시보드를 만들기 전에 다음과 같은 뷰를 만들어 보겠습니다.

이제 대시보드 뷰를 만들어 보겠습니다. 뷰 이름을 '통계'로 붙이고 뷰 유형을 '대시보드'로, 위치를 '중앙'으로 설정합니다. 뷰 항목에서는 '운동('여러 운동'이 아님)', '총 반복 횟수', '1세트 중량(lbs), '감정', '캘린더'를 선택합니다. 대화형 모드를 사용 설정한 다음 디스플레이 > 아이콘에서 '차트'를 입력하고 원하는 아이콘을 선택합니다. 저장을 누르면 선택한 운동별로 각 차트를 조정하는 근사한 대시보드가 탄생합니다.

5단계: 앱을 맞춤설정하고 스마트폰으로 전송하기

드디어 앱이 준비 완료되었습니다. 디자인을 조정하고 추가 기능을 더해 맞춤설정할 수 있습니다. 이제는 자유롭게 AppSheet 편집기를 탐색하고 일부 기능을 테스트해도 좋습니다. 제 경우 다음을 추가하여 앱을 맞춤설정했습니다.

• UX > 브랜드로 이동하여 기본 색상을 파란색으로 변경
• 인터넷 연결이 되지 않을 때도 앱을 사용할 수 있도록 동작 > 오프라인/동기화로 이동하여 오프라인 사용을 사용 설정
• 운동 뷰가 앱 왼쪽 상단 모서리의 메뉴에만 표시되도록 메뉴로 위치 변경 

원하는 대로 앱을 조정했다면 스마트폰으로 전송하세요. 사용자 > 사용자 > 앱 공유로 이동하여 사용자 이메일 옆에 본인의 이메일 주소를 입력한 다음 '로봇이 아닙니다'를 선택하고 '사용자 추가 + 초대 보내기'를 선택합니다. 이제 스마트폰에서 이메일을 확인하고 단계에 따라 앱을 다운로드하세요.

AppSheet를 사용하면 일상을 편리하게 만들어주는 앱을 다양한 방법으로 빌드할 수 있습니다. 어떤 나만의 앱을 만들 수 있는지 알아보며 즐거운 시간을 보내시길 바랍니다.