박상권의 삽질블로그

[안드로이드]Firebase Dynamic Link로 사용자 유입시키기 본문

IT/Android-TIP (한글)

[안드로이드]Firebase Dynamic Link로 사용자 유입시키기

박상권 2018.05.29 22:09





이 포스팅과 같은 내용의 동영상 강의를 확인하시려면 아래 영상을 시청해주세요

https://goo.gl/dbPCaA



어플리케이션 서비스들의 홈페이지를 들어가보면 아래와 같은 화면들을 만나볼 수 있습니다.

이런 서비스들은 서비스에 관심있는사람이 앱을 설치할 수 있도록 설치버튼을 보여줍니다.


                            

(참고로 저는 이 서비스들을 정말 좋아합니다. 기술력도 좋아합니다. 깎아 내리려는 의도는 없습니다.)


안드로이드 사용자는 구글플레이 이미지를 누르면 해당 마켓으로 이동될것이고, 아이폰 사용자는 앱스토어 이미지를 누르면 해당 마켓으로 이동될 것입니다.

하지만 안드로이드 사용자든 아이폰 사용자든 상관없이 설치버튼을 누르면 알아서 해당 사용자의 마켓에 맞게 이동시켜주는 방식이 더 좋은 화면UI 입니다.


또한 만약 이미 해당 서비스가 설치되어 있는사용자라고 하더라도 무조건 설치페이지로 보내버립니다.

그래서 이미 설치된 사용자라면 해당 버튼을 눌렀을때 앱을 실행시키도록 하는것이 더 좋은 방식이라고 생각합니다.








그래서 기획자는 아래와 같은 개발을 요구하게 됩니다.

- 사용자가 안드로이드인지 아이폰인지 구분해서 해당 마켓으로 보내주세요

- 이미 앱을 설치한 사용자라면 앱을 실행하게 해주세요

- 전 기획자니까 이 기능은 개발자님이 만들어 주셔야죠





대부분의 개발자분들은 딥링크를 활용해서 아래와 같이 구현하셨을겁니다.


주로 카드결제나 외부앱을 실행해야하는 경우 딥링크와 타임아웃으로 앱설치여부를 판단하는경우가 많습니다.

이런방식으로 어느정도 해결할 수 있긴하지만 기획자나 마케터가 이런 기능을 요청할때마다 개발자가 이런 형태의 html을 매번 만들어주어야 하는 번거로움이 있습니다.



이럴때 Firebase의 Dynamic link를 사용해주면 좋습니다.










Firebase Dynamic link는 위에서 매번 만들어주었던 기능을 간단하게 만들 수 있습니다.



Console에서 직접 링크 만들기

기획자나 마케터는 코드를 몰라도 개발자 없이 콘솔에서 직접 위와 같은 기능을 하는 링크를 생성할 수 있습니다.


Firebase의 콘솔에서 Dynamic link페이지를 들어갑니다.

앱이 설치되어있을경우 실행시킬 딥링크와 이름을 설정해줍니다.

딥링크를 받아서 해당 기능을 실행시키는 방법은 아래 샘플 코드에서 구현되어 있습니다.







앱이 설치되어있지 않은 사용자의 경우 해당 패키지의 구글플레이 설치화면으로 보내줍니다.

꼭 구글플레이 설치화면이 아니라 원하는 URL로 안드로이드 사용자를 연결 시킬 수도 있습니다.






Dynamic link에 캠페인 추적을 위한 utm_xxx 들을 넣어줄수 있습니다.





생성된 dynamic link는 실제로는 아래와 같은 url을 갖습니다.

dynamic link생성에 익숙해진다면 그이후로는 콘솔에서 작업없이도 url에서 필요한 파라미터들만 바꿔서 바로 원하는 url을 만들어 줄 수도 있습니다.


각 파라미터의 역할과 좀더 다양한 다른 파라미터들에 대해서 살펴보시려면 아래 문서를 참고하세요

https://firebase.google.com/docs/dynamic-links/create-manually?hl=ko











사실 Dynamic Link의 정말 좋은 기능은 이제부터 소개시켜드릴 기능입니다.



중고차 판매 시세 공유하기


저는 현재 PRND컴퍼니에서 헤이딜러라는 중고차 판매 가격비교 서비스를 개발하고 있습니다.

헤이딜러 서비스는 딜러에게 차량을 판매할때 경매시스템의 형태로 최고가 혹은 원하는 딜러에게 판매할 수 있는 서비스입니다.

최근에 추가된 시세조회 기능을 통해 각 차량별 딜러판매 시세를 미리 파악해볼 수 있습니다.


                






공유하기

만약 아반떼AD의 판매 시세를 친구에게 알려주기 위해 공유를 한다면 아래와 같은 과정을 거칠것입니다.

1. 친구에게 해당 차량의 시세정보와 서비스를 알려줌

2. 친구는 해당 서비스를 마켓에서 검색

3. 앱 설치

4. 메인화면 실행






5. 시세조회 기능 선택

6....7.....8....9....

10. 기타 등등의 과정을 거쳐서 친구가 공유해줬던 해당차량의 시세조회 기능에 도달하여 알게됨




수많은 단계를 거치다보면 어쩌면 그 친구는 해당 화면까지 도달하지 못했을수도 있습니다...










Dynamic Link로 공유하기

Dynamic Link를 사용한다면 단 3단계면 충분합니다.


1. 친구에게 공유할때 알아서 해당 정보의 Dynamic link가 함께 공유

2. 링크를 누르면 해당 마켓의 설치화면 이동

3. 설치후 실행시 해당 차량의 시세조회 기능에 바로 도달










이전 vs 이후



Dynamic Link를 적용하기 전과 후의 사용자가 거쳐야할 단계 차이를 명확하게 확인할 수 있습니다.

화면 단계단계마다 사용자가 이탈할 확률이 높아지기 때문에 서비스를 운영하는 입장에서는 최대한 이 단계를 줄여서 사용자가 원하는 정보에 도달시켜주는것이 중요합니다.

그렇기 때문에 Dynamic Link가 사용자를 유입시키는데 굉장히 효과적인 역할을 합니다.











활용할만한 사례들


Dynamic Link를 활용하기 좋은 사례들은 아래와 같습니다.


광고/판매페이지 -> 앱안에서의 해당 화면


항공권 예약서비스 혹은 쇼핑몰 등에서 친구에게 해당 상품을 알려주고 그 친구가 서비스에 진입했을때 바로 해당 상품의 화면으로 이동시킬 수 있을 것입니다.





숙박/게임 서비스 추천인코드 입력

호텔이나 기타 서비스에서 지인에게 추천을 해주고 추천인코드를 넣었을때 혜택을 주는 서비스의 경우도 좋을 것입니다.






QR코드를 활용한 오프라인 프로모션


오프라인으로 서비스를 홍보하거나 특정 이벤트를 진행하는 경우 QR코드 자체에 dynamic link를 넣어두어 어떤경로로 사용자가 유입되었는지 파악할 수 있고 해당 고객들에게 맞춤형 혜택을 줄 수 있습니다.












샘플 만들기


Dynamic Link를 활용한 샘플코드를 만들어 보겠습니다.

이 샘플에서는 추천코드를 생성하고, 이를 공유해서 해당 url을 눌렀을때 생성된 추천코드를 인식해서 다이어로그로 띄워주는 기능을 만들것입니다.

바로 코드를 확인하고 돌려보고 싶으신분은 아래 Github주소에서 직접 실행해보시기 바랍니다.

https://github.com/ParkSangGwon/TedDynamicLinkSample









Dynamic Link 만들기


Deep Link 생성

먼저 사용자가 앱을 실행했을때 실행시켜줄 딥링크를 정의해줍니다.

이 샘플에서는 아래와 같은 방식으로 딥링크를 만들어서 설정해 주었습니다.

private Uri getPromotionDeepLink() {
// Generate promotion code
String promotionCode = "DF3DY1";
// https://ted.com/promotion?code=DF3DY1
return Uri.parse("https://ted.com/" + SEGMENT_PROMOTION + "?" + KEY_CODE + "=" + promotionCode);
}






Dynamic Link 생성

private void onDynamicLinkClick() {
FirebaseDynamicLinks.getInstance().createDynamicLink()
.setLink(getPromotionDeepLink())
.setDynamicLinkDomain("n3a95.app.goo.gl")
.setAndroidParameters(
new DynamicLink.AndroidParameters.Builder(getPackageName())
.setMinimumVersion(125)
.build())
.setGoogleAnalyticsParameters(
new DynamicLink.GoogleAnalyticsParameters.Builder()
.setSource("orkut")
.setMedium("social")
.setCampaign("example-promo")
.build())
.buildShortDynamicLink()
.addOnCompleteListener(this, new OnCompleteListener<ShortDynamicLink>() {
@Override
public void onComplete(@NonNull Task<ShortDynamicLink> task) {
if (task.isSuccessful()) {
Uri shortLink = task.getResult().getShortLink();
try {
Intent sendIntent = new Intent();
sendIntent.setAction(Intent.ACTION_SEND);
sendIntent.putExtra(Intent.EXTRA_TEXT, shortLink.toString());
sendIntent.setType("text/plain");
startActivity(Intent.createChooser(sendIntent, "Share"));
} catch (ActivityNotFoundException ignored) {
}
} else {
Log.w(TAG, task.toString());
}
}
});
}

- setLink(): 위에서 만들어준 Depp Link를 세팅해줍니다.

- setDynamicLinkDomain(): 각 Firebase 프로젝트마다 가진 고유값개념입니다. 콘솔에서 확인할 수 있습니다.

- setAndroidParameters(): 안드로이드앱에 대한 설정을 넣어줄수 있습니다. 여기서는 125 버전아래의 앱을 사용중이라면 앱이 설치되어 있어도 앱을 실행시키지 않고 설치페이지로 보내도록 설정되어 있습니다.

- setGoogleAnalyticsParameters(): 마케터, 기획자들이 주로 사용하는 utm_source, utm_xxx 등의 정보들을 설정해줄 수 있습니다.

- buildShortDynamicLink(): 이 함수를 사용해서 긴 url이 아닌 단축url을 생성할 수 있습니다.



링크 생성과 관련된 좀더 상세한 내용은 아래 문서에서 확인하시면 됩니다.

https://firebase.google.com/docs/dynamic-links/android/create










Dynamic Link 처리하기

Manifest 설정

<activity android:name=".MainActivity">
<intent-filter>
<action android:name="android.intent.action.MAIN" />

<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>

<intent-filter>
<action android:name="android.intent.action.VIEW" />

<category android:name="android.intent.category.DEFAULT" />
<category android:name="android.intent.category.BROWSABLE" />

<data
android:host="ted.com"
android:scheme="http" />
<data
android:host="ted.com"
android:scheme="https" />
</intent-filter>
</activity>

Manifest에서 위에서 만든 딥링크를 처리해줄 수 있도록 scheme/host를 정의해줍니다.

여기서는 https://ted.com, http://ted.com 으로 실행되는 url에 대해서 MainActivity가 잡아서 실행되도록 정의되어 있습니다.








Deep Link 처리

private void handleDeepLink() {
FirebaseDynamicLinks.getInstance()
.getDynamicLink(getIntent())
.addOnSuccessListener(this, new OnSuccessListener<PendingDynamicLinkData>() {
@Override
public void onSuccess(PendingDynamicLinkData pendingDynamicLinkData) {
if (pendingDynamicLinkData == null) {
Log.d(TAG, "No have dynamic link");
return;
}
Uri deepLink = pendingDynamicLinkData.getLink();
Log.d(TAG, "deepLink: " + deepLink);

String segment = deepLink.getLastPathSegment();
switch (segment) {
case SEGMENT_PROMOTION:
String code = deepLink.getQueryParameter(KEY_CODE);
showPromotionDialog(code);
break;
}
}
})
.addOnFailureListener(this, new OnFailureListener() {
@Override
public void onFailure(@NonNull Exception e) {
Log.w(TAG, "getDynamicLink:onFailure", e);
}
});
}

- getDynamicLink(): Intent로부터 deep link가 존재하는지 알아옵니다.

만약 처리해야하는 deep link가 존재한다면 PendingDynamicLinkData 값이 null이 아니라 존재할것입니다.

PendingDynamicLinkData로부터 deep link를 가져와서 각 유형에 맞게 처리를 해줍니다.

여기에서는 https://ted.com/promotion?code=DF3DY1 라는 패턴의 유형을 찾아서 그에 해당하는 프로모션 코드를 추출하고 다이어로그로 해당 코드를 띄워주고 있습니다.




이 코드는 아래 Github에서 확인해보실 수 있습니다.

https://github.com/ParkSangGwon/TedDynamicLinkSample

이 샘플코드가 유용하셨다면 Github에서 Star를 눌러주세요









디버깅


Dynamic Link가 의도한대로 잘 동작하도록 만들어져있는지 확인해볼 수 있습니다.

Dynamic Link의 맨 뒤에 ?d=1 을 붙여주기만하면 아래와 같은 경우의 수에 따른 플로우차트를 확인 할 수 있습니다.


https://n3a95.app.goo.gl/iE7WLQnL5mjsuJ7F2?d=1














Firebase Dynamic Link로 효율적으로 사용자를 유입시키고 성공적인 앱서비스를 하시기 바랍니다.

더이상 기획자, 마케터로부터 이런 형태의 url을 만들어 달라는 말도 듣지 않으셨으면 좋겠습니다.

감사합니다.




이 포스팅과 같은 내용의 동영상 강의를 확인하시려면 아래 영상을 시청해주세요

https://goo.gl/dbPCaA

0 Comments
댓글쓰기 폼