Media Handling for Animated Sticker in Sticker Maker

by Po

Slide 1

Slide 1 text

Slide 2

Slide 2 text

Slide 3

Slide 3 text

Slide 4

Slide 4 text

Slide 5

Slide 5 text

© LY Corporation Timeline 5 July 2022 First Animated Sticker Proposal made Late 2022 Project Kick Off Early 2023 Android Prototype Jan 2024 Android Beta Release Mar 2024 iOS Beta Release Mid-Late 2023 Release Planning Development

Slide 6

Slide 6 text

© LY Corporation Challenges and Improvement 6 - In-House APNG encoder to fulfill LINE Creators Market restriction - Video frame extraction - Customized Camera screen - Customized Gallery screen - Some other stuff - APNG in compose (Not included today) - etc

Slide 7

Slide 7 text

© LY Corporation Animated Sticker Guidelines 7 • Loops: 1 – 4 loops per sticker whose combined length does not exceed 4 seconds. • Playback time: Up to 4 seconds per sticker. • PNG frame limits per APNG: Between 5 and 20 frames. • The maximum file size for each image is 300 KB. If submitting all images in a single ZIP file, make sure the ZIP file is 20 MB or less.

Slide 8

Slide 8 text

© LY Corporation Solutions 8 - If Created APNG with full color info (RGBA) the file would be too big - Converting 4 second video to RGBA encode apng of 320 * 270 would over 1MB - Need to encode with indexed color and optimization color palette - Color space is limited -> Color info optimization

Slide 9

Slide 9 text

Slide 10

Slide 10 text

Slide 11

Slide 11 text

© LY Corporation PNG Spec 11 - http://www.libpng.org/pub/png/spec/1.2/PNG-Contents.html - 90 pages in PDF - In-House customized encoder - Kotlin Encoder - C++ Encoder with NDK - Color palette optimization with dynamic color palette and color quantization

Slide 12

Slide 12 text

Slide 13

Slide 13 text

Slide 14

Slide 14 text

Slide 15

Slide 15 text

Slide 16

Slide 16 text

© LY Corporation Video Frame Extraction and Encode APNG 16 Project Info (Video uri, decoration etc Extract Critical Video Frames (1/2 of frames) Color Palette Creation Apply Transform and decoration Calculate Color Palette

Slide 17

Slide 17 text

Slide 18

Slide 18 text

Slide 19

Slide 19 text

© LY Corporation Video Frame Extraction and Encode APNG 19 Project Info (Video uri, decoration etc Apply Transform and decoration to Each Frame Final Encoding with Optimized Palette Color Palette Creation

Slide 20

Slide 20 text

© LY Corporation Video Frame Extraction and Encode APNG 20 Project Info (Video uri, decoration etc Apply Transform and decoration to Each Frame Final Encoding with Optimized Palette Color Palette Creation

Slide 21

Slide 21 text

© LY Corporation Customized Camera 21 - CameraX - https://developer.android.com/media/camera/ camerax - https://medium.com/@seungbae2/camera2- vs-camerax-a-comparison-of-android- camera-apis-5db2b5ff302e

Slide 22

Slide 22 text

© LY Corporation Customized Photo Picker 22 - Android Photo Picker - Android 11 (API 30)+ - https://developer.android.com/training/ data-storage/shared/photopicker - MediaStore - Flexible apis - https://developer.android.com/training/ data-storage/shared/media

Slide 23

Slide 23 text

© LY Corporation - Android Photo Picker - Android 11 (API 30)+ - https://developer.android.com/training/ data-storage/shared/photopicker - MediaStore - Flexible apis - https://developer.android.com/training/ data-storage/shared/media Customized Photo Picker 23