태그 보관물: UI

디자인에서 글과 문구도 중요하다

Fast Company에 Google Ventures에서 말하는 Interface copy(UI에 들어가는 문구)를 올바르게 적는 5가지 룰이란 글이 올라왔습니다.

(Interface copy란 UI에서 주로 볼 수 있는 라벨, 버튼, 설명들에 들어가는 짧은 문구들을 말한다고 하네요.)

사실 글 내용보다 서론이 와 닿았는데요, 많은 테크 기업들에게 디자인은 미지의 신비로운 영역처럼 비쳐집니다. 하지만 디자인은 디자이너들이 마법처럼 창조해내는 것이 아닌 이성적이며 객관적인 작업이라는 것을 밝히고 있습니다. 그리고 글을 적는 것 또한 디자인 스킬이며 주변의 뛰어난 디자이너들이 비주얼 디자이너로 불리기를 싫어한다고 하네요.

디자인이란 주로 외견으로 나타나기는 하지만 디자인은 그 제품이 뭘 하느냐, 어떻게 동작하느냐, 무얼 말하느냐 와 같은 모든 것들을 표현하는 것입니다. 그래서 마지막 항목인 ‘제품이 사용자들에게 무얼 말하느냐’가 의외로 디자이너로써 결정해야 할 굉장히 중요한 항목인 걸 깨달았다고 합니다. 비주얼적으로 못난 프로토타입들이 아름답고 세련되고 섹시한 프로토타입들보다 뛰어난 결과를 보여주기도 했다네요.

we use design to figure out all sorts of things: What a product does, how it works, and what it says.

그럼 이들이 밝힌 Interface copy를 적는 5가지 룰을 나열해보겠습니다.

1. Clarity is king (명료함이 최고!)

명료하면 좋은 건 당연해 보이는데요, 어떻게 해야 간결하고 명료하게 표현할 수 있을 까요?

– Be specific. 구체적이어야 합니다. Filter를 말할 때 Search이라고 쓰면 안되는 것이고 ‘Save’랑 ‘Submit’은 다른 것이지요.

– Jargon과 Abbreviation에 주의. 전문 용어나 은어는 쓰지 말아야 하고 줄임말도 자제해야 합니다. 이 부분은 IT직종에 있으면 참 힘든 부분인 것 같은데 다 알 것이라고 생각되는 것들도 일반인들이 모르는 경우가 참 많습니다.

– 중요한 말을 앞으로. ‘name (first)’가 아닌 ‘first name’라고 써야하고 ‘Click to continue’가 아니라 ‘Continue’로 써야 합니다.

– 게으르면 안된다. ‘Okay’나 ‘Cancel’같은 기본 대신에 무슨 일을 하는지 정확히 명시할 것.

2. 개성은 생각만큼 중요하지 않다

모두들 튀고 싶어하고 많은 스타트업들이 개성있는 브랜드를 만들고 싶어합니다. 브랜딩에 있어서도 글은 큰 역할을 하며 중요하지만, 무엇보다 중요한 것은 명확하고 명료한 것 입니다.

개성에 치중할 경우 ‘Okay, let’s get started!’나 ‘Sounds good!’같은 헤드라인과 버튼을 쓰기도 합니다. 하지만, 헤드라인과 버튼은 제품의 기둥과 같으며 사용자와의 정확한 소통을 위해 100% 집중해야 하는 부분입니다. 그래서 항상 이해하기 쉬우면서 도움이 되도록 ‘Tell us about your business’, ‘Save and continue’ 처럼 적는 게 좋습니다.

먼저 기본적인 것은 명료하게 표현한 후에 subhead나 부가적인 문구들에서 개성을 나타내면 됩니다. 하지만 너무 노력할 필요는 없는게 개성은 자연스럽게 나타나게 되어 있습니다.

3. Just tell me

사용자들에게 그들이 뭘 알았으면 하는지 바로 전달하라는 얘기입니다. ‘a better way’, ‘a new way’ 같은 것 보다 정확히 그게 뭔 지를 알리는게 중요하다는?

또, 여러 페이지를 차례로 진행해야하는 웹사이트의 경우 ‘Next’라고만 하는 것 보다는'[Save and continue >>] 다음에 우리는 몇몇 개인적인 정보를 물어볼 것입니다’와 같이 표현하는 것이지요.

4. 사람들은 사실 읽는다

많이들 사람들은 잘 안 읽는다고 하지만 다양한 앱이나 사이트를 사용자 분석에 활용한 것을 보면 사람들은 (놀랍지만!) 소프트웨어 제품의 글들을 읽습니다.

헤드라인이 가장 눈에 띄면서 사람들이 읽는 것이며 조작할 수 있는 버튼, 링크, form 라벨들도 읽는 부분입니다. 이것들은 화면의 가장 중요한 단어들이며 가장 신경을 써야 할 부분들이죠. 화면이 작은 폰이나 태블릿의 경우는 문자가 들어갈 공간이 적으므로 그 중요성은 더 높아집니다. 사람들은 제품의 copy를 읽을 것이므로 제대로 하기 위해 시간을 들일 필요가 있습니다.

단순한 글이라도 신뢰감을 주고 믿음을 주는 데에 큰 영향을 미칩니다. Blue Bottle Coffee의 사례를 보면 홈페이지에 창업 스토리를 올린 것 만으로 회사를 더 진지하고 믿을만한 기업으로 보이게 했다고 합니다. 금융과 관련된 제품에서는 보안과 프라이버시 기능에 대해 설명하는게 제품의 신뢰도를 높이는데 도움을 주고요.

5. Writing은 디자인의 한 과정이다

Writing은 인터렉션 디자인, 비주얼 디자인, 프로토타이핑 만큼이나 중요한 디자인의 핵심 요소입니다.

또 Writing은 다른 디자인 스킬과 마찬가지로 단계적인 프로세스의 한 과정이 아닙니다. 처음이나 중간, 마지막 과정에 하는 작업이 아니라 디자인의 전체 과정 속에서 계속해야 한다는 것이지요.

웹사이트를 개발할 때 처음에 클라이언트로부터 모든 문구가 전달되어서 온다면 그건 제한이며 요구사항이 됩니다. 또 디자인을 할 때 모든 장소에 ‘lorem ipsum’으로 채워 넣고 작업을 한다면 그것도 잘못된 방식입니다. (lorem ipsum은 무조건 피해야 합니다.)

제품을 디자인할 때 초기 프로토타입은 모든 면에서 덜 다듬어졌으며 투박할 것입니다. 이 프로토타입을 테스트하면서 개선을 해나가는 것인데 Writing이 이 과정에서 빠져있다면 우리는 사용자 경험의 큰 부분을 빼놓는 것이 되며 제품은 고통받게 되겠지요.

From Google Ventures: 5 Rules For Writing Great Interface Copy

제품 개발시 소홀하게 되는 부분인 문구의 중요성에 대해서 역설하는 글인데 생각해볼 가치가 있는 것 같습니다.

그런데 사실 제품 개발에 중요하지 않은게 뭐가 있을 까요. UI의 1픽셀도 중요하며 사용자 인터랙션도 중요하며 안정적으로 잘 동작하는 제품 자체도 중요하겠지요. 리소스가 부족한 스타트업에겐 부족한 리소스를 어떻게 잘 활용해서 선택과 집중을 하는게 가장 중요할 것 같네요.

이제 앱은 기존의 복잡한 앱을 대체해야 한다

Complicated Apps Are The New Excuse:

My point being, whilst apps have evolved in the past five years, the “excuse” has remained the same. Developers want us to ditch old, analog ways of managing our information to embrace the digital era. […] But the digital era has already started. And it’s been one giant, massiveboom. So wouldn’t it be more appropriate for these new, innovative apps to tell us that we should ditch old, PC-like complicated apps instead?

Clear와 Paper의 등장은 사람들 사이에서 당연하고 이해하기 쉬운 UI가 좋은가, 단순하면서 참신한 UI가 좋은가에 관한 많은 논의를 불러일으키고 있다.

그리고 지금껏 생산성 앱들은 냉장고에 붙어있는 포스트잇이나 냅킨에 노트를 적는 낡고 아날로그 적인 방식을 바꿔줄 것이라며 홍보하고 있는데 이것은 대체 언제적 일인가? 아직도 그렇게 노트를 적는 사람이 많을까?

이미 세상은 디지털화되어 스마트폰에 메모를 적는게 일상이다.

Clear와 Paper가 보여주는 것은 모바일에 여전히 낡고 복잡한 PC시대에서의 방식이 아직 많이 남아있고 새로운 앱은 기존의 복잡한 앱을 대체하여 새로운 접근 방식을 보여야한다는 것이다.