Kangsik Choi

Kangsik Choi님의 아티클

Kangsik Choi

Kangsik Choi

인스펙터를 통한 실제 프로젝트 QA 경험

안녕하세요.

인스펙터팀입니다.

저희는 태생이 외주 개발 업체로 시작하였습니다.

저희의 첫번째 제품인 민트앱도 모바일 앱 외주 경험을 바탕으로 하여 제작된것이고

인스펙터도 외주경험에서 나온 제품입니다.

이번에 인스펙터를 런칭하고 여행 플랫폼의 외주 신규 기능 개발을 진행하였습니다.

인스펙터로 외주 프로젝트의 QA를 진행한 후기를 적어보겠습니다.

1.테스트 작성이 편리한가?

나름 속도가 빨랐습니다.

예전의 QA를 진행할면서 테스트 항목을 적을땐 3(상세내용 포함):7(제목만 존재) 정도로 진행했었던것 같습니다.

예를 들어 페이스북 로그인 진행의 테스트 항목이 있을경우 QA 담당자가 테스트항목의 상세내용을 적을게 없습니다.

단순히 페이스북 로그인이 되는지 안되는지만 파악하면 되는것이기 때문입니다.

단, 테스트가 실패가 발생했을땐 커뮤니케이션이 이뤄져야만 합니다.

테스트 항목을 죽 작성하고 나니까 약 25개의 테스트 항목이 생성되었습니다.

약 5분 정도 소요되었던것 같습니다.

지라로 하나씩 버튼 눌러서 항목 등록할려고 생각하니 끔찍했습니다.

적게 잡아서 30분은 걸렸을것 같습니다.

(지라의 UX가 게시판 형태라 빠르게 테스트 항목을 적을수가 없네요.)

인스펙터를 조금은 잘 만들었단 생각도 들었습니다. ^^

2.테스트 실행이 편리한가?

테스트결과가 성공 일때는 정말 빠르게 진행되었습니다.

실행화면 띄어두고 인스펙터 띄어두고 실행 테스트 후 인스펙터에 성공실패 버튼 클릭을 하면 하나의 테스트가 완료되었습니다.

CleanShot 2024-05-04 at 22.04.12.png

테스트 결과가 실패일때도 빠르게 진행이 되었습니다.

하지만 진행과는 별개로 실패의 스크린샷을 업로든 하는 과정에서 약간 불편한 감이 있었습니다.

차후에 수정이 필요한 항목입니다.

통계 데이타도 잘나왔네요. ^^

CleanShot 2024-05-04 at 22.05.11.png엑셀로 내보내기를 하여 1차로 고객에게 전달후 실패된건에 대해서 재수정하여 2차 QA를 진행하고

모두 실패 0%하여 정상적으로 기능이 하나 배포 되었습니다.

CleanShot 2024-05-04 at 22.06.02.png

3.추가해야될 사항

실제로 고객 입장에서 앱을 사용해보니 2~3가지의 수정사항이 보였습니다.

(1).대량 입력 기능

엑셀처럼 입력하는것도 좋지만 대량으로 100개 정도를 밀어 넣는 기능이 필요해 보였습니다.

그래서 여행 플랫폼 기능 개발QA완료후 바로 인스펙터에 반영하였습니다.

CleanShot 2024-05-04 at 22.11.52.png

(2).대량 삭제 기능

현재는 테스트 항목을 만들고 삭제를 하기 위해선 메뉴 버튼을 눌러서 하나씩 삭제 할수 밖에 없었습니다.

CleanShot 2024-05-04 at 22.12.07.png

외주과업을 진행할때 마다 피드백을 받아서 더 발전시킬수 있도록 하겠습니다.

감사합니다. ^^

인스펙터

QA 테스트 케이스 관리 시스템

2
0
Kangsik Choi

Kangsik Choi

인스펙터의 주요기능

안녕하세요. 인스펙터팀입니다.

인스펙터의 기본 소개는 아래 블로그를 참고 부탁드립니다. ^^

1.대량 테스트 케이스 입력

테스트 케이스를 관리할때 가장 힘든점은 테스트 케이스를 등록하는 과정일것입니다.

지라 레드마인 먼데이닷컴 등 이슈 관리툴에서 등록하기 위해선 제목 내용등의 많은 내용을 적어야만 하나의 테스트 케이스가 생성이 됩니다.

테스트 케이스 하나 등록하는데 1분정도 소요된다고 가정하면 500개의 테스트 케이스를 등록하기 위해선 약 500분(약 8시간)이 소요됩니다.

이러한 과정을 신규 기능을 QA 할때 마다 반복을 해야합니다.

간단한 테스트 케이스는 한줄로 빠르게 작성할 필요가 있는데 지라레드마인 먼데이 닷컴등은 입력형식이 데이타를 다 넣도록 되어있어서 오랜시간이 소요될수 밖에 없습니다.

그래서 저희 인스펙터 팀은 빠르게 테스트 케이스 작성을 우선 목표로 설정하여 개발을 진행하였습니다.

(1).테스트 시트에서 다수항목 생성을 클릭합니다.

CleanShot 2024-05-02 at 10.06.00.png

(2).대량으로 테스트 케이스 등록화면이 나오면 편집을 진행하시면 됩니다.

CleanShot 2024-05-02 at 10.11.07.png

(3).한줄에 하나씩 편하게 편집하시면 됩니다.

CleanShot 2024-05-02 at 10.25.41.png

(4).한줄에 하나씩 편집하고 등록을 하면 됩니다.

CleanShot 2024-05-02 at 10.26.07.png

(5).등록을 하시면 테스트항목이 등록된것을 확인하실수 있습니다.

CleanShot 2024-05-02 at 10.27.43.png

(6).등록된 테스트 항목을 상세히 편집하기 위해선 편집모드를 선택하여 상세 설명을 적을수 있습니다.

CleanShot 2024-05-02 at 10.29.25.png

저희 인스펙터 팀은 테스트 케이스를 편하게 작성할수 있도록 최적의 솔루션을 개발하겠습니다.

궁금한점 있으시면 언제든 문의 남겨주세요.

감사합니다.

https://www.inspecter.io/

6
0
Kangsik Choi

Kangsik Choi

안녕하세요. 인스펙터 팀입니다.

QA 테스트 관리 시스템을 홍보하고 다시 돌아온지 5개월이 걸렸네요.

알파테스트에 부족한것을 수정하다보니 기술의 문제가 있어서 기술스택을 전체 수정하였습니다.

그래서 예상 오픈 시점보다 많이 늦어졌습니다.

많은 양해 부탁드립니다.

그럼 저희 인스펙터를 특징을 소개하도록 하겠습니다.

1.테스트 시트 작성의 편리함

-지라,레드마인,먼데이닷컴등.. 이슈 관리툴을 QA 툴로서 도입시 어려운점은 테스트 케이스 작성에 오랜 시간이 소요된다는 점입니다.

지라를 예로 들어 QA의 테스트 케이스를 작성하는것을 적어보겠습니다.

위의 항목을 다 적어야만 1개의 테스트 케이스가 생성됩니다.

제품이 릴리즈 할때 케이스가 기본 500개 이상 되는데 테스트 케이스 적다가 정작 중요한 QA 본연의 업무를 못할수 있습니다.

따라서 인스펙터 팀에서 가장 중요하게 생각하고 만든것은 테스트 케이스 작성이 엑셀만큼 편리해야 한다는 생각으로 제품을 개발하였습니다.

아래는 인스펙터에서 테스트 케이스를 등록하는 방법입니다. 

엔터로 편집하고 아래의 화살표를 눌러서 다음 테스트 케이스를 생성하는 방식입니다. 

(1).빠르게 테스트 케이스를 작성

(2).테스트케이스의 상세 내용 작성

기타 상세한 내용이 필요할땐 상세 내용을 작성하실수 있습니다. 

(3).대용량으로 테스트 케이스를 넣음.

줄바꿈으로 하나의 테스트케이스를 생성할수 있습니다. 

엑셀이나 구굴쉬트의 내용을 붙여 넣기할수 있습니다. 

2.테스트 실행의 편리함

테스틀 실행할때 엑셀이나 구글쉬트보다 빠르게 입력할수 있는 실행을 구현하였습니다. 

(1).빠르게 실행할수 있도록 구현

성공 실패 보류를 눌러서 테스트의 결과를 빠르게 생성할수 있습니다. 

테스트 결과를 생성한후 상세 내용과 파일도 등록할수 있습니다. 

결과 선택시 다음으로 체크박스를 클릭하면 선택후 바로 다음 테스트로 이동합니다. 

https://www.inspecter.io 

상세한 내용은 블로그에서 확인 하실수 있습니다.

추가 적으로 필요한 사항은 계속 올리도록 하겠습니다. 

감사합니다. 

4
0
Kangsik Choi

Kangsik Choi

inspecter의 가장 기본적인 기능

테스트를 작성하는 부분입니다.

엑셀보다 편하게 QA 테스트 케이스를 생성하는것이 목표입니다.

테스트 케이스의 주요 내용을 입력하면 되도록 만들었습니다.

ezgif-5-e61d36f033.gifinspecter를 만들때 가장 신경쓴 부분이 테스트 케이스 만들때 엑셀보다 편하게를 목표로 만들었습니다.

ezgif-5-25902c590a.gif그리고 상세에 필요한 내용 및 담당자 등을 설정할수 있습니다.

4
4
Kangsik Choi

Kangsik Choi

민트앱 앱 사용시간 통계가 출시하였습니다.


 개요

민트앱에서는 고객이 접속한 데이타의 통계를 저장하고 있습니다. 

하지만 앱이 접속만 하고 실제로 얼마나 앱을 사용하는지도 매우 중요합니다. 

따라서 앱 사용시간 통계도 추가하였습니다. 

 

 

설명

민트앱의 대쉬 보드에서 일주일간 평균 앱 사용시간을 확인할수 있습니다. 

 

아직 앱이 전체적으로 배포가 되지 않았기 때문에 수치는 부정확 할수 있습니다. 전체적으로 앱이 업데이트가 완료되면 정확한 앱의 사용시간이 나올것입니다. 

 

기존의 모든 고객들의 앱들도 업데이트를 진행하도록 하겠습니다. 

 

앱의 평균 사용 시간은 38초네요.

시간별,일별,월별로 앱의 총 사용시간 및 평균 사용시간이 계산되어 나옵니다. 

 

 

일별 앱 총사용시간도 확인할수 있습니다. 

6월 6일의 총 앱사용시간은 288분인걸 확인할수 있습니다. 

 

고객은 양질의 컨텐츠를 늘려서 앱에 많이 머무르도록 노력을 해야될것입니다. 

그 뒷받침은 민트앱이 하겠습니다. 

 


민트앱

하이브리드 웹앱 솔루션입니다.

1
1
Kangsik Choi

Kangsik Choi

앱 사용시간 측정하기

민트앱은 현재 접속기록만 측정하여 통계 데이타를 제공하고 있습니다.


고객은 앱접속 기록 뿐 아니라 앱을 얼마나 많이 사용하고 있는지도 체크가 필요합니다

따라서 앱 사용시간을 기록하는 기능을 개발중에 있습니다.



1.개발 방법

앱에서 포그라운드에 앱이 진입하였을때 앱 타임을 측정합니다.

앱이 백그라운드로 갈때 현재 시간을 계산하여 서버에 데이타를 업로드 합니다.


2.서버

데이타를 받아서 엘라스틱서치에 통계 데이타를 계산하여 넣어둡니다.


3.앱의 접속 기록의 통계를 보여줄때 접속 기록과 함께 앱의 사용시간도 같이 보여줄예정입니다.



금주부터 작업이 진행된 관계로 차주에 베타를 실시하여 빠른시일내에 정식 버젼으로 찾아뵙겠습니다.


감사합니다.




5
1
Kangsik Choi

Kangsik Choi

달력보기가 정식 출시되었습니다.

개요

민트앱에서는 고객이 접속한 데이타의 통계를 저장하고 있습니다. 

고객의 앱이 성장하기 위한 기본적인 지표는 현재 앱의 사용량(DAU/MAU) 입니다. 

따라서 고객의 앱이 성장할수 있도록 DAU/MAU를 달력을 통해 보여주고 있습니다.

 

설명

민트앱의 DAU/MAU 탭을 클릭하시면 아래와 같은 디자인을 확인 할수 있습니다. 

 

각각의 날짜에 그날 활성화된 사용자를 보여주고 있습니다. 

원하는 날짜를 클릭하시면 그날에 접속자수를 보여줍니다. 

 

아침 9~10시사이에 고객이 많이 사용하고 있습니다. 

이런 그래프를 그리는 앱들은 주로 아침에 마케팅을 진행을 하는게 좋습니다. 

 

 

민트소프트는 모바일 앱 개발 전문회사입니다. 하이브리드앱,크로스플랫폼,네이티브영역 전반에 걸친 모바일 앱을 개발하고 있습니다.

하이브리드는 민트앱이라는 솔루션을 보유하고 있어서 Time To Market에 매우 유리합니다. 

언제는 찾아주시면 신속하고 빠른 상담을 진행하도록 하겠습니다. 

 

https://www.mint-soft.com 

3
0
Kangsik Choi

Kangsik Choi

민트앱 달력기능 베타를 시작합니다.

DAU/MAU를 한눈에 파악하기 위하여 달력으로 표기를 하는 기능입니다.


고객들은 앱을 사용하면서 DAU와 MAU를 확인하고자 할때 달력으로 바로 파악이 되도록 하였습니다.




일별로 어느 시간대에 가장 많이 앱을 사용하는지도 파악이 가능합니다.


아직은 베타 버젼이고 6월초 정식 출시 될예정입니다.

감사합니다.




2
0
Kangsik Choi

Kangsik Choi

앱의 삭제 통계가 정식출시 되었습니다

개요

민트앱은 고객사의 앱이 성자하기 위한 여러가지 지표를 제공하고 있습니다. 

그중에 다른 서비스들과 차별화 되는 부분이 바로 앱의 삭제통계를 제공한다는 점입니다.

 

앱은 설치횟수도 중요하고 다수의 앱이 설치하는것도 중요합니다. 

하지만 앱이 삭제되지 않도록 고객 관리하는것이 더욱 중요합니다. 

 

 

설명

민트앱은 일별로 하루에 삭제된 디바이스 갯수를 관리하고 있습니다. 

 

대쉬보드에 보시면 삭제갯수를 확인할수 있습니다.

 

또한 일별로 삭제된 디바이스의 지표를 제공하고 있습니다. 

 

고객사들은 앱이 성장할수록 삭제도 많이 이뤄지지만 좋은 컨텐츠로 삭제가 이뤄지지 않도록 많은 노력이 필요합니다. 

앱의 성장의 뒷받침은 민트앱에 맡기시고 앱의 성장을 이뤄내시기 바랍니다. 

 

2
5
Kangsik Choi

Kangsik Choi

민트앱 앱의 스크린샷 템플릿

민트앱에서는 앱의 스크린샷도 제작하고 있습니다.

기본적으로 스크린샷을 생성할 URL을 주시면 자동화된 크롤링 도구로 스크린샷을 생성하게 되어있습니다.


크롤링 도구로 생성된 스크린샷은 목업이 없습니다.

따라서 고객이 별다른 요청이 없을경우 스크린샷의 목업을 민트앱에서 진행하여 배포하고 있습니다.



XD,Figma의 파일로도 배포하고 있습니다.

고객의 원하시는 스크린샷을 배포하실경우 위의 스크린샷 템플릿을 받으셔서 민트앱에 올려주시면 됩니다.



url thumbnail

스크린샷 샘플

https://docs.mint-app.com/files/sample



민트앱은 하이브리드 웹앱 패키징 솔루션입니다. 언제든 편하게 연락주세요

2
0
Kangsik Choi

Kangsik Choi

[laravel] 캐쉬를 사용하여 화면 로딩을 빠르게!!

개요

민트앱에서는 고객의 통계 데이타를 ElasticSearch에 저장하고 있습니다.

물론 ElasticSearch는 빠르지만 캐쉬보다는 빠르진 않습니다.

민트앱의 대쉬보드 페이지는 많은 데이타를 한꺼번에 쿼리를 해와서 보여주고 있습니다. 

mysql,elasticsearch,dynamodb 등에서 데이타를 가져와서 처리하고 있습니다.


개발 

캐쉬 사용 여부 체크

먼저 캐쉬가 가능한 데이타와 실시간데이타가 필요한 내용을 분리합니다. 

실시간성으로 확인이 되어야 하는 데이타

 -접속 디바이스

 -신규유저 


캐쉬가 되어도 무방한 데이타

 -DAU,MAU

 -앱 접속자 통계 

 -버젼별 통계



위의 규칙에 따른 라라벨에서 데이타를 가져오는것을 만들어봅니다. 

//이번달 통계 데이타 (ElasticSearch)
//캐쉬 키를 프로젝트 아이디 + 원하는 키값
 $thisMonth = Cache::remember($projectId . '_au_thisMonth', intval(env("STAT_CACHE_SECOND")), function () use ($projectId) {
  return ElasticDeviceActiveService::getMonthlyStat($projectId,
    Carbon::now()->year,
    Carbon::now()->month);
});

//최신 사용자 등록
//dynamodb에서 최신 값을 가져옴.(캐쉬 미사용)
$pushes = UserPushModel::where('project_key', $project->id)
  ->where("timestamp", "<", Carbon::now()->getPreciseTimestamp(3))
  ->decorate(function (RawDynamoDbQuery $raw) {
    $raw->query['ScanIndexForward'] = false;
  })
  ->withIndex('project_key-timestamp-index')
  ->limit(20)
  ->get();

결론

프로젝트 대쉬보드에 최초 1회는 캐쉬에 데이타를 가져와야되서 느리지만 그 이후에는 빠르게 동작하는것을 확인할수 있습니다. 

데이타 바인딩을 ajax로 변경한다면 더욱 빠르게 화면이 로딩이 될듯하므로 추가 작업이 필요할듯 합니다. 

라라벨의 캐쉬는 provider가 다양하므로 어떤걸 써도 속도가 빨라지니 다들 프로젝트에 추가하시는걸 추천 드립니다. 



1
0
Kangsik Choi

Kangsik Choi

버젼관리 기능의 업그레이드

개요

민트앱은 주기적으로 os 업데이트,라이브러리 버전 변경,앱의 신규 기능,버그 수정등으로 인해 인해 앱의 업데이트를 진행합니다.

앱의 버젼별 사용량을 확인할수 있도록 앱의 버젼별 배포 기록을 제공하고 있습니다. 

 

 

설명 

ios 버젼 기록

 

안드로이드 버젼 기록

 

 

실제로 고객이 사용하는 버젼 통계

안드로이드의 실제 사용하고 있는 버젼을 차트로 한눈에 볼수 있습니다. 

마찬가지로 ios의 실제 사용하고 있는 버젼을 차트로 한눈에 볼수 있습니다. 

 

결론

민트앱은 고객의 앱을 주기적으로 관리하고 있고 버그에 대응을 잘하고 있습니다. 

하이브리드 웹앱을 이용하시려면 언제는 문의 주세요. 

https://www.mint-app.com 

 

민트앱

하이브리드 웹앱 솔루션입니다.

3
1
Kangsik Choi

Kangsik Choi

MAU,DAU가 추가 되었습니다

개요

민트앱은 하이브리드 앱 제작 플랫폼으로써 쉽고 빠르게 웹앱을 제작할수 있는 플랫폼입니다.

앱의 지표를 가장 확실하게 알수 있는 MAU,DAU의 정보를 추가하였습니다. 

 

사용법

고객의 프로젝트의 대쉬보드에서 한눈에 알수 있도록 표기가 되어있습니다. 

DAU가 500명 정도, MAU가 약 5000명 정도 되는 앱입니다. 

 

또한 그래프로 보실려면 통계>접속 통계를 확인하시면 됩니다. 

일단위:DAU

월단위:MAU

 

또한 엑셀 파일로 다운로드가 가능하여서 수치를 보고하거나 할때 유용할것입니다. 


2
0
Kangsik Choi

Kangsik Choi

민트앱 직접 빌드 기능이 추가되었습니다

개요

민트앱은 하이브리드 앱 제작 플랫폼으로써 쉽고 빠르게 웹앱을 제작할수 있는 플랫폼입니다. 

초기 인증서 및 키값을 민트앱에서 설정하고 이후에는 고객이 직접 빌드를 하실수 있도록 기능이 추가되었습니다. 

서버 및 기타의 문제로 앱이 빌드가 실패 하는경우는 1시간 이후 재설정 되오니 재빌드를 진행해주시면 됩니다. 

 

 

 

ios 사용법

1.먼저 앱 빌드 목록으로 들어갑니다. 

 

2.새로운 빌드 버튼을 눌러서 빌드 정보를 입력합니다. 

url을 다르게 빌드하기 위해선 URL 관리로 가서 URL을 추가해주시면 됩니다.

버젼은 최신 빌드 이후에 패치 버젼이 자동으로 올라가도록 되어있습니다. 

원하시는 버젼을 입력하시면 됩니다. 

 

3.빌드를 누르시면 자동으로 앱이 빌드가 됩니다. 

자동으로 빌드가 진행됩니다. 

 

4.완료가 된 빌드는 애플 테스트 플라이트를 사용하여 테스트를 하실수 있습니다. 

 

 

안드로이드 사용법

1.먼저 앱 빌드 목록으로 들어갑니다. 

2.새로운 빌드 버튼을 눌러서 빌드 정보를 입력합니다. 

apk는 테스트용 빌드입니다.(폰에 직접 설치가 가능한 버젼입니다.)

aab는 플레이스토어에 업로드 할수 있는 버젼입니다. 

 

3.빌드가 자동으로 진행됩니다. 

 

4.빌드가 성공하면 파일을 다운로드 하실수 있습니다. 

QR 코드가 나오면 앱에서 직접 다운로드 하실수 있습니다. 

 

 

이상으로 민트앱의 신규 기능에 대해서 알려드렸습니다.

2
0
Kangsik Choi

Kangsik Choi

접속위치 통계 정식 출시 되었습니다.

민트앱의 통계 페이지의 접속위치를 클릭을 합니다.

접속아이피 별로 같은 접속자로 체크하여 위치를 표기 합니다.

우리 서비스가 어디에서 많이 접속하는지 확인하여 지역별 서비스에는 큰 도움이 될것입니다. 

이상으로 민트앱의 접속위치 서비스에 대해 알려드렸습니다. 

많은 이용 부탁드립니다. 

3
2