얼마전 파란이 대대적인 개편을 했습니다. Daum의 개편 때 처럼 많은 관심이 쏠리지는 않았지만, 개편 내용만 놓고 보면 포털 개편 중에서 가장 변화폭이 큰 측에 속하는 개편입니다. 기존의 포털 포멧을 탈피하며 모바일 웹이나 모바일 블로그의 형식을 가져왔고, 디자인 요소를 전면 교체하면서 구성적으로나 외형적으로 완전히 탈바꿈 했습니다. Bi도 요즘 최신 트랜드(너무 트랜드지만)에 맞게 귀여우면서 모던하게 변신했네요. 천지개벽이죠 이정도면. 



<작고 간략하게 보는 파란 개편의 전체 모습>

파란 개편의 첫 인상. 좋습니다. 산뜻한 컬러, 박스 구성이 아닌 정렬을 통한 레이아웃, 카테고리 간의 구분이 일관된 점(세로로 정렬), Bi와 전체적인 그래픽과의 훌륭한 조화 까지 만족스럽습니다. 과감한 시도를 하고 그것을 승인한 파란의 모든 관계자분 들에게 박수를 보냅니다. 이런건 디자이너가 하고 싶다고 해도 컨펌자가 '도리도리'하면 말짱 꽝인데, 참 부럽습니다.

이렇게 산뜻한 파란이지만, 문제점이 하나씩 보이더군요. 각설하고 제가 본 것들을 이야기를 하겠습니다.






[1. 아이폰에서 가져온 UI. 하지만 적용이 아쉽다]




반가운 Ui가 보입니다. KT가 아이폰을 서비스 하는 것을 홈페이지 메인과 연결시켜 컨셉을 잡았네요. 앞서 말했듯이 홈페이지 전체가 모바일웹에서 포멧을 가져 왔기 때문에 이런 응용 보기 좋습니다. 반가운 마음으로 마우스를 가져가 봤습니다. 그런데?




<롤 오버를 해 보니 카테고리가 나온다>

저 UI를 카테고리로 이용한 것에는 두 가지 문제점이 있습니다. 첫 째는 아이폰과 사용이 다르다는 점(아이폰에서는 홈화면 페이지 넘김으로 쓰입니다)이고, 두 번째는 카테고리를 확인하려면 반드시 마우스를 저 곳에 대 봐야 알 수 있다는 겁니다. 아이폰과 사용이 다른 것은 '절묘한 적용'이라는 재미 요소를 떨어뜨립니다. 익숙한 모양을 가져다 놓고 사용이 달라버리면 그건 패러디가 아니라 디자인 표절이 되는 거죠. 또 롤 오버를 해야만 카테고리를 알 수 있기 때문에 사용자들은 미리 외우고 있지 않으면 '연예'를 찾기 위해 다른 카테고리도 마우스로 굳이 훑어 봐야 합니다. 게다가 무슨 무슨 카테고리가 있는지도 롤 오버를 해야 알 수 있죠. 이렇게 되면 직관적이고 편한 UI가 아니죠.





<클릭해서 뉴스 페이지로 들어가면 흔히 볼 수 있는 카테고리가 등장>

뉴스 페이지로 들어가면 우리에게 익숙한 카테고리가 나옵니다. 이 부분도 약간은 실망스러운데, 아예 메인페이지 처럼 카테고리를 정렬했다면 디자인적으로라도 컨셉츄얼함을 지키지 않았을까 싶습니다. 아마도 메인페이지에서의 '롤 오버를 해야만 알 수 있는 방식'이 사용성에 있어서 문제가 있다는 것을 파란측도 생각했기 때문에 이미지를 연결 시키지 않은 것이 아닌가 합니다. 아무튼 이렇게 되는 바람에 메인 페이지의 '점점점점점Ui'는 컨셉도 놓치고 사용성도 놓쳐버렸네요.







[2. 가장 큰 문제. [+]버튼]



제가 이번 파란의 홈페이지 개편에서 가장 주목했던 부분이고(디자인도 가장 주목하게끔 해 놓았더군요), 가장 문제가 크다고 느끼는 점이 바로 저 버튼입니다. (아, 저런 버튼 디자인은 흔한 거니 제 포폴 사이트와 비슷하다고 파란을 먼저 보신 분이 제 홈피를 보고 표절이라고 하는 일은 없겠죠? 살짝 걱정이 되는데, 암튼 기대가 되는 버튼입니다) 눌러봤습니다.





'화면설정'이라고 돼 있네요. 근데 문제는 이 상태에서 화면 설정을 할 수가 없다는 점입니다. 카테고리 누르면 해당 위치로 이동하기만 할 뿐 도대체 왜 화면 설정이라는 건지 모르겠습니다. '화면설정'이라고 써진 부분이 버튼인가 해서 눌러봤지만 그것도 아닙니다. 지금 상태대로 라면 '화면설정 -> 화면이동'으로 이름이 바뀌어야 합니다.





화면설정 메뉴를 접고 페이지를 마우스로 둘러보다 보니, 카테고리가 써있는 부분 근처에 롤오버가 될 때 [-]버튼이 생깁니다. 눈치밥을 20년 이상 먹은 제가 딱 보니까 이거랑 화면 설정이랑 관련이 있습니다. 지체 없이 눌러봤습니다. 해당 카테고리가 화면에서 사라지네요. 전 이제 파란에서 쇼핑은 못 하는 건가요?? 이렇게 되면 할 수 없이 네이버 지식 쇼핑으로 가야 하는데....





다시 [+]버튼을 눌러봤습니다. 그랬더니만 '쇼핑' 옆에 +버튼이 생겨있네요. 근데 전 의아합니다. 이렇게 눈에 확 뛰게 버튼을 만들어 놓았는데, 정작 이 '화면설정'이 자기 혼자서는 그 기능을 하지 못 하고 있으니 말입니다. 카테고리 근처에 롤 오버를 해서 [-]버튼을 하나 누르고 나서야 화면설정은 비로소 화면설정 기능을 시작합니다. 그렇다면 순서상 [-]버튼이 더 먼저이고, 더 강조해야 할 것도 [-]였습니다. 또 어차피 '화면설정'을 누르면 카테고리가 다 나오는데 굳이 [-]버튼을 따로 밖에만 있게 할 이유가 없습니다. 

괜히 사용자가 왔다 갔다 해야하고 기능적으로도 더 불편합니다. 
게다가 저 카테고리의 순서도 절대로 바꿀 수가 없습니다.

아마도 '더한다'와 '뺀다'라는 언어적 개념에 너무 충실해서 [+]버튼 안에는 빼는 기능을 넣지 않은 것 같은데, 그렇다면 아예 [+]가 아닌 다른 디자인으로 바꿔야지 이렇게 둘을 불편하게 떼어놓는 건 아무리 봐도 소모적입니다.






또 의아한 부분은, 이 [+]버튼이 자꾸 다라다닌다는 겁니다. 포털이라는게 원,투 데이 들락 거리는 것도 아닌데 화면을 설정할 일이 과연 얼마나 있는지 자꾸 따라다니면서 "화면 설정해. 우리 화면 설정 된다구!!!!!!!!!"하는 느낌입니다. 사실 저 버튼은 사용자에게 필요하긴 하지만 자주 쓸 기능을 담고 있지 않습니다. 따라다니면서 리마인딩 할 이유가 전혀 없습니다. 사용자를 위해 따라다닌다기 보다는 파란이 보여주고 싶기 때문에 따라다닌다고 생각이 들게 만드네요. 뭔가 버튼에게 스토킹 당하는 느낌입니다.







[3. 훌륭한 모바일 파란(포멧만)! "20%" 아쉽다]


<모바일 파란. RSS프로그램에서 본 듯 한 구성입니다. 매우 편합니다!!!>

이번 파란의 모바일 메인 페이지 개편은 아주 훌륭합니다. 네이버나 다음 보다 사용성에 있어서는 월등해 보입니다. 물론 카테고리는 대폭 바뀌어야 겠지만 포멧만 봐서는 그래 보인다는 이야기(왜 저런 목록을 놓았는지 이해가 잘 안 가지만)입니다. 예쁜 아이콘을 포기하는 대신 압도적인 사용성을 보여줍니다. 숨김/펼침 기능을 적극적으로 사용하여 광고 빼고는 전부 숨길 수 있습니다. 이게 더 마음에 드는 점은 [재방문을 했을 때에도 숨김/펼침이 그대로 유지]된다는 것입니다. 꺄~ 훌륭합니다. 목록을 대폭 수정해서 이메일등을 저 상태에서 동기화 하여 펼칠 수 있게 만들기만 한다면 아주 편한 모바일 포털사이트가 될 듯 하네요.





꺄~ 하다가 [+]버튼이 불현듯 떠올랐습니다. 그러고 보니 모바일 웹에는 '화면설정버튼'이 없습니다. 그렇게 강조했던 버튼인데 같은 사이트의 모바일 버전에는 아예 빠져있네요. 연결성이 아쉽습니다. 아무튼 딱 보니까 모바일 웹은 숨김/펼침은 가능하지만 카테고리를 빼버리는 기능이 없습니다. 이게 문제인게, 내가 자주 사용하고싶은 카테고리가 아래쪽에 있으면 아무리 펼쳐놓아도 스크롤을 내려서 볼 수 밖에 없습니다. [뉴스]를 제외하고는 펼쳐놨을 때 첫 화면에 딱 들어오지도 않습니다. 웹에서 처럼 카테고리 삭제가 됐다면 좋았을텐데 아쉽습니다. 사실 삭제도 삭제지만 더 필요한건 '이동'인데 모바일 에서도 이동은 되지 않네요. 20%아쉽습니다.





모바일 웹을 살펴 보는 와중에 이런 생각이 들더군요. '이 방식이 [+]버튼과 [-]버튼을 누르는 것 보다 훨씬 직관적이고 편하지 않을까?' 이 것도 사실 화면설정 메뉴에 -가 포함되어있었다면 별 필요 없지만 말입니다. 아무튼 지금의 와리가리 하면서 사용자를 불편하고 혼란스럽게 하는 방식 보다는 여러모로 나아보이네요. 물론 카테고리 위치이동은 여전히 꼭 필요하겠지만요.






찾아보니 웹에서도 이 방식이 적용된 곳이 있더군요. 개편에 대한 소개를 하는 페이지인데, 당황스러운건 이곳에 [+]버튼이 있다는 겁니다. 심지어 여기는 [-]도 없어서 그저 위치 이동만 가능합니다.메인페이지에서는 같은 디자인으로 '화면설정'인데 개편 소개 페이지에서는 그저 '위치이동'이네요(화면설정이라는 글도 쏙 빠져있습니다). 디자인 일관성이 있는 것은 좋지만, 불 필요한 것이 너무 강조되어 들어가 있으면 이건 컨셉이 아니라 혹 붙이는 겁니다. 제일 튀는 버튼이 여기 저기서 역할이 다르다면 그건 일관성에서 큰 상처니까요. 아무튼 이래저래 [+]버튼이 자꾸 무리수가 되네요.




[개편소개 페이지에서 또 하나]


개편소개 페이지에서 또 한 가지 이상한 점이 있었는데, 커다란 파란Bi를 아무리 눌러도 파란 홈페이지로 귀환이 되지 않는다는 겁니다. 크고 작은 많은 사이트를 다녀 봤지만, 이렇게 로고를 크게 넣어 놓고 메인으로 안 가는거 처음 봤습니다. 스크롤을 쭈~욱 내려서 페이지 최하단에있는 "파란홈"이라고 작고 앙증맞게 써있는 버튼을 누르는 것이 사이트가 제공하는 유일한 귀환 방법입니다. [로고클릭 = 메인으로 이동]이라는 건 교과서엔 안 나와도 모두가 다 아는 공식아니었나요?






[4. 파란에 광고 할 때는 옅은 회색을 쓰지 마세요!]



광고와 로그인 부분이 붙은걸 보고 위와 같은 문제가 생길 것 같아서 새로고침으로 찾아봤는데 생각보다 쉽게 캡쳐 했습니다. 보시는 바와 같이 구분되어야 하는 두 이미지가 자연스럽게 연결되어 엉켜버립니다. 물론 광고가 다 저런색은 아니지만, 저런 바탕색이 광고에 자주 쓰이기에 큰 문제입니다. 이게 큰 문제인 이유는, 포털에서 가장 중요한 것이 광고와 로그인이기 때문입니다. FX배너를 할 때도 어지간 하면 로그인을 가리지 않으려 합니다(수익에 더 목마른 Daum은 로그인을 가리고 NAVER는 안 가리죠). NAVER의 경우 메인배너가 좌측의 회색 박스와 붙어있지만, 잘 보시면 그게 광고와 연결되는 내용임을 알 수 있습니다. 붙어있어도 괜찮은거죠 내용상.





광고와 로그인이라는 포털의 가장 핵심적인 두 가지 요소가 서로 엉켜서 묻혀버리는 상황이 벌어지는 것은 디자인상의 큰 실수입니다. 애초부터 레이아웃을 잡을 때 부터 저런 일이 절대 벌어지지 않도록 해야합니다. 이 문제는 반드시 수정되어야 하는 중차대한 문제입니다.






[그렇지만 파란 개편은 긍정적이다]

여러가지 문제점은 보이지만 파란의 개편은 전체적으로 봤을 때 긍정적으로 보입니다. 우선 자신들이 사용할 컬러를 확실히 잡았고, 그 컬러가 타 사이트와는 구분되며 산뜻하죠. 저는 이 개편이 UX적인 측면에서 아쉬운 부분이 많지만 그래도 디자인적인 부분에서는 파란을 몇 단계 끌어올리는 계기가 될 것이라는 생각입니다. 또한 이 작업을 진행한 모든 사람들이 이뤄낸 결과에 대해 박수를 보냅니다. 급격한 개편을 하는 과정에서 겪었을 많은 난관들을 이겨낸 그분들을 생각하니 디자이너의 한 사람으로서 가슴이 찡 하네요. 어떤 작업물을 볼 때에는 작업자 보다 컨펌자가 더 중요한게 가슴아픈 이 바닥의 현실이니까요. 하지만 그렇다 해도 몇 가지 개선은 필요해 보입니다. 아이폰 유저로서 파란이 더 좋은 포털이 되었으면 하는 바람을 남기며 글을 마칩니다. 

이 게시물을..