main-image

[디자인사이트 12월호] 훌륭한 디자인 시스템 예시 : TOP 8

2021년 9월 23일작성
1,470 명 읽음

Airbnb 및 Uber와 같은 많은 회사들이 이미 그들만의 고유한 디자인 시스템을 전환하여 사용하고 있습니다. 

특히 글로벌 규모로 운영되고 있는 브랜드의 경우에는, 업계 내의 끊임없는 혁신으로 경쟁사와 차별화하고 사용자 환경을 개선하는 데 있어 디자인 시스템은 필수적인 요소입니다. 

반복 및 재사용 가능한 구성요소를 최대한 활용하여 워크플로우에서 디자인 시스템을 만든 브랜드들은 팀 간의 속도, 영감 및 효율성을 높일 수 있습니다. 

유의할 점은 패턴 라이브러리나 코드 및 UI 요소 모음만 있다고 해서 완성된 디자인 시스템으로 취급되지 않는다는 것입니다. 디자인 기본적인 측면에서 종합적인 디자인 시스템에는 더 많은 것들이 있으니까요. 

즉, 일반적인 디자인 시스템에 대해 자세히 알아보고, 추가 영감을 위한 성공과 가치를 창출하기 위해서 이미 디자인 시스템을 활용하고 있는 다른 기업들의 몇 가지 훌륭한 예시들을 확인해 보도록 하겠습니다. 

디자인 시스템이란 정확히 무엇인가요? 

디자인 시스템은 디자인 회사가 가질 수 있는 모든 UI 리소스 모음을 제공합니다. 여기에는 필요한 코드, 문서, 페이지 스크린숏 및 이미지 예제, 디자인 지침, 관련 도구, 문서 및 기사, 스타일 가이드, 재사용 가능한 구성 요소 및 철학, 기타 전반적인 웹 디자인 워크플로우에 유용한 모든 디지털 자산들이 포함됩니다. 

그런 다음 이러한 디자인 시스템은 온라인 웹 사이트로 호스팅 되며 브랜드에서 결정하는 대로 공개 및 내부 요소가 될 수 있습니다. 

디자인 시스템은 적용 가능한 지침들과 예제, 스타일 가이드 및 코딩 지침, 그리고 UI 키트의 일부로서 동시에, 귀중한 문서 역할을 하는 방대한 데이터 라이브러리라고 생각할 수 있습니다.

기업들은 왜 디자인 시스템을 만들고 있나요? 

개발자, 디자이너, 엔지니어, 제품 관리자 등 회사 제품 팀의 모든 구성원이 함께 모여 로고, 색상, 언어 및 코드에 이르기까지 디지털 프로덕트 자산의 기존 부분을 논의하고 매핑합니다. 그런 다음, 아 궁극적인 마스터플랜을 작성하기 위해 협업하고 사물을 정확히 어떻게 제시되어야 하는지(디자인 및 코딩) 설명합니다. 

이러한 방식을 채택하면 모든 팀들은 시각적 참조, 도구, 기사, 패턴 및 데이터 라이브러리에 대한 하나의 완전한 출처 소스(*디자인 시스템이 업계에서 단일 정보 소스라고 불리는 이유가 있음.)를 갖게 됩니다. 이를 통해 작업이 일관화되고 균일하게 유지되기 때문에 모든 단일 구성 요소를 동일한 페이지에 표시할 수 있습니다. 이는 디자인 시스템의 궁극적인 목표입니다. 

디자인 시스템의 사용 방법 및 구현 요소입니다. 

디자인 시스템을 구현하고 개발하는 경우, 개발자는 재사용 가능한 구성요소 및/또는 라이브러리에서 복사하는 데 필요한 모든 것들이 있을 때, 반복적인 코드 조각에 시간을 낭비할 필요가 없어집니다. 

마찬가지로, 디자이너는 디자인 프로세스의 속도를 높이기 위해 색상, 로고, 머리글, 바닥글 및 기타 필수 기호와 같은 표준 디자인 및 UI 요소 라이브러리가 존재하기에, 처음부터 다시 새로 랜딩 페이지를 디자인할 필요가 없습니다. 

또한 마케터들은 시스템에 필요한 모든 것이 있을 때, 뉴스레터의 어조와 템플릿을 반복적으로 작업할 필요가 없어집니다.

디자인 시스템에서 무엇을 배울 수 있을까요? 

대부분의 디자인 시스템은 일반적인 설정 패턴(Setup Patterns)을 따르고 있습니다. 
디자인 시스템은 종종 주요 카테고리와 함께 상위의 전개 기능을 제공하는 경우가 있습니다. 디자인, 코드, 언어, 구성 요소 같은 것들입니다. 

이러한 각 주요 카테고리에는 아토믹 디자인 구조(*Atomic Design Structure)를 최대한 활용하여 보다 자세히 의논할 수 있는 하위 카테고리들이 나타납니다. 예를 들어 볼까요, 타이포그래피, 색상, 양식, 배너 등이 하위 카테고리가 될 수 있겠네요. 

이 직관적인 전개 구조에 따르면 디자인 측면에서 모범 사례에 대한 귀중한 정보를 얻을 수 있을 것 같습니다.


최신 아티클
thumbnail
[디자인 TIP] 감성을 전하는 엽서 템플릿 디자인 꿀팁 6가지
작지만 마음을 담는 디자인, 엽서(Postcard) 디지털 시대에도 엽서(Postcard)는 여전히 특별한 매력을 지니고 있습니다.짧은 한 줄의 문장과 감각적인 디자인만으로도 마음을 전할 수 있기 때문입니다. 엽서 디자인은 작지만 그 안에 메시지와 감성을 동시에 담아야 해서전달력과 시각적 밸런스가 무엇보다 중요합니다. 오늘은 엽서 템플릿을 디자인할 때 꼭 알아두면 좋은 팁을 정리했습니다. 🎨엽서 디자인 꿀팁 6가지 1. 기본 구조 잡기엽서는 앞면과 뒷면의 역할이 명확한 디자인 매체입니다.앞면: 감성이나 주제를 보여주는 이미지, 문구 중심뒷면: 메시지, 글쓰는 란, 주소, 우표 자리 등 실용적인 정보 중심작은 사이즈라도 역할을 구분하면 완성도가 높아집니다. 빨간공 / 김제이 2. 포인트는 '하나만'엽서는 공간이 작기 때문에 한 가지 핵심 포인트에 집중하는 것이 좋습니다메인 요소는 **'사진', '일러스트', '문구'**들 중 하나만 선택나머지 요소들은 보조하는 느낌으로 정리욕심내서 여러 요소를 담으면 오히려 산만해질 수 있습니다. 최당당 / 김제이 3. 문구와 폰트는 짧고 강하게엽서 속 문장은 길지 않아도 괜찮습니다. 짧고 명확한 한 줄이면 충분합니다.문장은 짧고 명확하게폰트는 1~2개(제목용 + 보조용)만 사용여백과 줄 간격으로 시각적 안정감 주기감성적인 분위기를 원한다면 손글씨체나 세리프체 추천! Bakjay / 김제이 4. 배경과 이미지 밸런스 - 여백엽서 디자인의 중요 요소 중 하나는 바로 '여백의 미' 입니다.공간이 작은 엽서일수록 여백의 역할은 더욱 커집니다.배경은 단색, 질감, 또는 패턴 등 하나만 선택텍스트가 있다면 배경 대비(밝기, 색상)를 꼭 체크해서 가독성 확보텍스트는 밝은 배경엔 어두운 색상, 어두운 배경엔 밝은 색상 사용불필요한 장식을 줄이고, 핵심 요소 주위에 충분한 공간을 두면 디자인이 정돈되어 보이고, 감성적인 인상이 강해집니다. 장스 / 룰루루 / 맹 / 최당당 5. 컬러 팔레트엽서의 분위기를 결정짓는 색상은 감정을 표현하는 가장 강력한 디자인 요소입니다.톤온톤(Tone-on-tone): 비슷한 계열의 색으로 차분하고 세련된 느낌 연출톤인톤(Tone-in-tone): 명암 대비를 주어 생동감 있는 느낌 연출테마 컬러 활용 : 감성 엽서에는 파스텔톤, 시즌 엽서에는 테마 컬러를 (크리스마스: 레드·그린 / 여름: 블루·화이트 등)컬러만 잘 잡아도 전체 분위기가 확 달라집니다. 용이 / 김제이 6. 디테일로 완성도 높이기QR코드나 SNS 계정을 넣을 때는 너무 크지 않게, 전체 디자인 흐름을 해치지 않도록브랜드 엽서라면 로고 위치를 하단에 통일해서 깔끔하게여러 시리즈로 제작 시에는 레이아웃과 톤앤매너를 맞춰 통일감 유지이런 사소한 디테일이 브랜드의 아이덴티티를 강화하고, 디자인 완성도를 높여줍니다 불필요한 장식도, 긴 설명도 필요 없어요.짧은 문장 하나가 마음을 흔들고,잘 선택된 색 하나가 감정을 대변하며,비어있는 공간이 오히려 모든 것을 말해줍니다. 당신의 감성을 담은 엽서를 지금 시작해보세요. 🌷
thumbnail
[인사이트] 공모전, 챌린지 운영에 필요한 저작권 지침 알아볼까요?
1. 저작권, 왜 중요한가 저작권은 창작자가 자신의 작품에 대해 가지는 가장 기본적이고 중요한 권리입니다. 문학, 음악, 미술, 사진, 영상, 디자인 등 창작적 표현은 모두 저작물로 보호되며, 창작과 동시에 권리가 발생합니다.그러나 여전히 많은 창작자와 사용자들이 저작권을 충분히 인식하지 못해 불필요한 분쟁이나 불이익을 겪는 경우가 적지 않습니다. 특히 공공 부문과 민간에서 진행되는 다양한 창작물 공모전, 또는 디자인 챌린지는 저작권 규정을 철저히 준수해야 하는 대표적 사례라 할 수 있습니다! 하지만 저작권에 대한 내용, 혼자 알기 쉽지 않죠? 그래서 이번에 한국저작권위원회에서 진행하는 ‘2025년 하반기 공모전 지침 교육’에서는 공공기관 뿐 아니라, 다양한 형태로 진행되는 챌린지나 공모전에서 발생할 수 있는 저작권 문제에 대해 교육이 진행됩니다! 저작권의 기본 개념부터 실질적 대응 방안까지 폭넓게 다루고 있어서 참가하시면 분명 도움이 될 거에요! 👉 창작물 공모전 지침 교육 신청하기 교육 내용 01. 저작권 기초 이해a. 저작권의 개념과 역사적 배경저작권은 창작자가 자신의 저작물을 이용·통제할 수 있도록 보장하는 권리이며, 근대 이후 창작자의 권리 보호 필요성과 함께 발전해왔습니다. b. 저작물 보호의 필요성창작물은 단순한 산출물이 아니라 창작자의 시간과 노력이 집약된 결과물이므로, 무단 복제나 도용을 방지하기 위한 법적 장치가 마련되어 있습니다. c. 저작권 침해 시 책임타인의 저작물을 무단으로 사용하는 경우 민사상 손해배상뿐 아니라 형사상 처벌까지 받을 수 있습니다. 따라서 창작 활동 과정에서 저작권을 준수하는 것은 선택이 아니라 필수입니다. d. 저작권 표준계약서 활용저작권을 둘러싼 분쟁을 예방하기 위해 한국저작권위원회 등에서 제공하는 표준계약서를 활용하면 창작물의 권리 귀속, 사용 범위, 보상 구조 등을 명확히 할 수 있습니다 교육 내용 02. 창작물 공모전 지침 바로알기 창작물 공모전은 많은 사람이 참여하는 행사인 만큼, 저작권 분쟁 발생 가능성이 높습니다. 교육 과정에서는 공모전 지침 해설과 운영 사례를 통해 참가자와 주최 기관이 지켜야 할 핵심 사항들을 안내합니다. a. 공모전 지침 해설공모전 출품작에 대한 권리 귀속, 2차적 저작물 작성 가능 여부, 출품작의 활용 범위 등에 관한 규정은 반드시 확인해야 합니다. b. 운영 사례 및 질의응답실제 공모전에서 발생한 저작권 문제를 바탕으로 구체적인 대응 방안을 공유합니다. 예를 들어, 출품작에 제3자의 저작물이 포함된 경우 수상 취소 및 법적 책임이 따를 수 있음을 사례로 제시합니다. c. 참가자 유의사항참가자는 반드시 본인의 순수 창작물을 제출해야 하며, 타인의 창작물을 차용할 경우 사전에 적법한 이용 허락을 받아야 합니다. 4. 교육 참여와 수료는 어떻게 진행되나요? 이번 교육은 온라인(Zoom) 실시간 강의로 진행되며, 한국저작권위원회의 저작권법률지원센터와 전문 변호사들이 강의를 맡습니다. a. 교육 일정 : 2025.9.29(월) 14:00 - 17:00 (3시간)b. 수료 조건 : 총 강의 시간의 80% 이상 참여 및 설문조사 완료 시 이수증 발급b. 참여 방법 : 신청 시 메일 주소, 연락처 등 필수 정보를 정확히 기재해야 하며, 접속 시 본인 성명과 소속을 명확히 표시해야 출석으로 인정됩니다. 저작권은 단순한 법적 규제를 넘어, 창작자의 권리를 보호하고 건전한 창작 생태계를 조성하는 근간이 됩니다.툴디 역시 다양한 크리에이터와 함께하며 “창작자는 자신의 권리를 올바로 이해하고, 동시에 타인의 권리를 존중해야 한다”는 원칙을 크리에이터 생태계 전반에 확산시키기 위해 지속적으로 노력하고 있습니다. 따라서 저작권에 대한 올바른 이해는 창작자라면 반드시 갖추어야 할 필수 소양이라 할 수 있습니다. 이번 교육을 통해 툴디 크리에이터분들께서 저작권을 정확히 이해하고 실천함으로써, 개인의 권리 보호를 넘어 우리 사회의 창작 문화가 더욱 건강하게 발전하는 토대가 마련되기를 기대합니다. 👉 창작물 공모전 지침 교육 신청하기