영상 배경화면 위로 내 캐릭터가 걸어 다니는 앱, 「Wallive」를 만들고 있습니다
휴대폰 배경화면은 하루에도 수십 번 보는 화면인데, 대부분 사진 한 장으로 고정돼 있습니다. 좋아하는 영상을 배경으로 틀어 두고, 그 위로 작은 캐릭터가 아이콘 사이를 걸어 다니면 어떨까 싶었습니다. 그래서 만든 안드로이드 앱이 Wallive입니다. Wall(배경화면)과 Live(살아 있는)를 합친 이름입니다. 지금은 Google Play 출시를 준비하고 있습니다.
왼쪽: 완성된 홈 화면. 캐릭터가 아이콘 뒤를 걸어 다닙니다. 오른쪽: 편집 화면. 미리보기 위에서 캐릭터 자리와 움직임을 정합니다.
어떤 앱인가요
한 줄로 말하면 "영상 배경화면 위에 내 캐릭터를 얹어 움직이게 만드는 앱"입니다. 갤러리의 영상, GIF, 사진을 배경으로 고르고, 그 위에 GIF·WebP·PNG 이미지를 캐릭터로 올립니다. 캐릭터는 정해 둔 길을 따라 걷고, 손으로 건드리면 다음 동작으로 넘어갑니다. 홈 화면과 잠금화면을 따로 꾸밀 수 있고, 세로와 가로 화면도 따로 기억합니다.
배경: 쓸 구간만, 쓸 영역만
마음에 드는 영상이라도 전부 배경으로 쓰기는 애매합니다. 앞뒤에 필요 없는 장면이 있고, 화면 비율도 안 맞습니다. 그래서 배경 영상 편집 화면에서 재생할 구간을 자르고, 화면에 보일 영역을 박스로 지정하게 했습니다. 화면에 꽉 채울지, 원본 비율을 유지할지도 고를 수 있습니다.
배경화면은 소리 없이 반복 재생하고, 홈 화면이 보이지 않을 때는 스스로 멈춥니다. 앱을 쓰는 동안 뒤에서 영상이 계속 돌면 배터리만 먹기 때문입니다. 폰을 기울이면 배경이 살짝 반대로 움직이는 자이로 원근 효과도 넣었습니다.
배경 영상 편집 화면. 재생할 구간과 화면에 보일 영역을 정합니다.
캐릭터: 그린 길을 따라 걷게
이 앱에서 가장 공을 들인 부분입니다. 캐릭터가 움직이는 방법은 네 가지입니다.
- 제자리: 그 자리에서 애니메이션만 재생
- 랜덤: 화면 안을 자유롭게 돌아다님
- 자유 경로: 손가락으로 그린 선을 그대로 따라감
- 도형: 직선, 사각형, 원, 타원, 물결, 지그재그
화면 끝에 닿았을 때 되돌아올지, 반대편으로 넘어갈지, 한 번만 지나가고 끝낼지도 고를 수 있습니다. 경로를 따라 몸 방향이 자동으로 돌아가게 할 수도 있습니다. 여러 이미지를 이어 붙여 기차처럼 한 덩어리로 움직이게 하거나, 그룹을 여러 개 만들어 레이어처럼 겹치는 것도 됩니다.
이미지 사이에는 효과 카드를 끼울 수 있습니다. 블링킹, 페이드, 줌, 회전, 흔들기 중 하나를 고르면 앞 이미지가 그 효과대로 움직인 뒤 사라지고 다음 이미지가 이어집니다. 캐릭터를 터치하면 다음 동작으로 넘어가게 만들 수도 있어서, 간단한 인터랙티브 배경화면이 됩니다.
왼쪽: 도형 도구로 물결 경로를 그린 화면. 오른쪽: 이미지 사이에 끼우는 효과 카드.
영상에서 인물만 오려내기
캐릭터로 쓸 이미지가 없으면 직접 찍은 영상에서 만들 수 있습니다. 첫 장면에서 오려낼 대상을 한 번 탭하면 나머지 장면은 알아서 따라가며 배경을 지웁니다. 오려낸 결과는 그대로 움직이는 캐릭터가 됩니다. 이 처리는 Google ML Kit로 기기 안에서만 이뤄지고, 영상이 서버로 나가지 않습니다.
만들면서 배운 것
캐릭터를 어느 층에 그릴 것인가
처음에는 캐릭터를 다른 앱 위에 띄우는 오버레이 창으로 만들었습니다. PC의 데스크톱 펫처럼요. 그런데 이렇게 하면 캐릭터가 카카오톡이나 유튜브 위에도 떠다녀서 방해가 됐습니다. 그래서 방향을 바꿔 캐릭터를 배경화면 안에 함께 그리기로 했습니다. 영상과 캐릭터를 OpenGL 화면 하나에 합성하니, 캐릭터가 자연스럽게 아이콘 뒤에서 움직이고 앱을 열면 사라집니다. 다른 앱 위에 그리기 권한도 필요 없어졌습니다.
라이브 배경화면은 동시에 여러 개 돌아간다
안드로이드 라이브 배경화면(WallpaperService)은 미리보기 화면과 실제 적용된 화면이 각각 따로 실행됩니다. 영상 플레이어를 하나만 만들어 공유하면 두 화면이 서로 출력을 빼앗아 검은 화면이 됩니다. 화면마다 플레이어를 따로 만들어야 합니다.
고른 영상은 앱 안으로 복사한다
갤러리에서 고른 파일의 접근 권한은 시간이 지나거나 원본이 지워지면 사라질 수 있습니다. 그러면 며칠 뒤 배경화면이 갑자기 까맣게 됩니다. 고른 영상과 이미지를 앱 저장 공간으로 복사해 두는 방식으로 이 문제를 피했습니다. 프리셋을 백업할 때도 영상과 이미지까지 파일 하나로 묶어서 다른 폰으로 옮길 수 있습니다.
기술 스택
- Kotlin, Jetpack Compose (설정·편집 화면)
- WallpaperService + Media3 ExoPlayer + OpenGL ES (배경 영상과 캐릭터 합성)
- ML Kit (영상에서 인물 오려내기)
- Android 8.0 이상
무료와 Pro
기본 기능은 무료로 쓸 수 있고 광고가 붙습니다. 영상·GIF·사진 배경, 구간 자르기와 영역 지정, 캐릭터 그룹 1개, 제자리·랜덤 이동, 터치 반응, 자이로 효과가 무료입니다. Pro를 열면 캐릭터 개수 제한이 없어지고, 그린 경로와 도형 이동, 효과 카드 전체, 프리셋 무제한이 열리며 광고가 사라집니다.
마치며
배경화면에 넣을 영상과 캐릭터는 꼭 직접 찍거나 직접 만든 것, 또는 사용이 허락된 것을 써 주세요. 앱도 캐릭터 이미지를 따로 배포하지 않고, 사용자가 가진 이미지를 쓰는 방식으로 만들었습니다. 출시되면 이 블로그에 링크를 올리겠습니다. 문의는 idea.into.reality.now@gmail.com으로 보내 주세요.