[인디 앱개발] ✨ 앱 기획부터 출시까지 참고한 링크 - 앱 기획, 디자인, 개발, 배포 준비

iOS

[인디 앱개발] ✨ 앱 기획부터 출시까지 참고한 링크 - 앱 기획, 디자인, 개발, 배포 준비

Applecider 2022. 7. 20. 17:47

최근 2개월 동안 개발했던 앱을 출시하게 됐다.

기획부터 시작해서 디자인, 서버 개발, iOS 개발에 직접 관여하며 진행했던 프로젝트인 만큼 재밌었고 배운 게 많았다.

그 과정에서 단계별로 고려했던 점과 유용한 사이트를 공유하려고 한다.

✏️ 기획

프로젝트 실행 목적과 목표를 설정한다.
이때 목적은 취준용 앱 출시 경험일 수도, 평소 만들고 싶었던 서비스를 구현하는 것일 수도 있다.
팀원, 진행 기간, 출시 목표일정, 타깃 사용자 등을 설정한다.
개발자 지인이 있다면 기술 난이도에 대해 조언을 구한다.
앱 출시 이후 업데이트를 진행해도 되므로 일단 최소한의 기능을 담은 MVP를 고민한다.
과욕을 부리면 나중에 꼭 후회하게 된다. 최소한의 기능만 구현해도 예상보다 오래 걸린다.
디스코드 채널 개설, Notion, 구글 스프레드시트, 구글 드라이브, HackMD (다중커서 작업 가능)을 통해 팀의 소통 창구를 만든다.
히스토리 관리가 어려운 카카오톡은 비추
앱의 복잡도에 따라 와이어프레임 (필수), 정보구조도, WBS, 프로토타입 등을 활용한다.
기능이 복잡하지 않다면 Figma를 사용하여 와이어프레임만 나타내도 충분하다.
프로토타입은 프로토파이가 유명하다고 한다.
기획문서의 종류는 이 블로그, 앱 설계서 작성방법은 이 블로그, 화면설계 및 프로토타이핑 툴의 종류는 이 블로그를 참고

🎨 UX / UI 디자인

<'네이버웹툰' 모바일 서비스 UX를 분석해보자> 시리즈 : 네이버웹툰 앱을 예시로 UX 관련 고려사항을 쉽게 설명한다.
Apple의 HIG 문서 (Human Interface Guidelines) : Apple의 디자인 원칙을 설명하는 문서이며, 디자이너/기획자/개발자 모두 읽어야 한다.
디자인 툴은 Figma (무료), AdobeXD (유료) 등을 많이 사용한다.
앱의 주요 기능을 고려해서 먼저 대략적인 컨셉을 정한다.
게임 앱이라면 컴포넌트를 둥글고, 포인트 컬러를 2~3개 사용하는 귀여운 컨셉으로
이커머스 앱이라면 선이 얇고, 미니멀한 디자인을 사용하는 세련된 컨셉으로 잡는 것이 좋다.
컨셉을 정했다면 컴포넌트, 탭바, 네비게이션바 등의 구체적인 형태를 잡는다.
비슷한 앱을 여러 개 다운받아서 살펴보거나, Pinterest에서 이미지를 검색해보자.
(검색 키워드 : App design, Mobile app UX/UI 등)
포인트 컬러를 정할 때 Pinterest에서 Color palette로 검색하면 유용하다.
컴포넌트가 너무 밋밋해 보이거나, 특정 버튼을 강조하고 싶다면 그림자 효과를 주면 좋다.
기본 한글 폰트가 구려 보여서 커스텀 폰트를 사용하고 싶다면 구글 무료 폰트, 네이버 무료 폰트를 사용하면 된다.
이미지 또는 아이콘이 필요하면 Unsplash, Shutterstock 등의 무료 저작권 사이트를 활용한다.
애니메이션은 Lottie가 유용하다.

🤖 서버 개발

흔한 아이디어인데 출시된 앱이 별로 없다면, 그만한 이유가 있을 수 있다.
대표적인 이유는 DB 또는 서버 API가 구축이 안되어 있는 경우이다.
우리뭐먹지 프로젝트의 경우에도 처음부터 메뉴 DB를 구축하고, 추천 알고리즘을 설계하고, 서버 API를 만드는 작업을 모두 해야 해서 시간이 오래 걸렸다.
아이디어를 구상하는 단계에서 이미 만들어진 Open API 목록을 살펴보고 영감을 얻는 게 좋다.

📱 iOS 개발

작업을 세부적으로 구분하여 STEP별 명세서를 작성한다.
개발 도중에 디자인이나 서버 API가 변경되는 경우가 빈번하므로 디자이너 및 기획자와 긴밀히 소통하고,
개발 과정에서도 기능 변화에 대비하여 유지보수가 용이하고 가독성이 좋은 코드를 작성한다.
StyleShare, 에어비앤비 등의 Code Convention을 참고한다.
프로젝트 개발기간 동안 MacOS, Xcode가 자동 업데이트되지 않도록 설정한다.
Xcode 버전은 팀원과 동일한 것이 안전하고, Minor 버전이 0인 것은 피한다.
GitHub의 PR 기능을 통해 Feature마다 배경, 작업 내용, 테스트 방법, 리뷰 노트, 스크린샷을 남겨두면 협업에 큰 도움이 된다.
GitHub의 Wiki 기능을 통해 프로젝트 일정 및 아카이브 문서를 관리하면 좋다.
브랜치 관리는 Git Flow를 추천한다.
Git Flow 사용방법은 지난 포스트 GitFlow로 브랜치 관리하기를 참고
개발 중에 UX/UI 관련 커스텀 컴포턴트 또는 애니메이션 등을 고민할 때도 Pinterest가 유용하다.
(검색 키워드 : Tinder like swipe, Card swipe animation 등)
난이도가 있는 작업은 누군가 이미 구현해서 공개해뒀을 가능성이 높다.
GitHub에서 여러 라이브러리의 소스코드를 뒤져보면 힌트를 얻을 수 있다.
(검색 키워드 : Menu underbar, Underline menu bar, Custom segmentedcontrol 등)

🍎 배포 준비 (AppStore 심사 체크리스트)

Apple 공식문서의 AppStore 심사지침 : Apple이 민감하게 심사하는 요소를 알 수 있다.
*심사지침 요약은 지난 포스트 헬스케어 기능에도 민감하다를 참고

개발자 계정 (개인 $99, 팀 $299) : 1~4번은 AppStore Connect 사이트를 통해 생성한다.
*상세 내용은 이 블로그를 참고
인증서 (개발용, 배포용)
App ID
Provisioning Profile (개발용, 배포용)
개인정보 처리방침 : 개인정보보호포털 사이트에서 생성한다. URL을 제출해야 하므로 Notion으로 만드는 것을 추천한다.
Test Flight (생략 가능)
앱 아이콘 (로고)
- 1024*1024 이미지 1개 (png만 가능)를 준비한다.
- Xcode 14 미만인 경우, 또는 크기별로 이미지 디테일을 다르게 표현하고 싶은 경우에는 11개의 크기별 이미지를 준비한다.
*이미지 세트를 자동 생성해주는 사이트 참고
- Apple이 알아서 모서리를 둥글게 만들어주므로 배경이 정사각형 형태여야 한다.
AppStore 미리보기 영상 및 스크린샷
- 영상은 생략 가능하고, 스크린샷은 필수이다.
- Simulator 화면의 캡쳐본을 제출해도 되고, MockUp 툴을 활용해서 화면별 기능을 설명해주는 이미지를 만들어 제출해도 된다.
- 이미지 크기 때문에 심사 탈락하는 경우가 많다고 한다. Apple 공식문서의 스크린샷 사양을 꼭 확인하자.
- iOS만 지원한다면 총 2개 세트 (아래 1~2번), iOS/iPad를 모두 지원한다면 총 4개 세트 (아래 1~4번)를 준비해야 한다.
*요구사항 항목에 "앱이 iPhone에서 실행되는 경우 필요"라고 되어있으면 필수적으로 제출해야 한다는 뜻이다.
1) iPhone 6.5형 예시 : iPhone 13 Pro Max, 1284 x 2778 픽셀, 실기기처럼 홈버튼이 아닌 노치가 있으면 통과한다.
2) iPhone 5.5형 예시 : iPhone 8 Plus, 1242 x 2208 픽셀, 실기기처럼 홈버튼이 있으면 통과한다.
3) iPad 12.9형 예시 : iPad Pro(4세대, 3세대), 2048 x 2732 픽셀
4) iPad 12.9형 예시 : iPad Pro(2세대), 2048 x 2732 픽셀
App 기본 정보 : 앱 이름, 부제, 카테고리, 가격 등급, 개발자 연락처
AppStore 마케팅 문구 : 프로모션 텍스트, 설명 (더보기 항목), 등록 키워드 등이 필요하다.
- 마케팅 경험이 없다면 여기서 시간 소요가 크다. 주변 문과 친구들의 도움을 받으면 좋다.
*상세 내용은 이 블로그를 참고
앱 사용방법을 나타낸 영상을 참고하면 보다 신속하게 심사결과를 받을 수 있다. (생략 가능)
실기기로 앱을 실행화면을 녹화한 영상을 제출했었는데 심사요청 10분 만에 승인을 받을 수 있었다.