약 3주간 뉴스레터를 휴재하고 틈틈히 앱을 만들고 있었어요. 서버없이 노코드 툴과 ChatGPT를 이용해서 간단한 인공지능 기반 영어단어 앱을 만들었어요. 오늘 포스팅에서는 어떻게 앱을 만들고 어떤 과정을 통해서 앱을 배포할 수 있는지 설명드릴게요.
듀오링고와는 다르게
앱 스토어에 보면 듀오링고, 말해보카 등 좋은 영어 앱이 많이 있어요. 그럼에도 영어 앱을 만들기로 했던 것은 저에게 필요한 영어 앱을 만들고 싶었기 때문이에요. 개인적으로 틈틈히 IELTS를 공부하고 있는데 모르는 단어나 외우고 싶은 단어 중심으로 공부를 하고 싶었어요. 그리고 단어 공부를 하면서 작문실력도 함께 늘리고 싶었어요.
듀오링고나 말해보카는 공신 영어시험보다는 게임 요소를 도입해서 영어 공부를 재밌게 만드는 것이 매력인 것 같아요. 반면에 제가 만든 POYO는 영어 공부를 재밌게 하는 것보다는 계획적으로 공부를 해야하는 유저를 타겟으로 만들었어요. 자신의 공부할 주제가 명확히 있고 해야할게 명확히 있는 유저를 타겟으로 했어요. (저를 타겟으로 만들었어요 ㅎㅎ)
예를 들어, IELTS 공부를 하다보면 모르는 단어가 나와요. 그때 단어를 추가하고 단어에 맞는 문제를 ChatGPT를 이용해서 생성해요.
App은 App store에서 다운로드 받을 수 있어요.
https://apps.apple.com/kr/app/poyo/id6504000875
Low, Medium, High, Master
영어 단어는 4단계의 학습과정을 거쳐요. Low, Medium, High, Master로 순서대로 넘어가요. 각 단계마다 주어진 문제가 있어요. 단계별로 문제를 5문제 풀면, 다음 단계로 넘어갈 수 있어요. 최종적으로 Master 레벨이 되면 해당 단어에 대한 이해도가 높다고 할 수 있어요.
문제
문제는 다음과 같은 형식이에요. 단어 조각이 주어지면 이것을 바탕으로 문장을 조합할 수 있어요. 문장을 올바르게 조합하면 정답, 그렇지 않으면 오답 창이 떠요. 그리고 문제를 맞추면 앞으로 몇 문제를 맞춰야 다음 단계로 넘어갈 수 있는지 알려줘요.
개인적으로 이 부분으로 노코드로 구현하면서 걱정을 했어요. 단어를 클릭하면 답변항목에 들어가고 다시 단어를 클릭하면 단어 목록으로 들어가야해요. 꽤 복잡한 인터렉션이 있어서 노코드로 구현이 가능할지, 성능이 괜찮을지 궁금했어요. 실제로 구현해보니 속도나 사용성이 부족함이 없었어요.
Level Up
각 난이도 별로 할당된 문제를 맞추면 다음 단계로 넘어가요. 다음 단계로 넘어가면 메인페이지에서 해당 단계별 단어가 몇개인지 보여줘요.
앱 배포과정
1. Apple Developer 계정 생성
계정은 이 링크에서 생성할 수 있어요. 그리고 앱스토어 배포하려면 Apple Developer Membership을 구매해야해요.
2. App Bundle 생성
App을 배포
3. App 심사요청
4. App 승인 및 배포
회고
불완전하지만 우선 배포하는 이유
앱을 잘 만들고 있는지 그리고 무엇을 만들어야하는지 오로지 혼자서 결정해야해요. 앱을 보면 아직 완성도가 많이 올라오지 않았어요. 정말 최소한의 기능으로 빠르게 배포할려고 원래 만들었던 페이지 혹은 기능을 과감하게 제거하기도 했어요. 실제로 배포된 페이지는 만들어놨던 페이지의 절반 정도인 것 같아요.
앱의 수준을 높이기 위해서는 사용자가 필요해요. 무엇을 원하고 불편해하는지 아는 것이 중요해요. 그럴려면 접근성이 좋아야한다고 생각했어요. 이 앱은 사용자를 모으지는 않을 계획이지만 배포경험을 쌓아보고 싶어서 앱 스토어에 배포했어요.
혼자서 앱을 만들면서 좋았던 점
하나의 세계관을 직접 설계하는 느낌이었어요. 캐릭터, 단어 능숙도에 대한 정의 등 다양한 것들을 직접 정의하고 구현할 수 있었어요. 직접 해보니 부족한 점이 많았지만 채워나가야하는 역량에 대해서 느낄 수 있었어요.
기획단계에서 사용자가 가지고 있는 문제점을 정의하고 이를 해결하는 플로우를 정의해야해요. 문제를 해결하기 위해서 정의한 플로우가 가장 효율적인가도 고민해야하는 것 같아요. 예를 들어서, 이번에 만든 영어 단어장 앱은 작문실력을 높이는 것이 목표였어요. 그리고 유저는 다음과 같은 단계로 진행해요.
제가 만들었지만 너무 긴 플로우에요. 이를 이런 식으로 개선하면 더 좋을 것 같아요.
앱 배포는 MVP로 적합할까?
앱 스토어에 배포과정이 약 일주일정도 걸렸어요. 앱 스토어는 명확한 가이드라인이 있어요. 그리고 이는 애플 생태계를 위한 것이에요. 예를 들어서 시간상 이메일 로그인과 구글 로그인을 구현해서 배포신청을 했어요. 하지만 구글 로그인이 추가되니 이메일과 사용자 명만 받는 로그인 정책이 없다고 리젝을 받았어요. 그리고 애플 로그인을 추가하라는 피드백을 받았어요. 그래서 이메일 로그인이 제시해준 가이드라인에 적합하다고 답장했지만 여전히 같은 피드백을 받았어요. 혹시 몰라서 구글 로그인을 제거하니 해당 건은 통과가 되었어요.
이런 상황을 겪으면서 앱 배포는 생각보다 제약사항이 있는 것 같다는 생각이 들었어요. 다음에 MVP를 만들때 웹과 앱을 선택할 수 있다면 웹 배포를 먼저 진행할것 같아요.
덜어내기
이 앱을 만들면서 여러 페이지를 만들고 지웠어요. 그리고 마지막 배포할때는 제일 중요한 컨셉만 남기고 모두 지웠어요. 지울때는 아까운 감정도 들었는데 지금와서 생각해보면 지워도 큰 문제는 없었던 것 같아요.
그리고 애초에 정말 집중해야할 페이지에 더 시간을 쏟았으면 좋았겠다는 생각이 들어요. 다음에는 핵심기능에 더 많이 집중할 계획이에요.
개발자가 노코드로 활용하는법
노코더 뉴스레터를 작성하면서 최대한 비전공자 눈높이에서 글을 작성하고 싶었어요. 그래서 이번 앱은 서버개발 없이 노코드 툴만 활용해서 만들었어요. 물론 노코드 도구가 생산성 향상에 도움을 주었지만 반대로 개발자로서 제약을 받는 것들도 있었어요.
서버개발을 하지 않고 API 값을 그대로 받으니 오히려 프론트단이 복잡해졌어요. 예를 들어 ChatGPT와 연동한다고 했을때 결과값을 텍스트로 받았어요. 그리고 이를 Json으로 로드하는 과정을 Flutterflow에서 진행했어요. 개발경험이 좋지 않았어요. 이는 차라리 서버를 개발해서 Json형태로 프론트엔드에 전달하는 것이 훨씬 좋은 경험이 될 것 같아요
보안상 문제가 생길 수 있어요. 다른 API 연동을 서버를 거치지 않고 프론트에서 직접하게되면 API Key가 그대로 노출되는 문제가 있어요. 특히 웹 배포시 문제가 될 수 있어요.
이제는 서비스를 만들기 위해서 노코드만 사용하지 않고 노코드와 코드 작업을 병행해서 진행할 계획이에요. 프론트단은 노코드로 작업을 하고 백앤드는 코드 작업을 진행할 계획이에요.
앞으로의 계획
뉴스레터는 앞으로 주기적으로 발송하기 보다 공유하기 좋은 내용이 있으면 작성해서 전달드릴 예정이에요. 보다 도움이 되는 내용으로 전달드릴게요 :)
그리고 지난 3개월동안 외주 개발을 병행하면서 노코드 강의, 개인 개발 프로젝트를 병행했어요. 다음달부터 3개월동안은 외주개발보다는 아내와 함께 하나의 서비스를 만들어볼 계획이에요. 뉴스레터를 통해서 좋은 소식있으면 공유해드릴게요!
그리고 뉴스레터 콘텐츠는 앞으로 노코드를 활용한 개발 이야기를 지속적으로 다룰 예정이에요. 이번 외주 개발에서 ChatGPT로 Customer Service를 자동화하고 Character.ai와 유사한 서비스를 구축하고 있어요. 이들은 모두 프론트 개발자 없이 노코드 툴과 함께 백앤드, AI 개발을 진행했어요. 개발할 때 경험했던 이야기들도 공유드리도록 하겠습니다!
의견을 남겨주세요