brunch

You can make anything
by writing

C.S.Lewis

by 티몬 디자인스토리 Apr 20. 2017

티몬앱의 시작

티몬 모바일 스플래시 스크린 제작기

티몬은 매 시즌 다양한 시작 이미지를 통해 고객에게 브랜드의 감성을 전달하고 있습니다. 티몬이 제공하는 스플래시 화면을 어떤 기준으로 제작하는지 설명 드립니다. 



스플래시 스크린?


요즈음의 빠른 모바일 환경에서 어플리케이션이 켜지기 전 약 1-2초 나오는 화면, 그 시작 화면을 지칭하는 말이 [Splash screen] 혹은 [Launch screen]이라고 부르며, 티몬에서는 [Splash screen]으로 통칭합니다. 앱 구동 할 때 시작 화면을 노출하면 실제 앱 실행 까지 빈화면을 노출하는것보다 확실하게 앱이 반응하는것으로 고객에게 인지하게 하여 자연스럽게 고객경험을 시작할 수 있습니다. 만약 현재 개발하는 앱의 구동이 3초 이상이 걸린다면 고객에게 불쾌한 사용자 경험을 심어 줄 수 있으므로 최적화에 신경을 써야 하며 부득이하게 장시간의 로딩이 필요한 앱(ex.모바일 게임)은 완전히 다른 방식의 시작화면의 형태를 취해야 합니다. 티몬 앱은 정상적인 국내 네트워크 환경에서 대부분의 기기에서 3초 이하의 실행시간으로 빠르게 실행 됩니다. 

계속 돌아갑니다. 기다리지 마세요 그냥 돌아가는 이미지를 올린거에요


다양한 앱에서 자사의 브랜드를 간결하게 알리는 용도로 활용됩니다





티몬의 스플래시 스크린 제작 컨셉


스플래시 스크린 디자인은 두가지 접근 방식이 있습니다.

Placeholder UI  : 로딩 완료후 띄워질 화면과 비슷하게 가는 방식이며 iOS의 가이드라인에는 해당 방식을 장려하고 있습니다. 

Branded launch screens : 첫화면과는 다르며 해당 브랜드의 이미지를 노출하거나 런치 아이콘과 같은 형태로 디자인 되는방식이 일반적입니다. iOS의 가이드라인에는 글로벌 서비스라면 해당방식을 하지 않도록 권하고 있습니다. 


티몬앱은 현재 Branded launch screens 방식을 구현하고 있습니다.

[1. 홈화면의 티몬 런치 아이콘] - [2. 모바일 스플래시 스크린] - [3. 티몬 홈 추천 화면]

까지 티몬 서비스의 '진입'에 관련된 하나의 덩어리로 브랜딩 하고 있으며, 그중 모바일 스플래시 스크린은 티몬의 시즌성을 드러내어 쇼핑몰 특유의 스플래시 화면으로 기능하고 있습니다. 비유하자면 백화점 외벽에 걸린 계절별 대형 벽걸이 광고물로 이해하시면 됩니다. 


[1. 홈화면의 티몬 런치 아이콘] - [2. 모바일 스플래시 스크린] - [3. 티몬 홈 화면]

[1. 백화점 로고 인지] - [2. 시즌 감성 및 쇼핑몰 주요 이슈 전달] - [3. 매장 진입]

갤러리아 백화점 명품관 전경




티몬앱의 스플래시 스크린 제작 사례


티몬의 스플래시 스크린은 앱에서 유일하게 전체 이미지 영역이기 때문에 티몬의 크리에이티브 센터내 디자이너들이 창작욕구를 담아내어 마음껏 디자인 하고 있습니다. 

매달 디자이너 몇분이 디자인을 제출하여 선발된 디자인이 앱 첫화면에노출되고 있습니다. 스플래시 스크린에 'Design by 김티몬~' 과 같이 제작자의 이름을 깨알 같이 화면에 새기고 있습니다.

또한 티몬앱 스플래시 스크린의 용량은 50KB 이하로 고객경험에 지장이 전혀 없는 가벼운 이미지로 제작되고 있습니다.


그동안 제작되었던 스플래시 이미지들
가장 최신 스플래시 이미지! 티몬을 실행할 때 이 이미지가 보이지 않는다면 오랜만에 티몬앱 업데이트 해주세요!

앞으로도 꾸준히 선보이게 될 티몬의 다양한 스플래시 이미지를 기대해 주세요!





매거진의 이전글 앱디자인의 절반이상
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari