텍스트 사용 가이드텍스트 기능을 잘 활용해서 디자인 퀄리티를 더 높여보세요! 1. 텍스트 추가좌측의 텍스트 메뉴 선택 후, 텍스트 추가를 선택하면 캔버스에 텍스트가 추가됩니다.[조합/워드아트/특수문자]도 추가할 수 있습니다. 2. 텍스트 수정텍스트 박스를 더블 클릭하면 자유롭게 수정하고 입력이 가능한 상태가 됩니다.그룹 상태의 텍스트의 경우에도 수정하려는 부분을 더블 클릭하면 수정 및 입력이 가능합니다. 3. 폰트 변경텍스트를 선택 후 폰트를 선택해 줍니다. 원하는 폰트가 있는 경우 검색이 가능하며, 현재 사용 중인 폰트는 최상단에 표시됩니다.폰트의 종류는 [고딕/명조/손글씨]로 나뉘며 우측에 가능한 언어 표시를 확인할 수 있습니다.다중 텍스트 박스도 한 번에 폰트 변경 가능합니다. 4. 텍스트 색상 변경텍스트를 선택 후 우측 속성창에서 [단색/그라데이션] 색상으로 변경 가능합니다.다중 텍스트 박스의 경우 단일 색상으로만 색상 변경 가능합니다.그라데이션 색상으로 지정할 경우 굵기가 굵은 폰트일수록 강조가 되어 눈에 잘 보입니다. 5. 텍스트 크기 변경크기를 변경할 텍스트를 선택하고, 우측 속성창에서 원하는 값을 입력하거나 선택하거나 마우스휠을 이용하여 크기를 변경할 수 있습니다.텍스트 박스 자체를 키우거나 줄이면서 조절도 가능합니다.다중 텍스트 박스도 한 번에 크기 조절 가능합니다. 6. 텍스트 정렬텍스트 박스를 선택 후 우측 속성창에서 [왼쪽정렬/가운데정렬/오른쪽정렬] 아이콘을 선택하면 텍스트 박스의 사이즈에 맞춰 텍스트가 정렬됩니다. 기본은 왼쪽정렬 상태입니다.다중 텍스트 박스도 한 번에 정렬 가능합니다. 7. 텍스트 자간/행간 조정텍스트의 자간과 행간은 우측 속성창에서 Range Bar로 조절합니다. Range Bar에 커서를 두고 마우스휠을 사용하거나 직접 값을 입력하여 조절 가능합니다.다중 텍스트 박스도 한 번에 자간/행간 조정 가능합니다. 8. 외곽선텍스트를 선택한 후 우측 속성창에서 외곽선을 활성화해 줍니다. 외곽선의 색상 변경 및 두께 조절이 가능합니다.다중 텍스트 박스도 한 번에 외곽선 효과를 줄 수 있습니다.외곽선은 굵기가 굵은 폰트를 사용할 때 적용하기 좋으며, 강조 효과를 줄 때 많이 사용합니다. 9. 그림자 효과텍스트를 선택한 후 우측 속성창에서 그림자 효과를 활성화해 줍니다. 색상 및 가로 거리, 세로 거리, 블러, 투명도 등을 통해 입체 효과를 줄 수 있습니다.블러를 낮게 설정하고 불투명도를 높이면 글자 2개를 겹치게 보이는 효과를 만들 수 있습니다.다중 텍스트 박스도 한 번에 그림자 효과를 줄 수 있습니다. 10. 텍스트 서식 복사서식을 복사할 텍스트를 선택한 후 단축키 [ctrl + shift + c] 를 누르고,서식을 붙여 넣을 텍스트를 선택한 후 단축키 [ctrl + shift + v] 를 하면 서식이 복사 됩니다.

컬러는 곧 디자인 트렌드! 모든 디자인 분야에서 컬러는 굉장히 중요한 부분을 차지하고 있죠!디자이너 뿐 아니라 많은 분들이 익숙하게 알고 있는 팬톤과 셔터스톡에서 ‘2022년 올해의 컬러’를 발표했습니다. 올해의 컬러는 패션, 공간, 시각 등 여러 아티스트에게 영감을 주며 새로운 디자인 트렌드를 선도하고 있습니다. 과연 2022년 디자인 업계를 관통하게 할 새로운 트렌드 컬러는 무엇일까요? PANTONE이 지정한 올해의 컬러는? 혁신적인 컬러 매칭 시스템으로 다양한 산업시장에서 그 권위를 인정받고 있는 미국의 색채 연구소인 팬톤(PANTONE). 매년 올해의 컬러를 발표하며 색상에 담은 사회적 메시지와 새로운 가치를 많은 분들께 선보여 독보적인 트렌드를 제시해왔습니다. < 2022년 올해의 컬러 베리페리 (사진 : PANTONE 페이스북) > 2021년에는 팬데믹을 이겨낼 희망이 전해지기를 바라는 의미로 ‘얼티미트 그레이(Ultimate Gray, #939597)’과 ‘일루미네이팅(Illuminating, #F5DF4D)’ 색상이 선정되었습니다. 이것은 견고한 회색과 생기 넘치는 노란색을 제시하며 우리 사회에 강인함과 생동감의 메시지를 던져주었습니다. 팬데믹이 지속되고 있는 2022년에는 ‘베리 페리(Very Peri, #6667AB)’ 색상을 선정하였는데, ‘올해의 컬러’ 역사상 완전하게 새로운 컬러를 처음으로 제시한 팬톤이 베리 페리를 선정한 이유가 무엇일까요? < 출처 : PANTONE 페이스북> 베리 페리의 색상은 신뢰를 상징하는 다이내믹한 페리윙클(#CCCCFF) 색상에 강인한 에너지를 상징하는 레드 언더톤이 가미된 생생한 보랏빛 색상으로 팬톤의 블루 계열 중 가장 행복하고 따뜻한 색을 표현하고 있어요! 팬데믹이 지속되면서 지치고 힘든 우리의 일상에 행복과 따스함을 던져주는 메시지이기도 하고, 거리두기로 인해 고립되었던 우리의 일상생활이 아주 빠른 속도로 디지털 방식으로 전환이 되고 있는데, 이로 인해 아티스트들도 시대 변화에 발맞추어 메타버스 등의 디지털 공간에서 작품 활동을 하고, 가상의 공간을 적극적으로 활용한 디자인 사업이 성장하는 등 팬데믹이 가져온 시대 변화에서도 새로운 것에 대한 끊임없는 호기심과 창조적인 도전에 걸맞는 색상이기도 합니다! 다시는 경험하고 싶지 않지만 반드시 극복해야 할 시대 정신에 꼭 맞는 컬러라고 말할 수 있겠죠! 마이크로소프트와 협업하여 창조된 색이라 더욱 특별한 의미가 있는 컬러 베리 페리. 현실과 디지털 세계를 넘나드는 이 시대에 자연스럽게 녹아 드는 다채로운 매력을 지닌 ‘베리 페리’ 색상으로 새로운 작품에 도전하는 것을 추천 드려요! :) 셔텨스톡이 제시한 세 가지 올해의 컬러는? 이어서 글로벌 스톡 이미지 판매 사이트 셔터스톡에서 선정한 ‘세 가지 올해의 컬러’를 알아볼까요? 셔터스톡은 자체 개발한 AI 기술을 통해 ‘수요가 가장 빠르게 늘어나고 있는 세 가지 컬러’를 발견했습니다. 이에 ‘다시 찾아온 컬러풀(Colorful)한 시간’ 이라 칭하며 따스하면서도 달콤한 컬러를 선보였는데, 한 때 유행했던 다소 인공적인 느낌의 색상보다 차분하고 부드러운 컬러가 요즘 세대에 주목받고 있다는 것을 알 수 있습니다. 01. 카밍 코랄(Calming Coral) ‘카밍 코랄’은 차분함이 느껴지는 잔잔한 복숭앗빛 컬러이며, 건강과 행복이라는 단어와 굉장히 잘 어울리는 색상이에요. 다른 파스텔 계열의 색감과도 부드럽게 어울리며, 따뜻한 색감으로 인해 편안함과 안정적인 감정을 느낄 수 있다는 장점을 가진 신비로운 컬러죠! 02. 벨벳 바이올렛(Velvet Violet) ‘벨벳 바이올렛’은 지나치게 화려하지 않으면서도 기품 있고 우아하게 우리의 시선을 사로잡는 매력적인 컬러입니다. 에메랄드와 같은 초록빛과 자연스럽게 어울리며 포용성과 다양성 존중을 의미하는 보라색은 디자인 업계에서 다채롭게 사용된 경우가 많죠. 네온과 같은 강렬한 색 조합으로 독특한 분위기도 만들 수 있으며, 노란색 계열 색상과의 조합으로 더욱 유니크한 느낌을 연출하게 도와주기도 합니다. 03. 퍼시픽 핑크(Pacific Pink) 빛 바랜 꽃잎처럼 화사하면서 차가움이 느껴지는 컬러입니다. 놀이공원 솜사탕같이 아련하고 부드러운 감정을 불러 일으키며, 다른 핑크 계열과 피치 컬러를 조합하여 편안하고 따뜻한 분위기 연출을 도와주기도 하며, 보색인 청록색 계열 조합으로 세련된 연출을 이루어 많은 분들의 눈길을 끌 수 있는 색이기도 하죠! 컬러 트렌드가 반영된 툴디 콘텐츠를 만나보아요! 지금까지 팬톤과 셔터스톡이 선정한 올해의 컬러에 관해 이야기를 해보았습니다. 그렇지만 예쁜 색상을 아는 것으로만 디자인의 모든 고민이 해결되는 것은 아니죠! 올해의 컬러를 어떻게 사용해야 하는지, 또 어떤 색상과 조합하여 멋진 디자인을 만들어 낼 것인지는 우리들에겐 또 하나의 고민거리입니다. 하지만 너무 많은 걱정은 노노해요! 디자인이 고민될 때 그것을 해결해 주는 툴디가 있잖아요! 툴디에서 만나보는 올해의 컬러를 활용한 템플릿 디자인 둘러보기, 지금 시작합니다! 첫번째, Veri Peri 색상을 이용한 프레젠테이션 템플릿 [디자인 바로시작] 두번째, Calming Coral 색상을 이용한 프레젠테이션 템플릿 [디자인 바로시작] 세번째, Velvet Violet 색상을 이용한 프레젠테이션 템플릿 [디자인 바로시작] 네번째, Pacific Pink 색상을 이용한 프레젠테이션 템플릿 [디자인 바로시작]

페이지 활용하기 페이지는 [ 카드뉴스, PPT ] 등 많은 페이지의 디자인을 해야 할 때 활용도가 높아집니다.모든 페이지를 한 눈에 보면서 페이지 선택, 추가, 이동, 복제, 삭제, 초기화 및 순서 변경을 자유롭게 할 수 있습니다. 1. 현재 페이지/전체 페이지 확인 및 페이지 이동우측 상단에 [페이지] 탭을 클릭하면 모든 페이지를 한 눈에 볼 수 있고,현재 선택된 페이지와 전체 페이지 수, 페이지 상하 이동이 가능하도록 화살표 버튼을 제공합니다. 해당 내용은 캔버스 하단 버튼에서도 동일하게 적용됩니다! 2. 페이지 추가하기하단에 [+페이지 추가] 버튼을 클릭하면 가장 하위에 새로운 페이지가 삽입됩니다. 3. 페이지 복제하기슬라이드에 마우스를 올리면 복사 아이콘이 보입니다.복사 아이콘을 클릭하면 현재 페이지를 그대로 아래쪽에 하나 더 복제해 줍니다. 4. 페이지 삭제하기슬라이드에 마우스를 올리면 휴지통 아이콘이 보입니다.휴지통 아이콘을 클릭하면 현재 페이지를 삭제합니다. 또한 단축키 [delete]를 눌러도 동일하게 삭제됩니다. 5. 페이지 순서 변경페이지를 클릭/드래그하여 자유롭게 이동하여 순서를 변경할 수 있습니다.이동한 기록들은 실행취소(ctrl+z) 와 재실행 (ctrl+y) 할 수 있습니다. 5. 페이지 초기화페이지 초기화를 클릭하면 선택한 페이지의 내용이 초기화 됩니다.

간단한 선 그리기 및 모양 바꾸기 선은 실선, 점선, 화살표 등의 형태를 통해 템플릿 제작에 다양하게 사용합니다.툴디에서는 점선, 화살표 선 등을 따로 선택하지 않아도 [선그리기]에서 다양한 형태의 선을 간단하게 그릴 수 있습니다. 1. 선 그리기[요소] - [선] - [선 그리기] 를 선택하면, 캔버스에 기본 형태의 직선이 나타납니다.이때 우측에 선의 색상/두께/모양을 변경할 수 있는 속성창이 보여집니다. 2. 선 방향 및 길이 조정하기선의 양쪽 포인트 중 하나를 끌어 선의 방향을 변경하거나 길이를 길거나 짧게 합니다.수평 또는 수직 방향으로만 길이를 늘리고 싶다면 shift 를 누르고 길이를 조절하면 그리신 선 위치 그대로 늘어나고 줄어듭니다.shift + 직선 방향 포인트 이동 (가로/세로 직선)shift + 대각선 방향 포인트 이동 (15도씩 이동 대각선) 3. 선의 색상 및 두께 변경하기선의 색상은 단색/그라데이션으로 원하는 색상으로 변경하여 자유롭게 디자인 할 수 있습니다.선의 두께는 1 ~ 100까지 설정 가능합니다. 4. 선의 모양 바꾸기선의 모양은 현재는 8개의 종류가 있고 앞머리, 뒷머리 부분은 5개의 종류가 있어 원하시는 형태로 선택하시면 됩니다.모양은 계속해서 추가될 예정입니다. 다양한 선의 모양으로 템플릿을 디자인 해보세요!

눈금자 사용하기 눈금자를 사용하면 캔버스에서 요소를 정확하게 배치할 수 있습니다. 눈금자는 캔버스의 위쪽, 왼쪽에 나타납니다. 눈금자를 표시하거나 숨기려면 [설정] - [눈금자 표시] 또는 단축키 [R]을 눌러줍니다. 가이드라인 사용 가이드라인을 이용하면 텍스트와 요소를 정렬하는 데 도움이 됩니다.기본적으로 가이드라인은 잠겨 있지 않으므로 이동, 수정, 삭제 또는 복귀할 수 있지만, 특정 위치에 잠글 수도 있습니다. 1. 가이드라인 표시/숨김/잠금/추가가이드라인을 표시하려면 [설정] - [가이드라인] - [가이드라인 표시] 또는 또는 단축키 [G],숨기려면 [설정] - [가이드라인] - [가이드라인 숨김] 또는 단축키 [G]를 선택합니다. 가이드라인을 잠금하거나 해제하려면 [설정] - [가이드라인] - [가이드라인 잠금] 또는 단축키 [Alt] [ ; ] 또는 눈금자 좌측 모서리의 [자물쇠 아이콘]을 선택합니다. 2. 가이드라인 추가/초기화가로 가이드라인을 추가하시려면 [설정] - [가이드라인] - [세로 가이드라인 추가] 또는 단축키 [Alt] [>]을 눌러주시면 기본 가로 가이드라인 아래쪽으로 추가 생성됩니다.세로 가이드라인을 추가하시려면 [설정] - [가이드라인] - [가로 가이드라인 추가] 또는 단축키 [Alt] [<]을 눌러주시면 기본 세로 가이드라인 우측으로 추가 생성됩니다.가이드라인을 초기화 하시려면 [설정] - [가이드라인] - [가이드라인 초기화] 를 선택합니다. 3. 가이드라인 이동, 삭제가이드라인을 이동하려면 해당 가이드라인에서 마우스로 드래그 해줍니다. 이때 마우스 포인터가 방향 화살표로 바뀌게 되고 그대로 좌우 or 상하로 끌어서 이동 시킵니다.이때 가이드라인의 위치를 정확하게 알 수 있는 위치 정보가 표시됩니다. 가이드라인을 삭제하시려면 해당 가이드라인을 드래그 한 뒤 캔버스 밖으로 이동 시키면 바로 삭제가 됩니다.

내가 원하는 도형으로 프레임을 만들 수 있다면?!툴디에는 내가 원하는 도형을 아주 간단하게 프레임으로 만들어 사용할 수 있는 기능이 있습니다! 원하는 도형으로 프레임 만들기! 1. 프레임으로 만들고 싶은 도형 선택우선 도형 탭에서 [도형 그리기/모든 도형]에서 원하는 도형을 선택해 줍니다. 2. 프레임으로 만들기 버튼 클릭 도형을 선택하면 우측 속성창에 [프레임으로 만들기] 버튼이 생성됩니다.해당 버튼을 클릭하면 간단하게 프레임으로 변경됩니다! 3. 사진을 선택해 프레임에 적용프레임으로 변경된 요소에 원하는 사진을 선택해서 넣어주세요! 4. 프레임 자르기 사진의 위치를 변경하고 싶다면 해당 요소를 [더블클릭] 하거나 우측 하단에 [프레임 자르기] 버튼을 클릭해주세요!원하는 위치로 사진을 변경하고 프레임 자르기를 클릭하면 끝! 클릭 한번으로 프레임 만들기 참 쉽죠?!

V1.1에 업데이트된 신규 기능 두번째!자유도형 사각형에 라운딩 기능이 추가되었습니다!*해당 기능은 [도형그리기-사각형] 에서만 가능합니다. 사각 도형 모서리를 둥글게 작업하는 방법!기존에는 라운드가 들어간 형태의 도형을 모두 등록해서 사용해야 했다면이번 업데이트에 라운드 기능이 들어감으로써 더 다양한 형태의 도형을 사용할 수 있게 됐습니다. 1. 도형그리기 - 사각 도형 그리기 선택편집기의 요소에서 [도형 - 도형그리기 - 사각형] 을 선택해주세요!그 상태에서 캔버스에서 드래그하여 사각형을 그려줍니다.이때 모서리마다 라운드를 줄 수 있는 빨간 아이콘이 생길 거에요! 2. 라운딩 적용하기모서리에 나타난 빨간 아이콘에 커서를 가져가면 커서 우측에 라운드 아이콘이 표시됩니다. 그때 클릭 드래그하게 되면 라운드가 적용되어 모서리가 둥글게 변한 모습을 확인할 수 있습니다.드래그를 할 수록 라운드가 커지고 다시 회귀할수록 라운드가 작아집니다. 라운드 기능을 사용해서 원하는 형태의 도형을 만들어보세요!

이번 V1.1에 업데이트된 신규 기능!그라데이션 기능이 추가되었습니다!*해당 기능은 텍스트/선/도형/단색배경 에서만 가능합니다. 사용 가능한 그라데이션 종류선형 : 직선의 한 점에서 다른 점으로 색상을 혼합방사형 : 원형 패턴의 한 점에서 다른 점으로 색상을 혼합 간단하게 그라데이션 색상 넣는 방법! 1. 그라데이션 색상 선택하기편집기에서 색상변경을 원하는 텍스트/선/도형/단색배경을 선택해줍니다.선택 후 우측 속성창을 보시면 색상선택을 할 수 있는 단색/그라데이션 탭이 노출됩니다!그라데이션 선택시 회색, 검은색이 기본으로 설정되어 있고, 해당 컬러포인트 더블클릭시 색상변경을 할 수 있는 컬러선택창이 나옵니다.컬러선택창으로 원하시는 색상을 선택하실 수 있어요!선형일 경우 원하시는 각도를 마우스 or 직접 입력으로 변경할 수 있습니다! 2. 그라데이션 색상 추가그라데이션 주석자의 원하시는 곳을 클릭하면 색상이 추가됩니다.색상은 랜덤으로 생성이 되며, 해당 컬러포인트 더블클릭 후 컬러를 변경하실 수 있습니다.컬러포인트를 좌우로 이동시켜 원하시는 그라데이션을 설정해보세요! 3. 그라데이션 색상 삭제삭제하고 싶은 컬러포인트를 선택합니다. 선택이 되었으면 파란색으로 활성화됩니다.이때 우측의 휴지통 아이콘(삭제버튼)을 클릭하시면 삭제가 됩니다. 새로 추가된 그라데이션 기능을 통해 한층 더 업그레이드된 템플릿을 제작해보세요!

툴디 사용법, 첫번째!단축키 정보 입니다!단축키를 이용해 작업을 더욱 편리하게 하실 수 있어요! 단축키 정보는 편집기 좌측 하단의 [다양한 기능] - [단축키 정보]에서 바로 확인하실 수 있어요! 파일 단축키저장 : Ctrl + S실행취소 : Ctrl + Z, Ctrl + Shift + Z재실행 : Ctrl + Y 편집 단축키선택 해제 : Esc요소 삭제 : Delete, Backspace다중 선택 : Ctrl + click전체 선택 : Ctrl + A복사 : Ctrl + C붙여넣기 : Ctrl + V잘라내기 : Ctrl + X서식 복사 : Ctrl + Shift + C서식 붙여넣기 : Ctrl + Shift + V45도 회전 : Shift + 회전크기 비율 해제 : Shift + 크기조절수직/수평 이동 : Shift + 이동그룹화 : Ctrl + G그룹화 해제 : Ctrl + Shift + G요소 이동 : ⇐ , ⇑ , ⇓ , ⇒요소 크게 이동 : Shift + ⇐ , ⇑ , ⇓ , ⇒요소 잠금 : Ctrl + L요소 잠금 해제 : Ctrl + Shift + L텍스트 추가 : T프레임 만들기 : Ctrl + F 정렬 단축키왼쪽 정렬 : Ctrl + ⇐오른쪽 정렬 : Ctrl + ⇒위로 정렬 : Ctrl + ⇑아래로 정렬 : Ctrl + ⇓한단계 아래로 : Ctrl + [한단계 위로 : Ctrl + ]맨 아래로 : Ctrl + Shift + [맨 위로 : Ctrl + Shift + ]좌우 중앙정렬 : Ctrl + Shift + ⇑상하 중앙정렬 : Ctrl + Shift + ⇓ 페이지 단축키페이지 추가 : Ctrl + M다음 페이지 이동 : PgDw이전 페이지 이동 : PgUp첫 페이지로 이동 : Home마지막 페이지로 이동 : End 캔버스 영역 단축키확대/축소 : Ctrl + 마우스휠확대/축소(미세조정) : Ctrl + — , +화면맞춤 : Ctrl + 1아트보드 잡기 : Space Bar + drag눈금자 보기 : R가이드라인 보기 : G가이드라인 잠금 : Alt + ;가이드라인 추가(세로) : Alt + <가이드라인 추가(가로) : Alt + >

Airbnb 및 Uber와 같은 많은 회사들이 이미 그들만의 고유한 디자인 시스템을 전환하여 사용하고 있습니다. 특히 글로벌 규모로 운영되고 있는 브랜드의 경우에는, 업계 내의 끊임없는 혁신으로 경쟁사와 차별화하고 사용자 환경을 개선하는 데 있어 디자인 시스템은 필수적인 요소입니다. 반복 및 재사용 가능한 구성요소를 최대한 활용하여 워크플로우에서 디자인 시스템을 만든 브랜드들은 팀 간의 속도, 영감 및 효율성을 높일 수 있습니다. 유의할 점은 패턴 라이브러리나 코드 및 UI 요소 모음만 있다고 해서 완성된 디자인 시스템으로 취급되지 않는다는 것입니다. 디자인 기본적인 측면에서 종합적인 디자인 시스템에는 더 많은 것들이 있으니까요. 즉, 일반적인 디자인 시스템에 대해 자세히 알아보고, 추가 영감을 위한 성공과 가치를 창출하기 위해서 이미 디자인 시스템을 활용하고 있는 다른 기업들의 몇 가지 훌륭한 예시들을 확인해 보도록 하겠습니다. 디자인 시스템이란 정확히 무엇인가요? 디자인 시스템은 디자인 회사가 가질 수 있는 모든 UI 리소스 모음을 제공합니다. 여기에는 필요한 코드, 문서, 페이지 스크린숏 및 이미지 예제, 디자인 지침, 관련 도구, 문서 및 기사, 스타일 가이드, 재사용 가능한 구성 요소 및 철학, 기타 전반적인 웹 디자인 워크플로우에 유용한 모든 디지털 자산들이 포함됩니다. 그런 다음 이러한 디자인 시스템은 온라인 웹 사이트로 호스팅 되며 브랜드에서 결정하는 대로 공개 및 내부 요소가 될 수 있습니다. 디자인 시스템은 적용 가능한 지침들과 예제, 스타일 가이드 및 코딩 지침, 그리고 UI 키트의 일부로서 동시에, 귀중한 문서 역할을 하는 방대한 데이터 라이브러리라고 생각할 수 있습니다.기업들은 왜 디자인 시스템을 만들고 있나요? 개발자, 디자이너, 엔지니어, 제품 관리자 등 회사 제품 팀의 모든 구성원이 함께 모여 로고, 색상, 언어 및 코드에 이르기까지 디지털 프로덕트 자산의 기존 부분을 논의하고 매핑합니다. 그런 다음, 아 궁극적인 마스터플랜을 작성하기 위해 협업하고 사물을 정확히 어떻게 제시되어야 하는지(디자인 및 코딩) 설명합니다. 이러한 방식을 채택하면 모든 팀들은 시각적 참조, 도구, 기사, 패턴 및 데이터 라이브러리에 대한 하나의 완전한 출처 소스(*디자인 시스템이 업계에서 단일 정보 소스라고 불리는 이유가 있음.)를 갖게 됩니다. 이를 통해 작업이 일관화되고 균일하게 유지되기 때문에 모든 단일 구성 요소를 동일한 페이지에 표시할 수 있습니다. 이는 디자인 시스템의 궁극적인 목표입니다. 디자인 시스템의 사용 방법 및 구현 요소입니다. 디자인 시스템을 구현하고 개발하는 경우, 개발자는 재사용 가능한 구성요소 및/또는 라이브러리에서 복사하는 데 필요한 모든 것들이 있을 때, 반복적인 코드 조각에 시간을 낭비할 필요가 없어집니다. 마찬가지로, 디자이너는 디자인 프로세스의 속도를 높이기 위해 색상, 로고, 머리글, 바닥글 및 기타 필수 기호와 같은 표준 디자인 및 UI 요소 라이브러리가 존재하기에, 처음부터 다시 새로 랜딩 페이지를 디자인할 필요가 없습니다. 또한 마케터들은 시스템에 필요한 모든 것이 있을 때, 뉴스레터의 어조와 템플릿을 반복적으로 작업할 필요가 없어집니다.디자인 시스템에서 무엇을 배울 수 있을까요? 대부분의 디자인 시스템은 일반적인 설정 패턴(Setup Patterns)을 따르고 있습니다. 디자인 시스템은 종종 주요 카테고리와 함께 상위의 전개 기능을 제공하는 경우가 있습니다. 디자인, 코드, 언어, 구성 요소 같은 것들입니다. 이러한 각 주요 카테고리에는 아토믹 디자인 구조(*Atomic Design Structure)를 최대한 활용하여 보다 자세히 의논할 수 있는 하위 카테고리들이 나타납니다. 예를 들어 볼까요, 타이포그래피, 색상, 양식, 배너 등이 하위 카테고리가 될 수 있겠네요. 이 직관적인 전개 구조에 따르면 디자인 측면에서 모범 사례에 대한 귀중한 정보를 얻을 수 있을 것 같습니다.

디자이너는 단순한 데코레이터가 아니라 중요한 디자인 기술인 언어와 마이크로카피에 대한 이해력을 가져야 합니다. 지금 그 어느 때보다도 중요한 디자인 기술입니다.다음 2가지의 이미지를 보세요.이 두 가지 온 보딩 비주얼의 명백한 차이점은 옵션 A에는 단어가 없고 절대적으로 쓸모가 없다는 것입니다. 방향도, 지침도, 행동 촉구도 없습니다. 이 점은 너무나 명백해서 (화면에서 소리 지르고 있음) 부정 할 수 없습니다. 오랜 세월 동안, 저는 디자이너들이 단어와 언어에 사각지대를 가지고 있다는 것을 알아 챘습니다. 그리고 마지막 순간까지 높은 높이에서 아름답게 렌더링 된 디자인으로 텍스트를 돌리기 위해 남겨두었습니다. 디자이너들의 악의가 아니라 직업에 대한 요구와 기대를 통해서 입니다. 저는 이 일을 직접 저지른 적이 있습니다. 우리는 모두 죄인이며, 저는 공개적으로 제 자신을 채찍질합니다.사용자 경험을 만들거나 깨기마이크로카피는 버튼 텍스트, 섹션 캡션, 페이지 제목, 양식 레이블 및 오류 메시지와 같은 웹 사이트 및 앱에서 찾을 수 있는 작은 텍스트입니다. 작은 단어는 시각적으로나 심리적으로 큰 영향을 미칩니다. 하지만 우리의 시각적 마음 속에 있는 단어와 이미지의 분리는 디자이너들이 쉽게 빠져들 수 있는 함정입니다. 저는 마이크로카피와 텍스트 콘텐츠를 사용자 경험을 만들거나 깨는 또 다른 디자인 요소로 생각하고 싶습니다. 좋은 마이크로카피는 사용자가 디지털 경험을 통해 자신의 길을 탐색할 수 있도록 도와주며, 압축 된 방식으로 의미를 최대화하며, 공간적 여유가 더해져 모든 단어가 고려되어야 합니다. 단순한 데코레이터가 아니라 문해력 갖춘 디자이너가 되세요글을 읽고 쓰는 디자이너가 된다는 것은 마이크로카피를 디자인 과정에서 필수적인 교려사항으로 생각하고, 개념을 바꾸고 솔루션에 영향을 줄 수 있는 요소로 생각하면서 텍스트에 주의를 기울이는 것을 의미합니다. 미학과 말은 서로 통합니다. 디자이너라면 누구나 길러야 할 기본 기술이기도 합니다. 우리는 왜 하지 않습니까? 글쎄, 사용자에게 도움이 되는 좋은 마이크로카피를 작성하는 것은 힘든 일일 수 있습니다. 예산이 허락한다면 우리 팀에 UX 작가를 데려 올 수 있습니다. 이상적이지만 실제로는 많은 회사에서 이를 감당할 수 없는 사치로 보고있습니다.전담 UX 작가가 없는 상황에서 우리는 더 둥근 디자이너가 되어 더 나은 마이크로카피를 제작해야 합니다. 그래픽 디자이너 인 Lucine Robert는 얼마 전에 '디자이너는 단순히 데코레이터이자 미학자들 (문자 형태를 마크 팔레트로 사용하는 패턴 제작자들) 뿐만 아니라 정보 수집하고 책임지는 사람들이다' 라고 썼습니다. 마이크로 카피의 예저는 여러분이 가끔 보는 이 고전적이고 매우 놀랄 정도로 끔찍한 오류 메시지들를 거의 좋아합니다. 하지만 나쁜 것에 집중하지 맙시다. 올바르게 작성되면 즉시 잘 쓰여지고 명확하고 간결한 마이크로카피로 옮겨집니다.

애플 VS 삼성, 나이키 VS 아디다스, 코카콜라 VS 펩시. 이 논쟁은 지금까지 이어져왔고 앞으로도 계속될 것이다. 일부만이 아니라, 대부분의 대중이 각자 자신이 좋아하는 쪽을 옹호해왔다. 이러한 현상은 어느 한 쪽을 더 지지하여 강화하는 결과를 낳았다. 하지만 생각해보자, 도대체 뭘 위한 논쟁과 지지일까?스티브는 이렇게 말할 것이다- ‘설탕물!’ 맞는 말 아닌가요? 재료는 모두 같다. 우리 모두가 알듯이, 레시피는 같다. 그런데 무엇이 사람들로 하여금 한 제품에 열광하고 그에 따르도록 두 제품을 차이나게 만드는 것일까?코카콜라와 펩시는 비슷한 로고로 시작했다. 하지만, 코카콜라는 전략적으로 감정에 호소하는 브랜드로 만들어왔다. 반면 펩시는 넘치는 에너지, 음악, 그 당시의 유머와 관련이 있다. 삼성은 휴대폰을 마치 PC처럼 사용할 수 있도록 다양한 기능을 넣었지만, 애플은 스스로를 ‘혁신적인' 모바일 브랜드로 어필하였다.기술이 아닌 브랜드는 글로벌 비즈니스의 체계적인 원칙이다. 브랜드는 점점 서로에게 소원해지는 21세기 사회에 사는 사람들에게 소속감과 감정적인 보상을 제공하기 위해 매우 중요한 요소가 되었다. 또한, 세계화는 사람들이 이 세계와 협상하고 그들 자신에 대해 자부심을 느끼기 위해 브랜드를 필요로함을 뜻한다.-Wally Olins 로고 vs 브랜드 문제에 있어서, 로고와 브랜드 사이의 논리적인 비교점을 만들고, 각각의 확실한 역할을 정의하기를 원한다. 또한, 당신 역시 새로운 비즈니스를 만들거나 스스로가 성장하고, 여러가지 가능성에 대해 고려하고 사업의 이득을 위한 새로운 배움을 얻어갔으면 한다. 1.주로 어떤 것들이 차이점으로 여겨지는가? 브랜드는 사람이고, 로고는 그 사람이 입은 옷과 같다!-Vaibhav Gera 이 답변들은 내가 트위터에 로고와 브랜드의 차이점을 퀴즈 형식으로 올렸을 때 받은 내용이다. 로고는 회사가 되고자 하는 방향을 그래픽적으로 나타낸 것이다. 브랜드는 소비자가 느끼는 경험들의 공통적인 인식이다.-Kapil이는 창업자나 주주, 법률 관계자 혹은 학생에게만 해당하는 문제가 아니다. 이는 디자이너를 포함하여 차이의 명확함에 대해 고민하는 모든 사람에 대한 문제이다.무의식적으로라도, 대부분이 동의하는 차이점은 가격이다! 로고는 5달러 정도면 만들 수 있다.(Fiverr-국내 ‘크몽'같은 프리랜서 연결 사이트-에서 찾아보자.) 하지만, 브랜드는 로고 가격에 0을 몇 개는 더 붙여서 약 5,00,000달러 혹은 그 이상 정도의 비용이 든다. 다른 차이점은 시간-중요한 자원 이라는 것이다. 로고 ‘디자이너'는 턱없이 부족한 24시간 내에 선택을 해야 한다고 불평한다. 브랜드는 그것을 영원히, 적어도 1년은 가져가야 하는 것처럼 보인다. 즉, 1년에 휴일 한 번 없이 8시간씩 매일 일한다고 치면 2,920 시간을 의미한다.또한, 로고 제작은 요즘에는 쉽게 자동화된다. 당장 구글링만 해봐도 가상의 로고를 쉽게 만들 수 있는 툴이 무수히 쏟아져 나온다. 브랜드는 조금 이상하게도, 사람이 직접 일해야 한다. 적어도 지금은. 하지만 그게 전부일까?브랜드는 경험 전 혹은 일련의 경험 후에 오랫동안 남는 감정적인 뒷맛과 같다. 2.인간은 본질적으로 감정적이다. 인간이 삶에서 내리는 대부분의 결정은 감정적이다. 논리적인 경우는 거의 없다.그들은 본인의 열망을 인정해주는 누군가로부터 영감받고 그들의 꿈을 위협하는 누군가를 혐오한다.로고와 브랜드는 다르지 않다. 아니, 그래서는 안 된다. 사람들은 그것들에 대부분 긍정적으로 반응한다. 사람들은 그들이 좋아하는 브랜드와 로고에 관심 갖고, 감사하고, 꿈 꾸고, 여러 사례를 들며, 거만하게 대하고 영감을 얻고 찾아헤매야 한다. 3. 브랜드로서의 인간 명확한 사안을 들고 천 만 달러 가치에 준하는 미팅에 참석하러 가고 있다. CEO Mayank는 당신과 회사에 대한 과제를 끝마쳤다. 다양한 예상 질문과 기대에 대한 준비를 했다. 당신의 확실한 토론을 위해 충분히 무장했다. 20분 후, 거래를 잘 마치고 좋은 얘기도 나눴다.늦은 저녁, 당신은 이 기쁨을 친구와 나누고 싶다. 그리고 CEO와 자신이 얼마나 감명 깊었는지도. 이 이야기를 어떻게 시작해야 할지 잘 모르겠다.당신은 Mayank를 구글링하여 그의 사진을 보여준다.덧붙여, 그의 인성을 설명한다. 발음의 수준과 단어 선택의 신중함 등등. 또한 그의 키, 짙은 초록색의 눈, 깨끗하게 깎인 수염과 진한 밤색 재킷에 대해 이야기한다.사진은 로고다. - 시각적으로 인지하는 데에 특별하게 받아들여지는 것.설명은 브랜드이다. - 정신적으로 인지하는 데에 특별하게 받아들여지는 것. 4.브랜드의 요소브랜드라는 우산 밑에 쌓을 수 있는 요소는 정말 많다. - 이름, 로고, 모양, 컬러, 시각 자료, 소리, 가치, 문화, 인식, 메시지, 의견, 마케팅, 소셜 미디어 참여율… 하단 영상의 소리를 들어보자.https://youtu.be/kCBUQRTWS8I 아마 전 세계적으로 가장 익숙한 벨소리일 것이다. 누군가에게는 화면을 보지 않고 소리만 들어도 해당 브랜드를 무의식적으로 떠올리게 하는 장치가 될 것이다.이것이 내가 멀리서도 스타벅스를 알아보고 커피를 마시고 싶게 되는 시각적 장치이다.스타벅스는 세계에서 가장 좋은 커피를 제공하지 않는다. 실은 최고의 커피가 있어도 나는 알 도리가 없다! 내 머릿속에서는, 스타벅스는 편안한 공간이다. 그 공간은 내게 어느 정도 괜찮은 커피를 제공해주고, 노트북을 충전할 수 있도록 콘센트를 제공하며, 무료 인터넷도 제공한다. 또 다른 약속이 하나 더 있다. - 커피가 내 취향에 맞지 않더라도, 바리스타가 초조해하거나 발작을 일으키지도 않는다. 내가 그들에게 요청하면, 그저 예의 바르게 새로 한 잔을 더 만들어줄 뿐이다.‘내 머릿속에서는' 뒤에 나온 내가 말한 모든 것들은 다양한 역할과 위계 질서 속에서, 하나의 경험이 브랜드 경험으로 반향을 일으키기 시작하기 전에 전 대륙에 걸친 팀 구성원들에 의해 깊이 생각되고, 분석되고, 실행되어질 것이다.캠페인, 바리스타, 심지어 sms 메시지가 중단되는 순간, 그들 회사가 깊이 생각한 브랜딩 노력과 그들이 소비한 수백만 달러가 더럽혀지고, 경험은 사라지기 시작한다. 다시 말해, 브랜드는 말로 할 수 없는 것들의 리스트이며, 비즈니스하는 사람들이 세상에 있는 사람들에게 하는 무언의 약속이다.