Notice
Recent Posts
Recent Comments
Link
Tags
- orthogonalScrollingBehavior
- CollectionView
- Human Interface Guidelines
- Split View
- iTerm
- 애플
- WWDC
- 스위프트
- Apple
- LanguageGuide
- Keychain
- 앱개발
- 전달인자 레이블
- IOS
- 야곰아카데미
- Accessibility
- GOF
- 디자인패턴
- Combine+UIKit
- github
- UILabel
- TOSS
- lineBreakMode
- DiffableDataSource
- HIG
- iPad
- lineBreakStrategy
- UIKit
- 애플사이다
- Swift
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | |||||
3 | 4 | 5 | 6 | 7 | 8 | 9 |
10 | 11 | 12 | 13 | 14 | 15 | 16 |
17 | 18 | 19 | 20 | 21 | 22 | 23 |
24 | 25 | 26 | 27 | 28 | 29 | 30 |
- Today
- Total
애플사이다의 iOS 개발 일지
[인디 앱개발] ✨ 앱 기획부터 출시까지 참고한 링크 - 앱 기획, 디자인, 개발, 배포 준비 본문
최근 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분 만에 승인을 받을 수 있었다.
📣 홍보 / 마케팅
출시 직후 단기간에 다운로드 수가 높아야 AppStore 추천 앱에 언급될 수 있다.
오픈카톡, 디스코드, IT서비스 관련 SNS 등 개발자 커뮤니티를 통해 홍보해야 한다.
홍보에 크게 신경 쓰지 못하더라도 ASO (앱스토어 최적화), SNS 마케팅은 해야 하는 것 같다.
- 디스콰이엇 : IT 서비스 메이커들의 소셜 네트워크이다. 앱을 게시하거나, 기획자/디자이너/투자자 등과 소통할 수 있다.
- 앱스토어 최적화(ASO) 알아보기 포스트
- iOS 개발자 커뮤니티의 추천앱 탭
- 앱 출시 후 홍보에 대한 생각 포스트, 9가지 앱 마케팅 전략 포스트
- Reference
- 본문의 링크 참고
- 관련 포스트
- 🌐 우리뭐먹지 - 프로젝트 GitHub WiKi
- 🔗 우리뭐먹지 - 앱 다운로드 링크
🍎 포스트가 도움이 되었다면, 공감🤍 / 구독🍹 / 공유🔗 / 댓글✏️ 로 응원해주세요. 감사합니다.
'iOS' 카테고리의 다른 글
[Redirect] 설정 앱을 띄워서 특정 앱의 설정 변경하기 (간단) (0) | 2022.11.14 |
---|---|
[Redirect] 업데이트 버튼 탭하면 사용자에게 AppStore 앱 띄우기 (간단) (0) | 2022.11.11 |
[CollectionView] 배너 하단에 PageControl 구현 - FooterView에 넣기 (0) | 2022.06.15 |
[CollectionView] estimatedHeight 사용 시 is stuck in its update/layout loop 에러 발생 (0) | 2022.06.13 |
야곰아카데미 <iOS 커리어 스타터 캠프> 후기 - iOS 앱개발 부트캠프 (6) | 2022.05.01 |
Comments