HIG Reading Series | Foundations - App icons(7)

최승용·2022년 9월 15일
1

HIG Reading Series

목록 보기
27/46
post-thumbnail

Content

오늘은 App icons의 Platform considerations를 읽어보도록 하자.(2)

Platform considerations

macOS

  • 만약 앱 아이콘에 실제 물체를 묘사한다면, 물리적인 재료로 만들어 진것처럼 그리고 진짜 질량이 있는 것처럼 보이게 만드세요.
  • 물체의 무게와 느낌을 전달하기 위해 천, 유리, 종이, 그리고 금속 같은 물질의 특성을 복제하는 것을 고려해보세요.
  • 예를 들어, Xcode는 강철 헤드와 폴리머 손잡이를 가진 것처럼 보이는 해머를 특징으로 합니다.

  • 아이콘 디자인 템플릿에서 그림자 효과를 사용하세요.
  • 앱 아이콘 템플릿은 앱 아이콘이 다른 macOS 아이콘과 조직화하는 데 도움이 되는 시스템에서 정의된 그림자 효과를 포함하고 있습니다.

  • 내부 그림자와 하이라이트를 사용해 선명도와 사실성을 더하는 것을 고려하세요.
  • 예를 들어, 메일 앱 아이콘은 그림자와 하이라이트를 둘 다 사용해 봉투가 진짜인 느낌을 주고 덮개가 약간 열려있음을 나타냅니다.
  • TextEdit 또는 Xcode처럼 배경 위에 떠있는 도구를 포함하는 아이콘에서 내부 그림자는 깊이에 대한 인식을 강화할 수 있고 도구를 실제처럼 보이게 만들 수 있습니다.
  • 그림자와 하이라이트는 아이콘 중심 약간 위에 위치하여 아래로 살짝 기울어진 상태로 직면하는 광원을 제안해야합니다.

Summary

앱 아이콘에 실제 물체를 묘할 때 재질의 특성과 무게감을 실제처럼 묘사하는 것이 좋습니다.
macOS에 내장되어있는 그림자 효과를 사용하는 것이 좋습니다.
내부 그림자와 하이라이트를 사용하면 더 선명하고 사실적인 아이콘은 만들 수 있습니다.

Review

macOS와 iOS, iPadOS까지 모두 사용중이지만 앱 아이콘에서 차이를 의식하지 않고 있었는데 이번 포스팅 중에 자세히 보게되었다.
예시로 자주 언급되는 Xcode와 TextEdit의 경우는 macOS를 위한 앱이기 때문에 차이를 비교하기는 힘들었는데, 기본앱중에 GarageBand를 보니 HIG에서 말하는 플랫폼마다의 차이를 알기가 쉬웠다.
Mac과 iPhone을 둘 다 가지고 있는 사용자라면 한 번쯤 찾아보고 차이를 직접 느껴보면 좋을 것 같다.


  • 번역은 개인적인 능력에 추가로 papago의 도움을 받았다.
    의미가 틀린다거나하는 중대한 문제에 대한 지적은 감사히 받고 수정하겠지만 (영어 공부가 목적이 아니기 때문에) 약간의 실수는 넘어가주길 바란다.
profile
안녕하세요. 최승용입니다.

0개의 댓글