완성된 시안 한 장은,
마감부터 읽힙니다

결론부터 말씀드리면 — 첫 화면 시안을 완성된 한 장으로 받으면 대표님이 내려야 하는 두 종류의 결정이 한 덩어리로 도착합니다. 하나는 무엇이 먼저 오고 무엇이 잘리는지에 관한 결정이고, 다른 하나는 색·사진·글꼴에 관한 결정입니다. 같이 오면 답도 한 덩어리로 나오고, 그 한마디가 어느 쪽을 가리키는지 말한 사람도 정확히 모릅니다.

한 화면에 두 층이 겹쳐 있습니다

첫 화면은 사실 두 층으로 되어 있습니다. 아래층은 순서와 무게입니다. 무엇을 맨 위에 두는가, 어떤 문장이 가장 크게 들어가는가, 버튼이 스크롤 전에 있는가, 화면이 잘릴 때 무엇이 먼저 사라지는가. 위층은 마감입니다. 색, 글꼴, 사진, 여백의 촘촘함, 움직임.

완성본 시안은 이 두 층이 이미 붙은 상태로 옵니다. 그리고 사람이 화면을 볼 때 먼저 읽히는 쪽은 위층입니다. 색과 사진은 읽지 않아도 들어오고, 순서는 한 번 따라가 봐야 보입니다. 그래서 검토 자리에서 먼저 나오는 말은 대개 "느낌이 좀…" 쪽입니다.

문제는 그 말이 번역되는 과정입니다. 실제로는 사진 한 장이 마음에 안 든 것인데, 받는 쪽에서는 화면 전체를 다시 그려 오는 일로 번역되는 경우가 생깁니다. 반대 방향도 있습니다. 마감이 잘 되어 있으면 순서가 틀린 것도 통과됩니다. 잘 만들어진 화면은 검토를 계속하게 만들지 않고 멈추게 만듭니다.

되돌리는 비용이 층마다 다릅니다

두 층을 굳이 나누는 이유는 취향을 존중하기 위해서가 아니라, 나중에 뒤집을 때 드는 비용이 서로 다르기 때문입니다. 색을 바꾸는 일은 대개 그 자리에서 됩니다. 사진을 교체하는 일도 비슷합니다.

순서는 다릅니다. 순서를 바꾸면 그 위에 올려 둔 마감이 대부분 다시 필요해집니다. 문장이 들어갈 자리의 폭이 달라지니 길이를 다시 맞춰야 하고, 사진이 놓일 크기가 달라지니 잘라 낸 비율을 다시 잡아야 하고, 간격도 전부 다시 봅니다. 한 줄을 위로 올리는 결정이 화면 전체를 다시 만드는 작업이 되는 겁니다.

여기서 순서가 어긋납니다. 가장 비싸게 뒤집히는 결정이 완성본에서는 가장 늦게 언급됩니다. 색 이야기를 두 바퀴 돌고 나서 "그런데 이거 순서가 좀 이상한 것 같다"가 나오면, 그 두 바퀴가 대부분 버려집니다. 시안을 세 번 네 번 받아도 같은 자리에 머무는 느낌이 드는 경로 중 하나가 이것입니다. 리뉴얼을 반복해도 결과가 비슷한 이유는 매번 같은 층만 갈아 끼우기 때문이라고 따로 적어 뒀는데, 시안 검토 자리에서도 같은 일이 작은 규모로 일어납니다.

두 번으로 나누는 방법

업체가 이렇게 진행하지 않더라도 발주하는 쪽에서 요구할 수 있는 형태로 적습니다.

1. 1차는 순서만 봅니다. 색과 사진 없이, 글자와 자리만 있는 화면으로 받습니다. 이 자리에서 답할 질문은 세 개입니다. 첫 문장이 우리가 정한 1순위 방문자에게 하는 말인가, 그 사람이 할 행동 하나가 스크롤 전에 보이는가, 이 화면에서 잘려도 되는 것은 무엇인가. 예쁜지는 묻지 않습니다. 회사 소개가 첫 화면의 어느 자리에 오는지도 이 단계의 결정이고, 그 자리가 왜 뒤여야 하는지는 첫 화면에 회사 소개를 쓰면에 정리해 뒀습니다.
2. 1차에서 정한 것을 문장으로 남깁니다. "1순위 방문자는 누구, 이 화면에서 할 행동은 하나, 순서는 한 줄 설명 → 확인 재료 → 버튼, 소개는 아래로." 이 정도로 짧아도 됩니다. 이게 없으면 2차에서 색을 이야기하다가 순서가 슬며시 바뀌고, 나중에 언제 바뀐 건지 아무도 모릅니다. 확정이라는 말은 문장으로 남을 때만 힘이 있습니다.
3. 2차는 같은 순서 위에서 마감만 봅니다. 색, 글꼴, 사진, 움직임. 사진은 이 단계의 가장 큰 변수인데 사진 한 장이 문단 셋을 이기는 자리이기도 해서, 여기서 시간을 쓰는 건 낭비가 아닙니다. 움직임도 이 단계입니다. 움직임이 문제가 되는 건 화려함이 아니라 정보가 도착하는 시각을 늦추기 때문이라 순서가 확정된 뒤에 얹는 편이 맞습니다.
4. 차수마다 답하는 자리를 정합니다. 1차에서 답하는 사람은 사업을 결정하는 사람입니다. 어떤 손님을 먼저 받을지는 취향 밖의 문제이기 때문입니다. 2차는 브랜드의 톤을 고르는 자리이고 여기서는 취향이 정당한 근거가 됩니다. 같은 한 사람이 둘 다 해도 되지만, 지금 어느 쪽 결정을 하는 중인지는 정해 두어야 답이 섞이지 않습니다. 어디까지가 취향의 영역인지는 취향과 기준에서 나눠 적었습니다.
5. 실물 크기로 봅니다. 1차 판정은 시안 이미지를 컴퓨터 화면에 크게 띄워 놓고는 할 수 없습니다. 그 상태에서는 휴대폰에서 어디가 잘리는지가 보이지 않기 때문입니다. 시안 이미지를 휴대폰으로 열어 실제 첫 화면 높이만큼만 보고, 그 안에 무엇이 들어왔는지로 판정합니다. 스크롤 전에 버튼이 없다는 사실은 이 방법으로만 발견됩니다.

이 순서로 가면 검토 자리의 대화가 달라집니다. "좋다·별로다" 대신 1차에서는 "이 순서로 읽히는가"를, 2차에서는 "이 톤이 우리 브랜드인가"를 이야기하게 됩니다. 두 질문은 답할 수 있는 질문입니다. 기준이 없는 상태로 화면을 보면 판단이 느낌으로 좁아지는 이야기는 시안이 안 나오는 구간에서 한 단계 앞의 문제로 다뤘습니다.

나누지 않아도 되는 경우

두 번으로 나누는 게 항상 이득은 아닙니다. 단계가 하나 늘어나니 확정까지 시간이 더 걸리고, 1차 화면은 볼 게 없어서 답답합니다. 쓸 틀이 이미 정해져 있고 페이지가 한두 장이라면 한 번에 봐도 무리가 없습니다. 하는 일이 한 줄로 설명되는 사이트라면 순서에 선택지가 별로 없기도 합니다.

반대 방향의 실수도 있습니다. 1차를 서류 승인 절차로 만드는 경우입니다. 글자만 있는 화면을 놓고 회의를 길게 하고, 도장을 찍듯 확인만 하고 넘어가면 형식만 남습니다. 1차에서 실제로 걸러져야 하는 것은 위의 질문 세 개에 대한 답이고, 그 답이 나오면 오래 붙잡을 이유가 없습니다.

그리고 한 가지 더. 1차에 색과 사진이 없다고 해서 1차를 대충 넘기고 2차에서 다 보겠다고 하면, 나누지 않은 것과 결과가 같아집니다. 오히려 순서 결정이 뒤로 밀린 만큼 더 나쁩니다. 첫 화면에 넣을 것이 계속 늘어나는 상태라면 그건 시안 문제가 아니라 1순위가 아직 안 정해진 상태입니다.

다음 시안 검토 전에 확인해 보세요

제작을 앞두고 계시든 이미 시안을 받는 중이든 같은 목록입니다.

• 지금 받은 시안에서 순서에 관한 답과 마감에 관한 답을 따로 적을 수 있는가?
• 1차에서 확정했다고 알고 있는 내용이 문장으로 남아 있는가?
• 시안을 휴대폰으로 열어 첫 화면 높이만큼만 본 적이 있는가?
• 그 화면 안에 행동 하나가 들어와 있는가?
• 순서를 바꾸는 요청과 색을 바꾸는 요청이 같은 무게로 취급되고 있지 않은가?

마지막 줄이 걸리면 일정부터 흔들립니다. 순서를 바꾸는 요청은 마감을 다시 만드는 일을 포함하기 때문에, 색 하나 바꾸는 요청과 같은 칸에 적히면 기간이 조용히 늘어납니다. 기간이 업체의 작업 속도가 아니라 결정이 도착하는 속도로 정해지는 이유가 여기에도 있습니다.