• 꼼꼬미 단어장의 Icon을 만들어보자
  • 서론
  • 본론
    • First Trial
    • Second Trial
    • Third Trial
    • Final Trial
• 결론

꼼꼬미 단어장의 Icon을 만들어보자

서론

• App Icon에 대한 H.I.G 글 일

본론

• App Icon을 만들던 과정
  • 피드백
  • H.I.G 피드백

First Trial

처음엔, 팀원들끼리 아이콘 공모를 통해 상품을 걸고 도전을 했습니다. 아래 나온 것들이 그 디자인인데, 다시 보니 형편 없는 디자인이었습니다. 아래 디자인에 대해 H.I.G 기준으로 평가해보도록 하겠습니다.

어떤 문제가 있는 것처럼 보이시나요? H.I.G 에서는 불필요한 텍스트를 아이콘에 넣지마라 라고 안내합니다.

Prefer including text only when it’s an essential part of your experience or brand.

앱이 사용자의 기기에서 노출될 때, 하단에 앱의 이름과 함께 나타나기 때문에, 앱 아이콘 내에 앱 이름을 작성하는 것은 불필요하다고 판단됩니다.

그러므로, 첫 번째 시안은 실패로 돌아가게 됩니다.

Second Trial

두 번째는 첫 번째 피드백을 수용하여, 앱 아이콘 내부에 들어간 텍스트를 제거했습니다. 세계와 만날 수 있는 단어장이라는 컨셉으로, 책을 열면 그 안에 세계가 들어있다는 느낌을 주고 싶어서 디자인했습니다.

어떤가요?

설명을 듣고나면 그럴듯 하지만, 앱의 목적과 부합하지 않는다는 피드백을 받았는데요 통상적으로 지구의 이미지와 세계 지도는 지도 앱이라는 느낌을 줄 수 있습니다.

A unique, memorable icon communicates the purpose and personality of your experience and can help people recognize your app or game at a glance in the App Store and on their devices.

H.I.G에서 App Icon을 위와 같이 정의하고 있는데, 두 번째 시도에는communicates the purpose and personality of your exeperience, at a glance 부분을 충족시키지 못했던 것 같습니다. App Icon은 사용자들이 저희 앱을 한 눈에 인식할 수 있도록 도와주고, 앱의 특징과 목적을 정확히 전달해야 한다고 하는데, 두 번째 시도는 이게 단어장 앱인지, 지도 앱인지 혼란을 줄 수 있기 때문이었습니다.

Third Trial

마지막 시도는, iOS뿐만 아니라, 다른 플랫폼에서도 잘 적용되는 것까지 생각해서 레이아웃에 맞게 디자인을 하였습니다.

단어장이라고 하면 통상적으로 고리로 된 단어 카드를 상상한다는 것에 착안하여 앱 아이콘을 디자인 하였습니다. H.I.G에서 이야기하는 다음과 같은 항목들을 지켜 앱 아이콘을 디자인 하였습니다.

• 단어장이라는 앱의 특징과 목적을 전달한다.
• 한 눈에 단어장이라는 인식을 줄 수 있다.
• 앱 아이콘을 단순화 했다.
• 다른 플랫폼에서도 잘 적용되도록 디자인했다.
• 앱 아이콘에 텍스트를 제거했다.
• 그래픽 이미지를 사용하였다.

그래서 나온 최종 결과물은……!

(두구두구)

Final Trial

결론