디자인 시스템: 브랜드에 디자인 시스템이 필요한 이유

50만 개 이상의 브랜드가 있으며 일부만 눈에 띕니다. Disney, Nike 또는 Microsoft와 같이 시간의 시험을 견디고 마음 한구석을 사로잡은 사람들을 생각해 보십시오. 그들은 성공적으로 경쟁자들과 차별화할 수 있었습니다.

종종 이러한 브랜드를 기억하게 만드는 것은 강력한 브랜딩입니다. 오늘날 제품이나 서비스의 기능은 대부분 당연시되고 우리의 초점은 기능에서 형태로 이동합니다. 제품이나 서비스의 디자인은 우리의 관심을 끌고 우리와 오랫동안 함께할 수 있는 힘이 있습니다. 색상, 글꼴, 아이콘, 이미지, 목소리 톤 등 모든 경험이 우리를 기억하게 만듭니다.

고객과의 모든 접점은 고객에게 귀하가 누구이며 무엇을 지지하는지 알릴 수 있는 기회입니다. 그러나 여러 팀, 부서 및 제품과 함께 작업할 때 일관되고 확장 가능한 방식으로 이 작업을 수행하려면 어떻게 해야 합니까?

디자인 시스템 소개

디자인 시스템은 그 어느 때보다 더 많은 제품, 서비스 및 접점을 포함하는 점점 더 복잡해지는 디지털 생태계를 처리하는 데 도움을 주기 위해 등장했습니다. 이는 일관된 고객 경험(CX)을 제공하고, 디자인 노력을 확장하고, 워크플로 속도를 높이고, 협업을 개선하려는 대규모 브랜드를 위한 논리적인 움직임입니다.

디자인 시스템은 기능적이고 재사용 가능한 디자인 요소와 구성 요소의 응집력 있는 집합으로 구성된 중앙 라이브러리로 요약됩니다. 패턴, 브러시, 구성 요소, 모양, 일러스트레이션 및 타이포그래피에서 크기 조정, 간격, 코딩된 버튼 및 양식에 대한 지침에 이르기까지. 지침, 가치 및 사용 예도 디자인 시스템의 중요한 부분입니다.

또한 DPDK는 라이브러리 및 지침을 기반으로 하는 프로덕션 파일에 대한 개요를 추가합니다. 간단히 말해서 디자인 시스템에는 디자이너와 개발자가 필요로 하는 모든 도구가 있습니다.

성공적인 디자인 시스템은 확실히 고정되어 있지 않으며 지속적으로 성장해야 합니다. Forrester에 따르면 성숙한 디자인 시스템을 갖춘 브랜드는 보다 일관된 CX를 제공하고 고객 만족도가 높으며 제품을 더 빨리 출시할 수 있습니다. 이상적인 설계 시스템이 달성하는 세 가지 주요 결과는 다음과 같습니다.

1. 일관성

구성 요소를 구축하고 (재)사용하기 위한 공유 규칙 및 지침을 도입하면 플랫폼 간에 일관된 경험을 더 쉽게 만들 수 있습니다.

2. 효율성

이를 통해 개발자와 디자이너는 유사한 구성 요소를 처음부터 반복해서 구축하는 대신 요소와 구성 요소를 재사용할 수 있습니다. 팀은 자신이 가장 잘하는 일에 더 많은 시간을 할애하여 최상의 CX를 만듭니다.

3. 확장성

효율성과 일관성을 높이면 제품을 더 빠르고 더 잘 구축할 수 있습니다. 확장이 더 쉽고 저렴해집니다.

디자인 시스템이 제대로 수행되면 브랜드와 비즈니스 측면 모두에서 성능에 큰 영향을 미칩니다. 여기서 말하는 것 뿐만 아니라 걸어가는 것까지 보여주기 위해 DPDK의 자체 일러스트레이션 디자인 시스템(IDS)을 자세히 살펴보겠습니다.

이야기를 걷다

DPDK에서 우리는 디자인 시스템에 대한 강력한 지지자이며 15년 이상 동안 디자인 시스템의 중요성과 필요성에 대해 브랜드에 조언을 해왔습니다. 얼마 전에 DPDK 디자인 시스템을 구축했지만 IDS는 마케팅 팀이 시작되고 블로그가 형성되기 시작했을 때 만들어졌습니다. IDS는 기본적으로 해당 시스템 내에 있는 시스템입니다. 저는 작년 11월 Adobe MAX에서 규모에 맞는 디자인에 대해 이야기한 적이 있으며, 여기에서 우리의 디자인 시스템에 대해 자세히 논의했습니다. 여기에서 강연과 주요 내용을 확인할 수 있습니다.

어쨌든 일러스트레이션은 커뮤니케이션을 활성화하고 브랜드를 차별화하는 좋은 방법입니다. 스톡 사진과 달리 독특하고 창의적입니다. 그러나 일러스트레이션 스타일의 문제는 창작자에게 의존하는 경우가 많다는 것입니다.

우리는 또한 IDS가 한 명의 설계자에게 의존하지 않고 시간의 시험을 견디기를 원했습니다. 그렇기 때문에 여러 디자이너가 작업할 수 있는 구조화된 일러스트레이션 스타일이 핵심입니다. IDS는 스타일을 일관되게 유지하고 관리 가능한 방식으로 확장하는 데 도움이 됩니다.

일러스트레이션 디자인 시스템 구축

디자인 시스템을 만들 때 항상 비전을 가지고 시작합니다. 자신이 누구이며 무엇을 지지하는지와 같은 몇 가지 중요한 질문에 답해야 합니다. 그런 다음 이러한 질문에 대한 답변을 시각적 아이덴티티로 변환합니다.

우리의 목표는 단순하고 다채로우며 많은 디지털 산업 주제를 다룰 수 있는 독특한 일러스트레이션 스타일을 만드는 것이었습니다. 확장성도 중요한 측면이었습니다. 삽화는 여러 가지 방법으로 분해하고 다시 만들 수 있어야 했습니다.

우리는 기본적인 그래픽 요소, 단순한 캐릭터, 그리고 많은 테스트와 학습으로 시작했습니다. 거기에서 우리는 IDS의 기본적인 첫 번째 버전을 개발했습니다. 처음 몇 개의 PDF는 지침, 문자, 개체, 모양, 브러시 및 혼합 패턴으로 구성되었습니다.

결국 DPDK의 모든 디자이너가 액세스하고 사용할 수 있는 라이브 Adobe XD 라이브러리로 발전했습니다. 이 라이브러리의 요소는 디자이너가 새로운 일러스트레이션을 쉽게 만들 수 있는 레고 ​​블록과 같습니다. 라이브러리에 구성 요소가 제공되지 않으면 디자이너가 새 항목을 만들고 추가할 수 있습니다. IDS는 디자이너에게 일러스트레이션 스타일을 보호하면서 '박스 내부'를 디자인하고 실험할 수 있는 창의적인 자유를 제공합니다.

반면 마케팅 팀은 일러스트레이션을 사용하여 브랜드에 생명을 불어넣습니다. 이것은 블로그에 콘텐츠를 게시하는 것 이상입니다. 온라인과 오프라인, 외부 및 내부 커뮤니케이션을 위해 모든 접점에서 작동하는 IDS를 볼 수 있습니다.

우리가 준비하는 백서, 회의를 위해 만든 프레젠테이션 자료 또는 발송되는 다이렉트 메일에 대해 생각해 보십시오. IDS는 고용주 브랜딩 및 내부 행사에도 사용됩니다. 독특한 스타일과 광범위한 적용은 우리가 경쟁사와 차별화하는 데 도움이 됩니다.

포함 색상

디자인 시스템은 지속적으로 발전해야 합니다. 정기적인 피드백은 진행을 보장하는 중요한 측면입니다. 이것이 디자이너가 새로운 아이디어를 제시하고 이전 디자인 측면에서 개선할 수 있는 사항에 대해 논의할 수 있는 월간 검토 세션을 개최하는 이유입니다.

우리가 2020년에 외적 평등, 다양성, 포괄성을 약속했을 때 우리는 일러스트레이션이 다양한 그룹의 사람들을 반영해야 한다는 것을 빨리 깨달았습니다. 우리는 DPDK의 국제적인 무리이며 IDS에 반영되지 않았고 우리가 살고 있는 세계를 대표하지도 않았습니다.

첫 번째 삽화는 흰색 배경에 그려졌으며 대부분 흰색 피부 톤으로 끝나는 캐릭터로 번역되었습니다. 보다 포괄적인 디자인을 구현하기 위해 빨강, 노랑 및 녹색과 같은 다양한 색상을 실험하기 시작했습니다. 그러나 우리는 그것이 갈 길이 아니라는 것을 깨달았습니다.

실제 사진을 사용하고 우리 팀에서 영감을 받아 결국 사실적인 색상을 사용하기로 결정하고 자연스러운 톤을 사용하기로 결정했습니다. 일련의 지침에 따라 캐릭터의 크기, 비율 및 피부색을 결정했습니다. 이를 통해 캐릭터는 다양한 피부색, 패셔너블한 의상, 헤어스타일을 가진 다양한 인물로 진화했습니다. 저희 일러스트를 통해 DPDK가 어떤 소속사인지, 세상을 어떻게 바라보는지 알 수 있습니다.

결과

IDS로 작업하면 그림당 평균 2시간이 절약됩니다(복잡도에 따라 다름). 여기에 4를 곱하면 이미 디자이너가 하루 종일 작업할 수 있는 여유 공간을 확보한 것입니다. 엄청나네요. 이렇게 하면 우리 디자이너들은 수작업과 반복적인 작업에 시간을 할애하지 않고 창의적이고 디자인과 공예에 집중할 수 있는 더 많은 시간을 갖게 됩니다.

10명 이상의 다른 디자이너가 이미 IDS로 작업하고 더 발전시켰기 때문에 불일치나 여유 리소스에 대해 걱정할 필요가 없습니다. 그리고 우리의 마케팅 팀은 콘텐츠를 게시하고 즉시 캠페인을 시작할 수 있습니다. 요약하자면, 우리의 IDS 노력은 DPDK의 브랜딩을 다음 단계로 끌어 올렸고 우리 팀이 출력을 빠르게 확장하고 브랜드에 대한 경험을 만드는 데 도움이 되었습니다.

미래 지향적인 설계 시스템으로 팀의 역량을 강화할 준비가 되셨습니까?

여기에서 전체 기사 읽기