This document proposes building a LINE app that provides a customized interface for the LINE TODAY news service using web views. It discusses three versions of the app with increasing features: v1.0 uses customized web views for all pages except onboarding and login. v2.0 adds easier navigation with a bottom navigation bar. v3.0 enhances video with native video pages and a player. The document also discusses using Apache Kafka to build secondary indices for the app's database to enable features like retrieving a user's past posts.

2. Build an App based on
existing Web Service
Take LINE TODAY as Example

3. TOO MANY FEATURES
TOO LESS TIME

4. Hong KongTaiwanThailandIndonesia
Popular news service in several countries and regions
LINE TODAY SERVICE

5. Movie InfoDramasWebtoonCareer Info
Becomes content portal in LINE app
LINE TODAY SERVICE

6. HOW TO
CREATE AN APP FOR IT?

7. Find
Pain Points
Fix it
IterateRelease
Fast
PROPOSED APPROACH
Step 1 Step 2 Step 3
Step 2

8. Article pageTop pageLINE loginIntroduction
All WebViews except onboarding & native LINE login
v1.0 - Complete Features

9. v1.0 - Architecture
CUSTOMIZED WEBVIEW
Introduction LINE LoginIntroduction LINE Login
CUSTOMIZED WEBVIEW

10. User Profile
page
Video category
User generated
content
Top page
Implemented BottomNavigationBar
v2.0 - Easier Navigation

11. v2.0 - Architecture
CUSTOMIZED WEBVIEW
Introduction LINE Login
BottomNavigation
CUSTOMIZED WEBVIEW

12. Video PlayerVideo ArticleVideo Category
Native Video Category and Video Article page
v3.0 - Video Enhancement
i

13. v3.0 - Architecture
BottomNavigation
LINE LOGIN
INTRODUCTION
VIDEO ARTICLE
VIDEO
PLAYER
ROFILECUSTOMIZED WEBVIEW VIDEO CATEGORY

14. Find
Pain Points IterateRelease
Fast
SUMMARY
Step 1 Step 2 Step 3

15. THANK YOU

17. Build Secondary Indices
In Distributed Database
by Exploiting Apache Kafka

18. INTRODUCE
LINE TODAY AND BUZZ

19. LINE TODAY
A content portal currently
supporting TW/ TH/ ID/ HK
BUZZ
An new feature released in ID,
which allows users to post any
fun images or videos

20. LINE TODAY Buzz Profile page in Buzz

21. HBASE AS DATABASE
Key-value pair, column-oriented database
High scalability
High write throughput

22. WHAT WE MEET
WITH HBASE

23. INDEX IS ONLY
BASED ON ROWKEYS
Lexicographically sorted by
rowKey
NO TRANSACTION
Inter-row operations are not
atomic

24. WHY WE NEED
SECONDARY INDICESIndex is only based on rowKey

25. Get post(s) by ID(s)
rowKey
(postID)
Column Family
title author …
…
0 userA
1 userB
2 userA
…
Buzz post page

26. (Author - Full table scan)
rowKey
(postID)
Column Family
title author …
…
0 userA
1 userB
2 userA
…
User profile page
List posts that the user posted before

27. Post table
rowKey
(postID)
Column Family
title author …
…
0 userA
1 userB
2 userA
…
rowKey
(user_postID)
Column Family
…
userA_0
userA_2
userB_1
…
Secondary Table
ROWKEY IS INDEXED AND SORTED
rowKey with
prefix userA

28. WHY WE USE KAFKA
No transaction

29. BUILD SECONDARY INDICES BY KAFKA
rowKey
(postID)
Column Family
title author …
0 userA
1 userB
2 userA
rowKey
(user_postID)
Column Family
…
userA_0
userA_2
userB_1
2 1 0
consumer.poll()
Update secondary table
Apache Kafka
User A creates a
post (id=2)

30. ● Call commit only when all
messages are processed
successfully
● Duplicate messages might be
possible
CONTROL CONSUMER’S OFFSET COMMIT

31. THANK YOU

33. Rapid Development of Wow Beacon LBS with LINE

34. LINE TODAY
TAIWAN 18,000,000 MAU

35. WHAT LINE BEACON CAN DO?
WITH TAIPEI METRO’S 2,000,000 DAILY TRAFFIC

36. Major Stations In Blue-Line
200+Beacons
at platform & exits
35
TAIPEI METRO
100%

37. APPLICATIONS
Taipei Metro x LINE TODAY

38. ENRICH YOUR 50 MINS
COMMUTE TIME
NEWS DIGEST

39. GIVE YOU
WHAT’S NEAR YOU
COUPON

40. MAKE THE CITY
YOUR PLAYGROUND
PUZZLE GAME

41. MAKE YOUR
TRANSFER SEAMLESS
BUS INFO

42. IMPLEMENTATION
Taipei Metro x LINE TODAY

43. ARCHITECTURE
LINE Platform
BOT
server
Web
server
API
server
Sticker
Giftshop
TODAY ServerUser
BeaconEvent
(enter/stay/leave)
Postback/ Text
REST API
BOT
Gift Coupon
• News (ImageMap) Coupon
• Puzzle(Carousel) Bus (Flex)
CMSDB
• ProcessBeacon
• UpdateAgreement
• ClaimCoupon
• PuzzleStatus
• BeaconTriggerInfo
Publish
Content Generation & Management
Misson Sticker
Beacon
OA
LIFF/C
WA

44. HOW TO MANAGE 200+ BEACONS

45. BEACON MANAGEMENT
Beacon HWID → Beacon Group → Action Type
HIERARCHICAL MANAGEMENT
Platform
Group1
Exit
B
Group2 Group3 Group4
Coupons
B B B B BBBB
Coupon TypeNews Type

46. 2,028,963
HOW TO HANDLE LARGE AMOUNT
OF BEACON EVENTS?

47. Zookeeper Key = User ID + Action
Type
CONCURRENT BEACON
EVENTS HANDLING
EVENT HANDLING
Server
B
B
B
B

48. Independent data entry in DB / cache
• Agreement status
• Last action info of each action type
• Last triggered beacon group
EVENT PROCESSING SPEEDUP
Y
DB / cache
Should send
coupon/puzzle
Y N
Y Y
Should resend
user consent
Send
user consent
Send available
coupon/puzzle
ZooKeeper
Lock Acquire
User Agreed
{hwid, userid}
Beacon
EVENT HANDLING

49. THANK YOU