일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
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 |
- 안드로이드
- S3
- TypeScript
- fanzeel
- beanstalk
- Route53
- 감사일기
- 페이스북
- JavaScript
- 네이티브
- node
- 웹뷰
- swift
- NeXT
- cors
- https
- 알려줌
- 도메인
- angular
- ios
- hybrid
- Android
- Elastic Beanstalk
- 카카오톡
- react
- nextjs
- php
- node.js
- angular4
- AWS
- Today
- Total
쪼렙 as! 풀스택
[개발후기] 매일감사 매일기도 - iOS, Android 앱 본문
AWS - ElasticBeanstalk, RDS, S3, CloudFront
PHP - CodeIgniter
Android - JAVA, iOS - Swift
참여율 100% - 혼자 다 만들었다.
매일매일 '감사일기'를 기록하거나, 기도 제목을 적을 수 있는 크리스찬을 위한 앱.
외주로 만든것도 아니고, 어떤 수익을 바란것도 아니고, 그냥 '재능기부' 식으로, 혼자 운영하고 있는 앱 서비스.
1. 편지지(배경화면)에 작성한 글을 어떻게 제공할 것인가? 이미지? 텍스트?
사용자가 편지지에 글을 쓰고, 글의 위치를 마음대로 조절할 수 있게 개발을 하였다. 그러다보니, 완성된 편지를 어느 환경에서 보아도 똑같이 볼 수 있게 하려면, 이미지로 서비스해야겠다고 생각하고, 사용자가 글 작성을 완료하면, 화면 자체를 저장하여 '이미지'로 만들고, 그 이미지를 파일서버로 업로드했었다.
문제점 - 글을 수정할 수 가 없다. 이미지 이기때문에... ㅡ,.ㅡ; 글을 수정하려면 삭제하고 다시 작성해야하는 불편함이 있었다. 그래서 텍스트 방식으로 완전히 변경하였다.
이후에는 사용자 환경마다 다 다르게 보이는 단점이 생겼다. 특히나 화면의 넓이가 다 다르기 때문에, 줄바꿈이 글쓴이의 의도대로 보여지지 않을 가능성이 매우 많았다. 또한 화면 크기가 다 다르기 때문에, 글씨크기를 화면 크기에따라 동적으로 조정해줄 필요가 있었다. 그래서 폰트의 크기를 px 로 저장하지 않고, 화면크기의 비율로 (1미만의 float값)으로 저장했다. 그리고 사용자 기기의 크기마다 동적으로 폰트 크기를 계산해서 보여줬더니, 거의 대부분 사용자가 작성한것과 비스무리(?) 하게 보일 수 있었다. 이미지로 처리할때처럼 완벽하게 동일하게 보일 수는 없겠지만, 어차피 글쓴이 본인에게는 본인 의도대로 보일것이고, 글을 수정할 수 있는 기능을 제공하는게 더 중요하기 때문에 이정도로 만족하기로 했다.
2. 편지지에 직접 쓰는 느낌을 최대한 살리기 위한 노력들 (터치 이벤트)
편지지를 선택하고, 그 편지지에 글을 직접 작성할 수 있고, 글의 위치를 마음대로 조정할 수 있게 만들었다.
문제는 글의 위치를 마음대로 조정할 수 있어야 하다보니, 레이아웃이 굉장히 많이 겹친 상태에서, 터치이벤트를 아주 상세하게 다뤄야만 했다. 글을 작성하고 있는 상태에서의 터치는 커서를 움직여야 했고, 편집중이 아닐때는, 글의 위치를 조정할 수 있어야 했고, 심지어 아이폰에서는 키보드를 밀어내릴 수도 있어야 했다.
글의 위치를 조정하기부터 쉽지 않았다. 사용자가 편리하고 자연스럽게 움직일 수 있게 하려면, 터치 이벤트가 발생하는 곳과 현재 위치등의 상관관계의 계산을 상세하게 해주어야만 했다.
글 편집중 상태가 아닐 때는 터치할 때, 이게 글의 위치를 변경하기 위함인지, 글을 작성하기 위한 터치인지도 구분해줘야 했는데, 'Tap Event' 와 'Pan Event' 를 구분해줘야 했다.
또다른 이슈는 글 편집중에 커서를 움직일 때는 레이아웃의 순서 때문에 Pan Event 가 먼저 발생해버렸는데 이때는 'onInterceptTouchEvent'를 통해서 터치이벤트를 중간에서 인터셉트하여 처리해야하기도 했다.
3. 사용자가 많아지면서 생긴 에로사항들 - 기기 블랙리스트, 단어 필터, 글 쓰기 제한 기능등의 도입
그냥 혼자 만들어본 프로젝트라서, 이렇게 많은 사람들이 사용하게 될줄 몰랐는데, 가입자가 3,000명쯤 되기 시작할 때부터는, 이상한 글들이 올라오기 시작했다. 주기적으로 자기한테 돈좀 보내달라고 파밍글을 올리는 사람이 생겼다.
처음에는 그 계정만 차단했다. 그랬더니 다른 계정으로 계속 가입해오면서 글을 올리기 시작했다. 계정 블록으로는 안되는구나.
그래서 다음부터는 기기 자체에 블랙리스트 기능을 만들었다. Android 와, iOS 에 있는 uuid 를 이용해서, 특정 기기들은 아예 로그인이 안되게 막아버렸다.
그랬더니, 이제는 한두달에 한번씩 기기를 변경해서 오드라... 크아... 정말 끈질긴 사람... 그래서, 단어필터를 이용해서 특정단어 (xx 은행, 뱅크, 등등) 이 포함된 글은 그냥 '비공개'처리를 해버렸다. 그 후로는 그 글이 사라졌다.
이후에 생긴 문제는, 남들이 공감할 수 없는 내용으로 도배를 하는 사람이 생겨났다. 서비스를 운영하는 입장에서는 이게 정말 안좋다. 그래서 고육지책으로 '전체공개'하는 글은 하루에 한번만 작성할 수 있도록 변경했다. 원래 이 앱 자체가 '전체공개'가 주된 목적이라기 보다, 감사글을 저장/보관하는 목적이 크기때문에, 많은 회원들에게 더 좋은 환경을 제공할 수 있게 되었다.
4. 아직도 혼자 운영중
홍보조차 단한번 한적 없지만, 그래도 나름 7,000명이 넘는 가입자가 사용하면서, 좋은 평점을 많이 받은, 나름 애착이 있는 앱 서비스 이다.
나에게 수익이 되기는 커녕, 서버비가 나가고, 유지보수도 해야하는 사비들여서 운영하고 있는 서비스 이지만, 가끔 이렇게 좋은 리뷰가 달릴때마다 보람이 생긴다.
'포트폴리오 & 개발후기' 카테고리의 다른 글
[개발후기] Valuetong.com 부동산 실거래 정보 서비스 (0) | 2020.09.05 |
---|---|
[개발후기] 알쥐.net 개발 후기 (0) | 2019.01.16 |
[개발후기] 알지미디어 ALZi.me (FANZEEL.COM 리뉴얼) (0) | 2018.09.07 |
Angular5 -> React + next.js 로 프로젝트 갈아 엎은 썰 (Angular vs React 개인적 비교) (0) | 2018.08.28 |
사용 언어들. (0) | 2018.07.06 |