2012. 11. 28. 07:45ㆍUI 가벼운 이야기
글을 시작하며...
Apple iOS6로 업데이트되면서, 모바일 앱스토어도 대폭 업데이트 되었습니다.
본 글에서는 iOS6 모바일 앱스토어 업데이트의 장점 및 특징에 대해서 소개하려고 합니다. 'Everything that’s wrong with the App Store in iOS 6' 글에서는 iOS6 앱스토어에서의 문제점을 이야기하고 있습니다. 이 글을 참고하시면, 균형잡힌 시각으로 UI에 대해서 생각해 볼 수 있을것으로 기대합니다.
새롭게 업데이트된 iOS6 모바일 앱스토어의 장점/특징
1. Pad, apple TV화면과 일관성있는 UI 화면 구성
그림1) Pad, TV와 일관성있는 UI 화면 구성
그림2) 홈 화면 변경
iOS6 모바일 앱스토어에 처음 진입하면 등장하는 메인페이지에서 큰 변화를 살펴볼 수 있습니다. 기존 앱스토어 메인 페이지의 리스트 형 구조를 가로 스크롤 구조로 변경하였습니다.
UI 기획자 입장에서는 사용성 측면에서 어쩔 수 없이 리스트 형 구조를 선호할 수밖에 없는데, 리스트 형 구조는 일반적으로 너무 뻔한 UI라는 결과에 부딪히게 됩니다. 기획자의 입장에서 보면, 새로운방식의 UI를 선호하거나 클라이언트를 설득하기 위한 UI로 이런 Fancy한 메인페이지를 택하기 마련입니다.
그러나, 이러한 화면구성의 변경이 그러한 관점 보다는 Pad, TV화면의 일관성 측면에서 접근하였다는 해석도 가능합니다. 저는 이런 관점이 좀 더 타당하다고 생각합니다. 이런식의 화면 구성은 첫 화면에서 좀 더 다양한 콘텐츠를 노출한다는 점에서 앱스토어의 성격(다양한 콘텐츠를 한 화면에 노출)과도 잘 맞아떨어집니다.
그림3) 앱 검색결과 화면 변경
또한 앱 검색 결과 화면에서 한 개의 앱의 정보가 풍부하게 보여지게 변경되었습니다. 화면 변경으로 인한 장점은 제목만 봐서는 무슨 앱인지 알 수 없으니까 바로 정보를 확인하기 좋은 구조로 설계되었다는 점입니다. 화면 변경으로 인해 생기는 단점은 관련 ‘참고링크’에서 확인하시기 바랍니다.
2. 앱 상세 화면 UI 변경
One page 구조에서 3개의 탭 구조로 변경
그림4) 앱 상세페이지 화면 변경
기존에는 앱 상세화면에서 앱 이미지를 리스트 최하단에 제공하고 one page구조로 설계하였습니다. 그러나 업데이트 후 한 페이지에 있던 정보인 ‘세부사항’, ‘리뷰’, ‘관련콘텐츠’의 3개의 탭으로 분리하였습니다. 또한 세부사항에서 이미지를 최 상단에 배치하였습니다.
이는 사용자가 앱을 구매하기 전에 이미지를 먼저 보려는 Needs를 해소하기 위한 변경으로 생각합니다. (이는 pxd 사내에서 이루어진 rapid interview에서도 나온 결과입니다.)
그럼에도 불구하고 기존 앱스토어에서는 앱 이미지를 최 하단에 배치했었습니다. 그 이유는 앱 이미지의 경우 이미지를 불러오는 속도 가 문제가 될 수 있습니다. 이미지를 하단으로 배치하면 사용자는 이미지가 로딩이 빨리 되는것같은 착각을 할 수 있기때문에, ‘인지적측면의 이미지 로드’를 줄여준다는 장점이 있기 때문입니다.
모바일 앱스토어를 업데이트하면서 앱 상세화면 이미지를 상단으로 과감하게 올린걸 보면, 이미지 불러오는 속도의 문제가 어느정도는 해소 되었다고 생각합니다.
유동적인 탭 구조로 변경
앱 상세화면에서 3 개의 탭 구조로 변경되었다는 점은 위 내용에서도 언급한 내용입니다. 변경된 세 개의 탭도 일반적인 3 개의 탭이 아닙니다. 탭이 항상 상단에 고정되어있는 구조가 아니라 일정 위치에 올라가면 항상 보이는 유동적 구조로 설계하였습니다. iOS 모바일 주소록 리스트 구분자를 확인하시면 이해가 될 것입니다.
탭을 항상 고정되어있는 구조로 설계하면 공간을 항상 차지한다는 문제가 있고, 그렇다고 스크롤에 따라 탭을 사라지게 하면 네비게이션을 어렵게 한다는 문제가 있습니다. 이러한 유동적인 방식의 탭 UI는 두 개의 서로 다른 문제를 해결하기 위한 방식으로 생각해 볼 수 있습니다.
3. Flow를 고려한 업데이트 UI 변경
복수의 앱 업데이트를 고려한 UI변경
그림5) 업데이트 화면 변경
기존의 앱스토어에서 앱을 업데이트 하면 바로 앱스토어를 나가고 홈 화면으로 이동하여 복수의 앱을 업데이트할 때에는 짜증이 났습니다. (기존에는 한 번에 한 개의 앱만 업데이트하기 편한 구조였습니다.)
복수의 앱을 업데이트 하는 순서를 살펴보면,
1.앱 이름 확인 → 2.업데이트 내역 확인 → 3.업데이트(이때 Home화면으로 이탈) → 4.다시 앱스토어를 켜고 반복
하는 방식으로 과정자체가 번거롭게 설계되어 있습니다.
반면, 업데이트된 앱스토어는 다중 업데이트를 고려하여 UI가 변경되었습니다. 물론 이는 기술적인 업데이트가 아닌 UI적인 업데이트임을 밝힙니다. (기술적인 다중 업데이트 기능은 이전 앱스토어에서도 지원을 했습니다.)
업데이트된 앱스토어에서 다중 업데이트를 하는 순서를 보면,
1.앱 이름 확인 → 2. 업데이트 내역을 한 화면에서 확인 → 3. 업데이트 → 4. 다른 앱 이름 확인.
하는 방식으로 과정이 간편하게 변경되었습니다. 이 모든것들이 한 화면에서 이루어진다는 점이 놀랍습니다!
한 화면에서 업데이트 상황 확인 가능
또한 업데이트 화면에서 아코디언 형식의 UI를 통해 어떤항목이 업데이트가 되었는지를 한 화면에서 바로 확인이 가능한 구조로 변경되었습니다.
글을 마치며...
본 포스팅에서는 iOS6 모바일 앱스토어의 업데이트된 내용에 대해서 UI관점으로 살펴보았습니다. 늘 그렇듯 UI설계에는 정답이 없습니다. UI 설계 이후 어떤점들이 좋아지면, 반대로 어떤점들이 나빠지게끔 마련입니다. 결국은 기획자의 관점 및 Persona같은 좋은 가이드를 통해 Trade off해야 할 것입니다.
PS. 본 글은 업데이트된 UI가 좋다 나쁘다를 판가름할 수 있는 기준(퍼소나)에 맞추어 평가한 것이 아님을 밝힙니다.
기존 버전 앱스토어에 대한 사내 약식 인터뷰를 통한 인사이트 및 필자(기획자)의 경험에 비추어 해석한 것이므로 기준이 퍼소나에 맞추어져 있지 않고 필자(기획자)에 맞추어져 있습니다. 그래서 해석보다는 객관적인 사실에 좀 더 집중하려고 노력했으나 관점에 따라 호불호가 갈리는 기능들이 존재합니다. 예를들면, 3번 주제인 복수의 앱 업데이트를 고려한 UI변경은 앱 업데이트가 빈번한 사용자에게는 유용한 변경이겠으나, 앱 업데이트를 귀찮아하는 사용자에게는 불편한 변경이 될 것입니다. iOS 6 모바일 앱스토어의 업데이트는 이러한 관점에서 봤을 때 라이트유저를 위한 기능에서 헤비유저를 위한 기능으로 조금씩 이동하는 추세를 보여줍니다.
[참고##UI 디테일##]