앱스토어와 구글 플레이 스토어에서의 전환율 높이기, ‘스크린샷’의 역할!을 통해 모바일 앱 스크린샷에 대한 내용을 정리했는데요! 기존에는 모바일 앱 상세 페이지로 바로 이동할 수 있는 경우가 많았지만, 최근에는 검색 또는 에디터스 초이스 등을 통해 비슷한 분야의 앱을 모아볼 수 있는 리스트를 먼저 보게 되는 경우가 많아졌습니다. 이 리스트에서 우리가 볼 수 있는 앱의 정보는 많지 않으며, 대표적인 것이 타이틀, 앱아이콘, 스크린샷이라고 할 수 있습니다. 그래서 오늘은 앱의 첫 인상을 결정하는 대표적 요소 중 하나인 ‘모바일 앱 아이콘’에 대해 간략하게 정리해보려고 합니다 🙂

iOS 앱 아이콘을 확인해볼 수 있는 – iOS Icon Gallery

앱 아이콘을 디자인, 제작하는데 있어 가장 먼저 해야할 일은 준비하고 있는 서비스와 연관된 사례를 살펴보는 일입니다. 생산성이라면, 인기 있는 또는 새롭게 출시된 서비스들의 모바일 앱 아이콘을 살펴보는 일이 그리 어렵지 않기 때문이죠. 앱스토어와 플레이스토어 내 카테고리 별 앱을 확인하는 방법이 첫 번째 이며, 위의 이미지와 같이 앱 아이콘을 한 눈에 확인해볼 수 있는 웹 서비스 등을 살펴보는 것이 두 번째 방법입니다.

iOS 앱 아이콘을 확인해볼 수 있는 – iOS Icon Gallery

그 중 ‘iOS Icon Gallery’는 웹상에서 iOS, macOS, watchOS에 해당하는 서비스들의 아이콘 사례를 살펴보기 유용한 곳입니다.

iOS 앱 아이콘을 확인해볼 수 있는 – iOS Icon Gallery

하나의 앱 아이콘을 선택하면 최대 – 최소사이즈의 아이콘은 물론, 컬러와 카테고리를 바탕으로 유사한 아이콘 사례를 볼 수 있습니다. 앱스토어와 플레이스토어의 경우도 PC 버전이 준비되어 있지만, 이렇게 앱 아이콘만 한 눈에 보기는 쉽지 않기에 앱 아이콘 제작 시 초기 단계에서 많은 도움을 받을 수 있죠 🙂 (아이콘 갤러리 확인하기)

사례를 통해 앱 아이콘 제작과 관련된 힌트를 얻었다면, 이후에 우리가 참고하고 확인해야 할 단계는 무엇일까요?

1.작게 시작하기

앱 아이콘은 작게 보이는 경우가 더 많으니까요!

위의 넷플릭스 앱 아이콘 사이즈별 사례를 기억하시나요? 언제나 큰 아이콘으로 사용자에게 다가갈 수 있다면 더없이 좋겠지만, 스크린 타임, 업데이트 리스트, 설정 화면 등을 보면 앱 아이콘은 우리에게 작게 노출되는 경우가 많다는 것을 알 수 있습니다. 때문에 앱 아이콘을 제작하는데 있어 작은 사이즈에서도 눈에 잘 들어오는지 고려해야 합니다. 또한 작게 시작해, 큰 사이즈로 확장 되었을 때 픽셀 등이 깨지지 않도록 사이즈 별로 최적화 작업을 해야한다는 점도 우리가 잊지 말아야 할 내용 중 하나입니다.

2.명확하게 하기

아이콘만 봐도 어떤 앱인지 유추할 수 있다면 베스트!

작은 사이즈의 아이콘이 중요하다는 내용과 함께 우리가 반드시 생각해봐야 할 것은 바로 ‘명확성‘입니다. 앱 아이콘만 봐도 어떤 앱인지 사용자가 쉽게 유추할 수 있어야 한다는 것이죠. 위의 이미지를 보면 총 12개의 모바일 앱 아이콘을 확인할 수 있는데요! 첫 번째 아이콘은 영어와 한자가 함께 있는 것을 보니 번역 또는 사전 앱일 가능성이 높아보이고, 두 번째 아이콘은 피아노 건반이 포함되어 있으니 악기를 연주하거나 녹음하는 서비스일 것 같다는 생각이 듭니다. 이처럼 앱 아이콘만 보더라도 어떤 앱인지 명확하게 알 수 있도록 하는 중요한 정보가 될 수 있어야 합니다.

3.남들과는 다르게

같은 카테고리의 앱 아이콘 모습

작은 사이즈에서도 명확하게! 이 조건을 넘어섰다 하더라도 우리에게 남은 과제는 아직 존재합니다. 대표적인 것이 동일 카테고리의 앱들인데요. 위의 이미지를 보면 ‘Music’ 카테고리 내 다양한 모바일 앱 아이콘을 볼 수 있습니다. 이는 앱스토어나 플레이스토어에서도 카테고리별 앱 리스트를 확인했을 때 마주할 수 있는 모습이기도 하죠.

피아노 건반을 우리만 생각하고 있을까? 기타는? 마이크는? 북은? 애플 앱스토어에만 수백만개의 앱이 등록된 상황에서 카테고리는 정해져있는데.. 우리 서비스가 잘 알려진 서비스라면, 앱스토어가 초기 단계라면 단순 로고를 사용해도 되겠지만 카테고리 별 경쟁이 치열한 요즘에는 눈에 띄는 방법을 늘 고민해야만 합니다. 같은 피아노 건반이라 하더라도 배경 컬러를 달리하거나, 조금은 유니크한 악기를 전면에 활용하는 등의 방법을 말이죠.

4.가이드라인 잊지 않기

(왼쪽) 구글 플레이 스토어 (오른쪽) 애플 앱스토어

슈퍼셀의 또 다른 메가 히트작이 될 가능성이 보이는 브롤스타즈! 위의 이미지 중 왼쪽은 앱스토어에서의 앱 상세 페이지이며, 오른쪽은 플레이 스토어에서의 앱 상세 페이지입니다. 모바일 앱 아이콘을 보면 모양이 조금씩 다르다는 사실을 알 수 있죠. 이는 앱 등록 시 애플과 구글이 정해놓은 가이드가 서로 다르기 때문입니다. 기본 사이즈는 물론 비율도 조금씩 다르기에 각 플랫폼이 정해놓은 가이드라인을 미리 확인하는 것은 필수라고 할 수 있습니다. (애플 디자인 가이드)(구글 디자인 가이드)

마치며,

게임은 조금 다르게 적용될 수 있지만, 그 외 카테고리 내 모바일 앱 아이콘을 제작하는 작업은 그리 쉬운일이 아닙니다. 위에서 언급되지 않았지만 컬러는 물론, 앱을 표현할 수 있는 텍스트 등이 포함되는지 여부 등을 함께 고려해볼 수도 있죠. 분명한 사실은 우리가 앱스토어에서 검색을 하는 등 앱 리스트를 확인할 때 가장 먼저 시선이 쏠리는 곳이 앱 아이콘 영역이라는 점입니다. 스크린샷의 사이즈가 더 크지만 임팩트를 줄 수 있는 방법은 강렬하 앱 아이콘이 될 수 있다는 것!

이미 아는 분들이 더 많으시겠지만, 구글의 경우 콘솔 내 스토어 등록 정보 실험 대상에 ‘아이콘’이 포함되어 있습니다. 완성된 모바일 앱 아이콘을 바로 적용하기 보다 A/B테스트 등을 통해 아이콘이 어떤 영향을 끼치는지 살펴보는 것도 좋은 방법이 되지 않을까 싶습니다 🙂

제 첫 도서가 출간되었어요. 제목은 ’10년 차 IT 기획자의 노트’입니다. 뉴스레터와 이 블로그를 시작하게 된 이유는 사수 없이 일하는 어려움을 저보다 조금 늦게 출발한 분들이 덜 느꼈으면 하는 마음 때문이었는데요. 같은 맥락에서, 9개 노트(기록)를 바탕으로 기획과 PM의 주요 업무를 어떻게 하면 좋을지 정리한 내용입니다. 아래 링크를 통해 자세한 내용을 확인하실 수 있어요!

지금 써보러 갑니다가 ’00:00’이란 이름으로 뉴스레터를 발행하기 시작했어요! 아직 구독 전이라면, 신청 후 격주로 발행되는 뉴스레터를 받아보세요! (구독 신청하기!)

(함께보세요!) 안드로이드와 IOS 모바일앱에 필요한 아이콘! 이미지 등록으로 한 번에 ‘APP ICONIZER’