brunch

매거진 읽는 디자인

라이킷 20 댓글

You can make anything
by writing

C.S.Lewis

계정을 잊어버리셨나요?

by 디자인너마저 Oct 19. 2020

Yahoo! 아직 살아 있다구!!

웹, 모바일 최적화를 위한 야후의 작은 노력

얼마 전 Yahoo가 새로운 로고를 발표했더라구요?

그래서 준비한, 한 때 최고의 IT기업이었던 Yahoo에 대한 짤막한 이야기.

야후재팬이 아직 살아있다고는 하지만, 예전의 명성에 비하면 지금은 너무나 초라해진 Yahoo네요.

그래서 우리 아직 죽지 않았다! 외치는 것처럼 2013년 이후 7년 만에 새로운 로고를 제작해서 발표했네요.

글자의 서체와 두께, 느낌표의 각도, 알파벳 대문자에서 소문자로 참 많이도 바뀌었네요. 아무래도 웹, 모바일 최적화를 위한 디자인적 시도라고 생각되는데요... 이런 Yahoo의 시도가 이번이 처음은 아니었습니다.

때는 바야흐로 2018년 평창 올림픽...

(그 날의 함성...)

갑자기 자기들이 만든 평창올림픽 픽토그램을 공개했습니다. 보통 올림픽 픽토그램은 올림픽 조직위원회에서 발표하고 배포를 하는데요, 야후는 자신들이 사용할 픽토그램을 직접 제작한 것이라 조금은 의아했습니다. 이미 평창 올림픽 조직위원회에서는 아래와같은 원리로 동계 올림픽 종목의 픽토그램을 발표해서 다양한 채널에서 사용하고 있었습니다.

평창 올림픽 픽토그램의 원리와 그것을 활용한 티켓 디자인

평창 올림픽 픽토그램과 그것을 활용한 홍보 포스터

여기서 픽토그램(pictogram)이란, 그림(picture)과 전보(telegram)의 합성어로, 상징적인 그림을 통해 다수의 사람들에게 사물 형태 개념 등을 빠르고 쉽게 공감할 수 있도록 만든 그림문자를 뜻합니다.

하지만, Yahoo는 이런 여러 채널에서의 사용 없이 오로지 자신들의 웹과 모바일에서 사용될 20px 내외의 작은 사이즈의 픽토그램이 필요했기 때문에, 평창 조직위의 픽토그램보다는 자기 스타일을 살리고 웹, 모바일 최적화를 위한 디자인을 진행합니다.

그러기 위해서 먼저 자신들만의 가이드라인을 만들었는데요.

평창 조직위에서 발표한 원리와는 사뭇 다르죠? 한글 자음 모음 등의 디자인적 영감은 걷어내고 px이 기준이 된 가이드라인으로, 머리는 4px로 언제나 같게! 몸통과 손은 원급 법에 따라 달라진다, 다리도 변형 가능하며 7px을 유지한다. 이러한 가이드라인 아래, 각 스포츠 종목에 대한 레퍼런스 조사를 하고 여러 스케치를 뜹니다.

각 종목에 대한 포즈를 확정한 후, 아이콘을 다듬는 과정을 거쳤구요. 좀 더 역동적인 모습을 표현하기 위해 다리는 얇았다가 굵어지는 등, 적절한 여백을 사용해서 포즈가 잘 보일 수 있도록 가이드라인을 추가했다고 합니다.

이러한 과정을 거친 픽토그램의 결과물은 실제로 아래와 같이 야후 웹사이트에 적용되었구요. 평창 동계 올림픽 공식 픽토그램과의 차이도 한 번 쓰윽 살펴보겠습니다.

보라색이 야후 vs파란색이 평창입니다

이렇게 같은 듯 다른, 다른 듯 같은... 확실히 작은 화면에서 작은 크기로 사용될 경우에는 야후의 픽토그램이 더 시인성이 좋을 것 같다는 생각이 드네요. 하지만 디테일이 살아있는 평창 공식 픽토그램이 완성도도 높아 보이고 여러 채널에서 활용하기 좋을 것 같은 느낌적인 느낌... 사용 목적이 다르다 보니 같은 종목임에도 조금씩 차이가 보이는 게 재미있네요.