일관된 설계 시스템을위한 매크로 / 마이크로 비전

디자인의 음과 양을 번갈아 가면서 일관성과 유연성의 완벽한 균형을 이끄는 방법.

사진 : Brett Jordan

T의 어떤 디자인 시스템 옹호에 ALK 당신은을 통해 단어 "일관성"을 듣고 이상 것입니다. 고객 경험의 일관성은 우리의 디자인 분야를 성숙시키고, UX 모범 사례를 관리하고, 많은 사랑받는 브랜드와 서비스를 업계 최고 수준으로 끌어 올린 것입니다.

일관성이 좋은 UX 및 시각적 디자인의 핵심 원칙이라는 것을 모두 알고 있습니다. 친숙 함을 제공하고 직관적 인 행동을 강화하며 강력한 브랜드 아이덴티티를 확립합니다. 일관된 경험은 신뢰를 구축하는 데 도움이되지만 분리 된 디자인은 신뢰를 약화시킵니다.

Design great Massimo Vignelli는 일관성을 "훈련"으로, " 전체적으로 의도의 연속성 "을 만드는 목표를 설명 합니다. 연속성의 반대는 단편화입니다.

디자인의 일관성은 효율성도 가져옵니다. 스타일과 구성 요소를 재사용하면 설계 제작 속도가 빨라지고 개발이 더욱 체계화되고 유지 관리 가능하며 확장 가능합니다. 조각난 시스템은 디자이너이자 개발자에게 최악의 악몽입니다.

그러나 디자인 일관성에는 어두운면이 있습니다. 일관성을 과도하게 강조하면 강성이 발생합니다. 유연하지 않은 (변화와 성장에 적응할 수없는) 디자인 시스템은 시스템이 전혀없는 것보다 혁신을 더 방해 할 수 있습니다.

일관성과 유연성은 균형을 찾아야합니다. 그렇기 때문에 모든 좋은 디자인 시스템은 구부러지고 조정할 수있는 몇 가지 지침뿐만 아니라 변하지 않는 절대 값을 제공합니다.

이것이 효과적인 디자인 시스템의 음양입니다. 일관성에 너무 많은 초점을 맞추면 설계 프로세스가 지배적이며 제한적이고 엄격한 상태가됩니다. 유연성이 너무 높으면 조각화가 발생하고 대규모 효율성이 저하됩니다.

일관성은 일관성입니다.

일관성이 너무 엄격해서 이상적인 설계 시스템을 구축 할 수 없다면 대안은 무엇입니까? 일관성 .

이것은 디지털 제품 디자인 분야에서 새로운 아이디어가 아닙니다. Bruno Bergher , Jon YablonskiCarlos Yllobre 는 다른 사람과 마찬가지로 이에 대해 작성했습니다. Bergher 말한다 :

일관성이란 제품의 모든 부분을 똑같이 만들려고하는 대신 제품의 모든 부분이 거기에 속한 것처럼 느끼도록하는 것을 의미합니다.

일관성이 반드시 일관성을 의미하는 것은 아닙니다. 대신 일관성의 관점에서 생각함으로써 우리는 너무 규범적인 함정을 피합니다.

일관성이란 모든 것이 함께 속한 것처럼 보이는 무언가를 만드는 것을 의미합니다. 자연스럽고 기대에 부합하는 경험입니다. 특정 상황에서 일관성이없는 것이 더 효과적이라는 결론으로 ​​이어지는 경우에도 모든 세부 사항과 설계 결정이 고려되었는지 확인합니다.

UX 마스터 인 Jared M. Spool은 Consistency in Design is the Wrong Approach에서 동일한 결론을 공유합니다 .

“디자인의 일관성은 요소를 균일하게 만드는 것입니다. 모양과 동작이 동일합니다. 디자이너가 일관된 탐색, 일관된 페이지 레이아웃 또는 일관된 제어 요소에 대해 이야기하는 것을 자주 듣습니다. 각각의 경우 디자이너는 균일 성을 만들어 유용성을 활용할 수있는 방법을 찾고 있습니다. 결국 사용자가 한 곳에서 디자인을 작동하는 법을 배우면 그 지식을 다음 곳으로 옮기는 것은 어떨까요? 이 모든 것이 좋습니다. 하지만 틀 렸습니다.”

일관성에 대한 디자이너의 목표의 문제는 사용자가 아닌 자신의 세계에 대해 생각한다는 것입니다. 제품에서 길을 잃고 이해 관계자 피드백 및 스프린트 마감일에 대한 가장 즉각적인 관심사로 비전을 좁히는 것은 쉽습니다.

예, 일관성은 종종 배우고 이해하기 쉬운 사용자 경험으로 이어집니다. 그러나 디자인 시스템 구축의 핵심적인 세부 사항에 들어가면 우리 자신의 이익을 위해 일관성에 의존하게됩니다. 우리는 설계 결정을 더 쉽게, 생산 속도를 높이고, 코딩을보다 쉽게 ​​관리 할 수 ​​있도록합니다.

이를 수정하기 위해 Spool은 생각을 일관성에서 사용자의 "현재 지식"으로 전환해야한다고 주장합니다. 현재 지식 은 사용자가 설계에 접근 할 때 가지고있는 지식입니다. 관련 제품 및 디자인에 대한 이전 경험의 합계입니다. "내가 디자인하는 것이 과거에 디자인 한 것과 일치 하는가?"라고 묻는 대신 그는 우리가 "사용자의 현재 지식이 내가 디자인하는 것을 사용하는 방법을 이해하는 데 도움이 될까요?"라고 물어야한다고 생각합니다.

Spool은 현재 지식에 대한 그의 개념을 다음과 같이 요약합니다.

“일관성에 대해 생각할 때 제품에 대해 생각하는 것입니다. 현재 지식에 대해 생각할 때 사용자에 대해 생각하는 것입니다. 그들은 같은 동전의 양면입니다. 우리는 사용자에 대해 생각하는 데 더 많은 시간을 소비하는 디자이너가 더 유용한 디자인으로 끝나는 것을 알게되었습니다.

현재 지식에 대해 생각할 때 재미있는 점 : 작업을 마치면 인터페이스가 일관되게 느껴집니다. 왜? 사용자의 기대에 부합하고 이전에 경험 한 것과 같은 방식으로 작동 할 것으로 기대하기 때문입니다. "

를 기반으로 설계 현재의 지식은 을 위해 디자인 한 가지 좋은 방법입니다 일관성 대신 일관성 . 디자인 시스템에서 달성 한 일관성 수준은 사용자에게 의미가 없습니다. 중요한 것은 당신이 만든 경험이 일관된 느낌이라는 것입니다. 일관성은 일관성을 구축하는 데 도움이되는 도구 일 뿐이며 "현재 지식"은 일관성을 유지하기 위해 사용자에 대한 가치에 초점을 맞추는 데 도움이됩니다.

그러나 우리가 사용자 중심을 유지하더라도 디자인 일관성에 대한 우리의 경로를 방해 할 수있는 다른 많은 것들이 있습니다. 가장 큰 원인은 확대 및 축소하는 것을 잊는 것입니다.

매크로 대 마이크로 디자인 — 컨텍스트와 일관성의 내부 투쟁

패턴 라이브러리 또는 디자인 시스템을 구축하고 성장시키는 일을 담당하고 있다면-지금 제가 그렇듯이-거시적 수준과 미시적 수준 모두에서 생각할 필요가 있음을 잘 알고있을 것입니다. 그게 무슨 뜻입니까? Autumn Sullivan정의는 다음과 같습니다 .

“특정 또는 미시적 사고 가는 문제 의 방식 에 초점을 맞추는 경향이 있습니다. 그들은 효율성, 프로세스 및 시스템의 전문가입니다. 그들은 한 번에 문제의 각 부분의 세부 사항에 매우 집중하기 때문에 새로운 프로세스 또는 계획에서 잠재적 인 격차 또는 함정을 식별 할 수 있습니다. 또한 목표를 달성하는 경향이있어 훌륭한 동기 부여가 될 수 있습니다.

전체 론적 또는 거시적 사상가는 또한 창의적인 사상가 인 경향이 있습니다. 이 사람들은 상자 밖에서 생각하고 두 개 이상의 서로 다른 개념을 연결하는 능력은 놀라운 솔루션과 창의적인 캠페인을 초래할 수 있습니다. 그들의 열정과 비전은 팀의 인연과 동기를 불러 일으킬 수 있습니다.”

디자인의 실제 문제에 적용될 때 :

마이크로 (특정) 디자인은 상황에 맞는 작은 결정에 관한 것입니다. 여기에서 사용할 컨트롤, 거기에서 사용할 텍스트 스타일, 화면 또는 흐름이 바로 주변 환경에서 작동하는 방식에 관한 것입니다. 디자이너는 매일 수백 가지의 미시적 결정을 지속적으로 내립니다. 미시적 결정은 작업을 완료하는 것입니다. 확대되고 있습니다.

매크로 (전체적) 디자인은 축소 할 때 시스템 전체를 볼 때입니다. 미시적 수준에서 변경 될 때마다 "이러한 결정이 시스템 전반에 영향을 미칠 때 어떤 영향을 미칩니 까?"또는 "이 결정이 설계 시스템 일관성을 개선하거나 약화 시키는가?"라고 생각합니다.

매크로 디자인은 일관성을 만드는 반면 마이크로 디자인은 유연성을 요구합니다. 비전이 미시적 수준에 머물러 있으면 일관성을 잃고 조각화되기 시작합니다. 당신의 비전이 너무 거시적이라면, 당신은 마이크로 니즈의 폭을 인식하지 못할 것이고 진화하기에는 너무 단단한 시스템을 구축 할 것입니다.

최고의 설계자는 모든 중요한 설계 결정이 미시적 맥락 적 가치와 거시적 시스템 상태 사이에서 올바른 균형을 찾을 수 있도록 확대 및 축소 된 비전 사이에서 끊임없이 진동하고 있습니다. 한 사람이 그 비전을 머릿속에 담을 수 없다면, 두 가지 역할을 모두 수행 할 수있는 상호 보완적인 사상가 팀을 구성해야합니다. 모든 설계 시스템에는 모든 응용 프로그램에서 품질과 일관성을 보장하는 데 필요한 매크로보기가있는 중앙 챔피언이 하나 이상 있어야합니다.

설계 프로세스의 내부 작업에서 너무 멀리 떨어져있는 이해 관계자는 거의 항상 너무 미시적이라고 생각할 것입니다. 작은 결정으로 보이는 거시적 결과를 알지 못합니다. 그들은 단일 화면이나 여정의 맥락에서 완벽하게 이해되는 겉보기에 피상적 인 변화를 요청하지만 거시적 수준에서 고려할 때 근본적인 시스템 전체 전략을 재고해야하는 광범위한 결과를 낳습니다. 일상적인 거시적 결정을 다루는 사람들 만이 시스템의 일관성 원칙에 맞지 않는 미세 변경의 나비 효과를 진정으로 이해합니다.

E very 디자인 시스템은 일관성과 유연성의 밀고 당기기를 가질 것입니다. 더 큰 복잡한 시스템은 더 큰 유연성을 요구하지만, 다양성이 단편화되지 않도록하기 위해 더 강력한 일관성에 의존합니다. 디자인 시스템 소유자의 임무는 음과 양의 균형을 맞추기 위해 양측의 시야를 잃지 않는 것입니다. 마이크로와 매크로를 한 번에 함께 볼 수있는 능력이 있으므로 작은 상황 적 요구와 전체 시스템의 장점 사이에서 균형을 이루는 전략적 결정을 즉시 내릴 수 있습니다.

이 수준에서 지속적으로 조사되는 디자인 시스템 만이 팀을위한 지속적이고 확장 가능한 도구로 성장할 것입니다. 일관된 기본 규칙을 사용하면 사용 및 유지 관리가 쉽고 유연한 변형은 혁신과 성장을 촉진합니다. 디자인 시스템은 결코 가만히 있지 않습니다. 그들은 끊임없이 진화하는 유기체입니다. 그 진화에 앞서 기 위해서는 엄청난 비전이 필요합니다. 변화에 맞서 일관성의 챔피언이 되십시오.

받은 편지함에서 최고의 기사를 받으려면 구독 하십시오.

디자인 시스템 일관성에 대한 추가 정보 :

Suggested posts

창의적인 코딩 – 지금 첫 번째 스케치 만들기

Processing에서 초보자 친화적 인 크리에이티브 코딩 프로젝트 시작

창의적인 코딩 – 지금 첫 번째 스케치 만들기

창의적인 코딩은 첫눈에 반하는 사랑과 같습니다. 눈을 뗄 때, 당신도 무언가를 만들고 싶어합니다.

창의성에 대한 확신은 주어지지 않습니다. 적립됩니다

창의적인 자신감을 쌓은 경험이 있습니다.

창의성에 대한 확신은 주어지지 않습니다. 적립됩니다

인간은 살아 남기 위해 자신감이 필요합니다. 옛날에는 포식자로부터 탈출 할 용기가 필요했습니다.