요약 요약

• 많은(대부분의?) 디지털 제품 팀에는 디자인 중심 리더십 및/또는 주요 제품 재설계를 수행하는 데 필요한 리소스(또는 새로운 디자인 시스템을 포괄적으로 적용하는 데 필요한 리소스)가 없습니다.
• 그러나 이러한 조직의 일반적인 디자이너 함정은 시스템의 주요 변화를 나타내는 "이상적인" 열망 패턴을 디자인하는 것 입니다 . 기존 제품.
• 제가 선호하는 접근 방식은 "혁명"이 아니라 "진화"입니다. 기존 제품의 뿌리에서 시스템을 확장하면(혁신적인 변화를 강요하기보다) 훨씬 더 일관되고 예측 가능하며 사용자 친화적인 사용자 경험을 훨씬 빠르게 달성할 수 있습니다. .

회사는 설계 변경을 용이하게 할 수 있는 리소스가 제한되어 있습니다.

Airbnb 및 Apple 과 같은 조직은 제품에 대한 디자인 우선 접근 방식이 아름다운 경험으로 이어질 수 있으며 때로는 상업적 성공으로 이어질 수 있음을 보여주었습니다. 그리고 MailChimp 및 Google( Material Design 출시와 함께)과 같은 회사는 포괄적이고 긍정적인 디자인 변경으로 훌륭한 작업 과정을 수정했습니다.

종종 디자인 팀이 디자인 시스템에 대해 이야기할 때 그들이 염두에 두는 회사는 다음과 같습니다. "우리에게 필요한 것은 [우리 제품]을 위한 머티리얼 디자인 입니다!" 매우 흥미로운 일이지만 이미 백로그가 가득 차 있고 수요가 많은 제한된 엔지니어링 리소스가 있는 팀에게는 무리한 요구입니다. 그들은 잘 설계된 제품을 갖고 싶어 하지만 먼저 [X, Y, 및 Z 프로젝트]… 디자인 변경보다 더 명확한 "ROI" 스토리가 있을 것입니다.

익숙한 소리? 특히 내가 일하기를 선호하는 초기 단계에서 중간 단계 조직에서 그러합니다.

따라서 귀하는 제한된 엔지니어링 "예산"으로 작업하는 디자이너입니다. 제품에 대한 훌륭한 아이디어와 구현하고 싶은 새로운 패턴, 동작 및 미학이 있습니다 . 하지만 한 걸음 물러서서 오늘 전체 제품을 살펴보면 다음과 같은 느낌이 듭니다.

시간이 지남에 따라 형제 페이지, 흐름 및 기타 제품 분기와 인접해 있는 크고 핵심적인 사용자 경험이 있습니다. 이들은 다양한 디자인 방향을 가진 다양한 제품 사람들에 의해 몇 달 또는 몇 년에 걸쳐 제작되었습니다. 이러한 기능 중 일부는 아마도 MVP 솔루션으로 구축되었을 것입니다. “우리 고객은 지금 이것이 필요합니다! 우리는 나중에 '디자인'을 추가할 것입니다. 이 모든 것은 사용자와 비즈니스를 위한 최선의 의도로 구축되었지만 디자인 시스템으로서 쥐의 둥지 경험을 다루고 있을 수 있습니다.

그렇다면 제품 디자이너인 당신은 어떻게 이 물건의 모양을 만들까요?

혁명: 한 번에 디자인 열반에 도달

만세 혁명! Apple Thunderbolt 디스플레이 앞에 있는 Sketch에 앉아 있을 때 이것은 쉽게 감정적 함정에 빠지기 쉽습니다 . ". 그러나 실제로 이것을 어떻게 구현할 계획입니까? 아마도 다음과 같을 것입니다.

잘하셨습니다. 완벽한 디자인 시스템을 갖추셨습니다! 디자인 시스템을 적용하기 위한 이 접근 방식을 분석해 보겠습니다.

장점

• 귀하의 제품은 이제 우리가 꿈꾸는 디자인을 갖게 되었습니다! 그것은 마법입니다!
• 방에 있는 같은 디자이너들과 한 번에 모든 것을 디자인했기 때문에 모든 것이 매우 응집력 있고 사려 깊습니다. 기분이 너무 좋아!

• 이것은… 거의 실제로 이런 식으로 작동하지 않습니다.
• 장기간에 걸쳐 많은 자원을 투입해야 했습니다.
• 이것은 (잘 연구되었는지 여부에 관계없이) 진공 상태에서 설계되었으므로 실제 사용자가 사용하기 시작하면 필연적으로 발견하게 될 몇 가지 실제 문제를 고려하지 않습니다.
• 마지막으로( 대부분은 ) 사용자/고객은 몇 달 또는 몇 년 동안 제품의 형편없는 버전을 사용해야 했지만 이 새로운 제품을 출시할 때마다 제품 디자인이 갑자기 크게 바뀌었습니다.

"North Star" 모델: 제품 디자인의 열반 달성, 한 번에 하나의 경이로운 순간

따라서 귀하의 팀은 이상적인 제품 경험을 디자인하고 있지만 일방적인 디자인 혁명에 필요한 리소스가 없는 것으로 나타났습니다. 멋진! 그러나 이제 이러한 훌륭한 패턴, 동작 및 규칙을 설계했으므로 어쨌든 제품 페이지 및 기능에서 작업할 때 기회에 따라 적용해 보겠습니다. 여기에는 아무 것도 없습니다.

자, 여기에 약간의 움직임이 있고 이 프로세스가 끝날 무렵에는 제품에서 정말 멋진 경험을 할 수 있습니다(여전히 짐을 가지고 다니더라도).

장점

• 조각에 불과하더라도 제품에서 디자인의 꿈이 실현되는 것을 확인하세요.
• 전체 디자인 혁명보다 훨씬 현실적입니다.
• 먼 미래에(그리고 몇 년 동안 동일한 디자인 기본 설정을 유지했다면) 제품의 나머지 부분이 완성되는 것을 볼 수 있습니다. 아마도.

• 보다 극적인 변경은 변경당 더 많은 리소스를 필요로 하므로(에지 케이스, 기술적 제한 등을 열 때) 이전 패턴을 사용하거나 보다 보수적으로 변경된 패턴을 사용하는 경우보다 변경 속도가 느립니다.
• 마지막에는 멋진 디자인이 나왔지만 이 프로젝트의 전환 단계를 살펴보세요. 사용자와 고객이 이 정말 누덕누덕 한 제품을 사용하는 데 몇 달 또는 몇 년이 걸립니다. 여기서 경험과 스타일은 화면마다 극적으로 바뀔 수 있습니다. 당신의 작업이 지금부터 몇 년 후에 마침내 결실을 맺도록 정말로 설계하고 있습니까? 그렇게 생각하지 않았습니다.
• 대부분의 제품이 이 새로운 시스템으로 마이그레이션될 때까지 귀하(및 나머지 디자인 커뮤니티)는 좋은 것으로 간주되는 것, 일반적이거나 최신 유행의 UI 디자인 측면에서 전환했을 것입니다. 모든 것이 작동하지만 여전히 몇 년 된 디자인(맞습니다. "새로운 디자인")에 머물러 있습니다.

스타일과 동작 측면에서 이들은 매우 다르 므로 UX의 일부를 조금씩 마이그레이션하는 경우 제품 전체에서 제공되는 형식과 입력이 크게 달라집니다. 단편적인 방식으로 극적인 디자인 변경을 하는 데 있어 더 큰 문제를 나타내는 작은 예입니다.

하지만, 희망이 있습니다! 가지고 있는 것을 기반으로 시스템을 설계하면 어렵고 조잡한 설계 변경을 피할 수 있습니다. 현재 위치에서 제품을 "진화"해야 한다고 말할 수도 있습니다.

It's Evolution, Baby : 당신이 가진 것에 감사함으로써 더 나은 제품을 더 빨리 얻는 것

엔지니어링 예산이 제한된 디자인 팀의 경우 제품이 이미 수행하고 있는 기능을 최대한 활용하고 이를 바탕으로 디자인 시스템을 구축(또는 향상)하는 것이 좋습니다. 소규모 스타트업 팀의 첫 번째 디자이너 이더라도 누군가 (디자이너, 제품 리드 또는 개발자) 는 실제 이유로 이러한 UI 결정을 내렸습니다. 단계는 제품의 현재 상태에 따라 다르지만 프로세스는 다음과 같이 시작됩니다.

1. 현재 디자인 시스템에 대해 알아보십시오(있는 경우) . 구성 요소는 어디에서 오는가? 조직 어딘가에 핵심 스타일 시트 또는 라이브러리가 있습니까? 이들은 어떻게 구성되어 있습니까? 누가 만들었습니까? 누가 가장 많이 사용하고 어떤 부분을 사용합니까? 그것없이 언제 오프로드로 가야합니까?
2. 당신의 제품에서 보이는 패턴과 행동에 대한 목록을 만드세요 . 사용자에게 다양한 유형의 정보를 어떻게 제공합니까? 사용자는 보고 싶은 것을 어떻게 선택합니까? 그들은 어떻게 정보를 입력합니까? 인터페이스 요소: 탭, 카드, 목록 또는 양식이 보입니까? 각 요소는 어떤 상황에서 나타납니까?
3. 귀하의 제품 이 따르는 것으로 보이는 규칙을 적어 두십시오 . 그런 다음 스스로 규칙을 강화하십시오. 모든 디자인 부채 뒤에는 제품이 어떻게 구성되었는지에 대한 논리가 있습니다. 당신의 제품이 따르는 것처럼 보이는 디자인 규칙을 이해하고 그것을 두 배로 늘리십시오. " 우리는 사용자가 참여할 대상을 선택해야 하는 경우를 포함하여 많은 일에 테이블을 사용하는 것 같습니다. " 아마도 규칙이 될 것 입니다.
4. 팀의 합의를 얻습니다 . 평가와 계획을 전달합니다. 합의 구축은 말처럼 쉽지 않지만 기존 제품에서 이 시스템을 구축 하면 새로운 패턴과 규칙을 만드는 것보다 대화와 전환이 더 쉬워집니다. 확실히 이러한 많은 이해관계자들이 오늘날 제품이 어떻게 보이는지에 기여했기 때문에 이 경로는 그들의 역할과 기존 디자인에 적용된 모든 조직 지식을 더 존중합니다.
5. 이 시스템으로 구축을 시작하세요. 이제 따라야 할 규칙과 사용할 패턴을 알았으니 해당 패턴을 지정하고 규칙을 따르기 시작하세요! 다음 번에 엔지니어가 테이블, 카드, 양식 등을 입력할 때 그것이 지정된 요소 이고 올바른 방식으로 사용하고 있는지 확인하십시오. 시간이 지나면 더 많은 인터페이스가 이 새로운 디자인 시스템을 사용하게 되지만 인터페이스의 이전 부분과 비교적 잘 어울릴 것입니다.

장점

• 너무 많은 녹색 . 새로운 시스템을 기존 패턴에서 느슨하게 기반으로 함으로써 더 빨리 "양호"하게 됩니다.
• "좋은 경험"은 "오래된 경험"과 상대적으로 잘 어우러져 더욱 원활한 경험을 제공합니다. 예, 힘든 과도기의 달 및/또는 몇 년 동안에도 마찬가지입니다.
• 극적인 변화가 적다는 것은 새로운 구성 요소와 패턴을 더 빨리 적용할 수 있다는 것을 의미합니다. 그런 다음 그것들이 모두 시스템에 연결되면 시스템 수준에서 그것들을 변경하고 업데이트할 수 있습니다. 그러면 Jones의 옆집(즉, 경쟁업체)이 불가피하게 얻게 되면 나중에 따라잡을 수 있는 가능성이 높아집니다. 그들만의 새로운 UI.
• 덜 극적인 변화는 사용자의 관점 에서도 좋을 수 있습니다. 사용자는 어느 정도 변화를 싫어하기로 유명합니다(모든 Facebook 재설계 또는 좋아하는 B2B 도구의 대규모 재설계 참조). 사용자/고객.
• 이는 자원 집약적이지 않고 유기적 조직에 더 자연스럽습니다. "혁명" 및 거대한 경영진 이니셔티브와 달리 이것은 팀 호의를 더 잘 유지할 수 있습니다. 정말 어려운 일이 많다는 느낌이 아니라 좋은 디자인을 하는 것이 옳다 는 느낌을 줍니다.

• 없음!
• 농담이야. 보시다시피 이 모델에서는 디자인 열반의 "이상적인" 단계에 실제로 도달하지 못했습니다. 보다 보수적인 "진화" 모델은 우리에게 좋은 디자인을 더 빠르고 쉽게 만들어 주었지만, 아마도 우리는 그렇지 않은 경우 가질 수 있는 '빅 아이디어' 기회를 수용하지 않았을 것입니다.
• 때때로 소규모로 작업하고 "원대한 비전"을 계획하지 않으면 나중에 디자인 시스템 발전에서 일부 의존성 및/또는 기회를 놓칠 수 있습니다. 이를 완화할 수 있는 방법이 있습니다. 예를 들어 "아기 단계를 밟는 것"이 ​​아닌 일종의 비전을 갖는 것입니다. 이에 대해서는 나중에 더 자세한 게시물에서 다루겠습니다.
• 때로는 제품의 "오래된" 제품 디자인이 정말 정말 형편없어서 좋은 출발점이 아닐 수도 있습니다. (이것은 유혹적인 마음의 길이지만 그렇게 하지 말라고 권하고 싶습니다. 대부분의 경우 적당히 성공한 제품을 작업하고 있다면 선호하든 원하지 않든 이전 디자인의 무언가 가 잘 작동하고 있는 것입니다. ).

귀하의 임무는 귀하의 고객과 사용자가 귀하의 제품에 대해 갖는 경험을 개선하는 것입니다. 모든 작은 디자인에 대해 목표를 달성한 다음 이러한 변경 사항 을 현실화 하기 위해 많은 엔지니어링 리소스를 소모한다면 이러한 리소스를 제대로 "사용"하지 못하여 사용자를 위해 다른 항목을 개선하기 위해 수행할 수 있는 작업의 양이 제한될 수 있습니다. . 하나 의 사용자 흐름 을 완벽하게 만드는 것이 세 명의 사용자 흐름 을 좋게 만드는 것보다 낫 습니까? 귀하를 위한 것일 수도 있지만 귀하의 사용자를 위한 것이 아닐 수도 있습니다.

디자인 시스템을 보다 현실적으로 만들면(기존 기반에서 구축하고 전환 친화적으로 유지함으로써) 새로운 시스템을 더 빨리 채택할 수 있고 귀하(및 귀하의 사용자)가 이점을 얻을 수 있습니다.

그러니 앞으로 나아가 진화하세요!

업데이트(1년 정도 후)

저는 Hired를 위해 작업하고 있던 이 디자인 시스템에 대해 또 다른 글을 썼습니다. 1년 전에 이 "Evolution" 글에 영감을 준 동일한 프로젝트입니다.

해당 프로젝트에서 얻은 몇 가지 교훈을 바탕으로 "북극성과 같은" 접근 방식에 대한 내 입장을 약간 완화했지만 이 게시물의 핵심 테넌트는 여전히 유효합니다. 대부분의 경우 Evolution 은 여전히 ​​사용자, 제품에 대한 책임 있는 접근 방식입니다. , 그리고 당신의 조직.