[저널리즘의 미래 49] 뉴욕타임스 웹사이트 리디자인 비하인드 스토리

newyorktimes

*주: 며칠 전 에이케이스는 뉴욕타임스가 웹사이트 디자인을 어떻게 바꿨는지 소개한 바 있다. 올해 뉴욕타임스가 처음으로 한 일은 새로 디자인한 웹사이트를 선보인 일이었다. 그간 사용해왔던 각종 코딩이며 디자인을 완전히 뜯어고치는 규모의 작업이었다. 원활한 협업, 전략의 설정과 공유, 자칫 지루할 수 있는 단순작업, 창의성 등이 요구됐을 것이다. 이 프로젝트에는 디자이너, 개발자, 뉴스룸구성원, 광고담당자 등이 참여했다. 서로 다른 이해관계를 가진 대규모 ‘사공들’이 배를 산으로 이끌지 않고 무사히 항해할 수 있었던 힘은 어디에 있었을까? 오픈뉴스에서는 뉴욕타임스 리디자인 프로젝트에 참여했던 디자이너와 개발자를 인터뷰했다. 어떤 비하인드 스토리가 있는지 발췌번역소개한다.

1. 웹사이트 리디자인의 목표

Renda Morton(디자이너, 아래 RM): 우리회사는 진짜 커요. 동시에 빠르게 변화하려고 하죠. 우리 웹사이트는 플랫폼 중 가장 큰 규모일 거예요. 그렇기 때문에 모든 것을 동시에 새로 디자인한다는 것은 거의 악몽과 같죠. 그래서 먼저 기사 페이지를 바꾸기로 한 거예요. 1월 8일에 개편한 건 사이트 전체 리뉴얼이라고 볼 수는 없고 그저 기사 페이지를 리뉴얼한 거죠. 메인페이지랑 프론트섹션, 그리고 블로그 일부는 약간 손보긴 했어요. 기사페이지와 아귀를 맞추기 위해서 그렇게 한 거죠.

우리가 기사 페이지부터 새로 디자인 한 이유는 어쩌면 당연해요. 다른 사이트들도 마찬가지겠지만, 우리 독자들이 우리 웹사이트를 찾아서 하는 일은 기사를 읽는 거거든요. 메인페이지는 그냥 스쳐지나가는 수준이죠.

메인페이지와 프론트 섹션은 곧이어 개편하려고 하고 있어요. 기사페이지 개편 방향이랑은 좀 다를 것 같긴 하지만요. 이 개편은 느리고 점진적인 진화 정도로 보시면 될 거예요.

아직도 기사페이지 개편을 끝냈다고 볼 순 없어요. 기사가 단지 인터넷 안에서 썩어가길 바라지 않거든요. 우리가 원하는 옵션을 시도하지도 못 했는데 이 정도로 끝내고 싶지도 않아요.

우리가 웹사이트를 새로 디자인하면서 설정했던 목표는 이거에요.

1) 더 빠르고
2) 더 유연하고 기기별로 적절히 구현되고
3) 일관성 있고
4) 뉴스룸에서 편리하게 웹사이트를 활용할 수 있고
5) 독자들이 더 쉽게 읽고 더 쉽게 둘러보고 더 쉽게 서칭할 수 있고
6) 정기구독자들을 유지하고 더 유치할 수 있고
7) 광고환경의 질이 높아지게 하는 것이죠.

2. 웹사이트 리디자인의 동기 그리고 시점.

Allen Tan(아래 AT): 뿌리부터 다시 구축하려는 요구가 많이 있었던 것도 한 이유예요. 지난 6년 동안 쌓여왔던 코딩이라든지 디자인을 완전히 날려버리고 새로 구축했죠. 더 빠르고 더 유연하게 만들려고요.

Eitan Konigsburg(아래 EK): 맞아요. 기술적 벽에 부닥치기도 했어요. 사이트 전체를 가늠하는 게 깨나 어려워서… 지금까지는 축적되어온 기술들이 빚쟁이처럼 발목을 잡았어요. 웹사이트를 현재 상황에 맞게 바꾸고 디자인하는 것이 어려웠죠. 그래서 이번 웹사이트 리디자인 프로젝트를 하는 김에 기술적인 토대를 완전히 새로 구축하자고 얘기가 된 거예요. 이 결정은 웹사이트 리디자인뿐만 아니라 내부 구성원들이 더 밀접하게 교류하며 일할 수 있게 하는 것과도 밀접하게 연관되어 있어요.

3. 난관

RM: 디자인 측면에서 가장 힘들었던 것은 우리 내부의 구조와 과정이었어요. 웹사이트 디자인은 기사편집에 영향을 주기 때문에 뉴스룸의 요구가 반영되어야 하는 측면이 있죠. 비즈니스 목표와 그에 따른 요구에도 맞아야 해요. 독자들의 입장도 고려되어야 하고요. 디자인으로 뉴스룸과 비즈니스, 독자들 전부를 충족시키는 경우가 일부 있긴 하지만 대개는 약간의 타협점이 필요하게 돼요. 그 타협점을 찾는 게 힘들었어요. 어쩔 때는 과현 타협점이 있긴 한 건가 하는 의심도 하게 됐어요. 다른 어려운 점들도 많았는데, 여기에 필적할 정도는 아니었어요.

EK: 어려운 점이야 많았죠. 웹브라우저를 개발하는 데 우리 모두 신나 있었음에도 불구하고 어떤 디자인에는 기술이 잘 구현되지 않았어요. 예를 들어 이미지사이즈가 제대로 나오지 않는 경우가 있었죠. 메인 페이지에서 콘텐츠들 간에 너무 다닥다닥 붙어 있게 하지 않게 만드는 것도 어려운 점 중 하나였어요. 스크린이 좁은 경우에 한 콘텐츠와 다른 콘텐츠 간의 거리가 너무 좁은 것처럼 보였거든요. 이를 해결하는 방법은 그저 실험하고 또 실험하는 거였어요. 콘텐츠를 배치하는 기술은 굉장히 다양한데 그걸 일일이 시도한 거죠. 어떤 기기로, 어떤 환경에서 어떻게 우리 콘텐츠를 접하든지 ‘예쁘게’ 보이게 하는 일에는 노력이 많이 필요해요.

AT: 레이아웃은 유연하게 반응하도록 디자인됐어요. 기사 내용을 반영하고 독자가 사용하는 기기별로 알맞은 사이즈를 조정하는 식이죠. 모든 경우를 세보면, 126가지 버전이 있는데, 아마 더 많아질 거예요.

4. 광고

RM: 광고는 우리 웹사이트의 핵심적인 부분이에요. 다른 부분과 비슷한 정도로 신경을 많이 썼죠.

5. 내부 커뮤니케이션

RM: 하루 종일 웹사이트 개편만 붙잡고 있는 멤버가 40명이에요. 전담 인원 외에 참여자들까지 세면 80명을 넘어서죠. 디자이너, 개발자, 뉴스룸대표자와 비즈니스담당자로 구성되어 있어요. 이 네 그룹은 개편과정에 전면적으로 참여했어요. 리디자인 프로젝트는 거의 2년이 걸렸는데 네 그룹이 같이 일하는 과정에서 프로젝트의 방향이 여러 번 바뀌고 또 진화했죠.

AT: 디지털디자인팀은 대략 25명 정도 되는데, 이 중 10명 정도가 리디자인 프로젝트에 차출됐어요. 그 중에서도 네다섯 명은 처음부터 끝까지 관여했죠. 우리는 주 단위로 진행과정을 설명하고 또 토론하는 미팅을 가졌어요. 이 미팅이 정말 재밌었던 건 진행과정이 좀 미쳤나 싶을 정도로 다양했기 때문이에요. 서로가 서로에게서 영감을 얻었죠. 어떤 격식이나 공식적 절차 같은 건 필요치도 않더군요.

6. 성공의 척도

RM: 애초에 목표했던 것이 이뤄지면 성공한 거죠.

1 더 빠르고
2 더 유연하고 기기별로 적절히 구현되고
3 일관성 있고
4 뉴스룸에서 편리하게 웹사이트를 활용할 수 있고
5 독자들이 더 쉽게 읽고 더 쉽게 둘러보고 더 쉽게 서칭할 수 있고
6 정기구독자들을 유지하고 더 유치할 수 있고
7 광고환경의 질이 높아지면

성공한 겁니다.

김정현

출처: 오픈뉴스, https://source.opennews.org/en-US/articles/behind-scenes-nyt-redesign/
진출처: 크레인스뉴욕, http://www.crainsnewyork.com/

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s