일러스트레이션
개요
일러스트레이션은 시각적 스토리텔링을 통해 복잡한 아이디어를 단순화하고 사용자의 이해를 높여 의미를 한눈에 전달합니다. 일러스트레이션은 기술 개념과 사용자 이해 사이의 간극을 메워 추상적 아이디어를 더 실감나게 하고 매력적으로 만들 수 있습니다.
Cloudflare의 제품 및 서비스에서 일러스트레이션은 주의를 끌고 호기심을 유발하며 사용자를 효과적으로 안내합니다. 일러스트레이션은 무형의 개념을 관련 있는 시각 자료로 변환하여 명확성과 접근성을 개선합니다.
이 가이드라인은 디자이너가 Cloudflare에서 제공하는 제품 및 솔루션을 표현하고 Cloudflare의 브랜드 가치와 사명에 부합하는 명확하고 매력적인 일러스트레이션을 만드는 데 도움이 됩니다. 디자이너는 이 가이드라인을 따름으로써 사용자의 이해를 넓히고 브랜드를 정확하게 표현하는 작업을 할 수 있습니다.
스타일
단순, 명료, 최소화
일러스트레이션에 의미를 추가하지 않는 세부 사항은 줄여서 의미 있는 세부 사항이 더 강조되도록 합니다.
일관성
모든 일러스트레이션과 도해에서 개념을 일관성 있게 표현하려고 노력해야 합니다.
확장 가능한 세부 사항
더 적은 세부 사항으로 일러스트레이션을 제공하므로 더 작은 파일 크기로도 가독성이 유지될 수 있습니다.
중간
대규모
X-Large
색상
브랜드에 맞게 일러스트레이션의 기본 색상은 오렌지색 색조를 사용합니다. 이러한 추가 색상을 사용하여 풍부하고 역동적인 이미지를 만들 수 있습니다.
라이트 오렌지
Hex #FFE9CB
RGB 255, 233, 203
CMYK 0, 9, 20, 0
마젠타
Hex #911475
RGB 145, 20, 117
CMYK 0, 86, 19, 43
라이트 옐로우
Hex #FFD43C
RGB 255, 212, 60
CMYK 0, 17, 76, 0
라이트 퍼플
Hex #F2D6F4
RGB 242, 214, 244
CMYK 1, 12, 0, 4
엑스트라 라이트 블루
Hex #E0ECFF
RGB 224, 236, 255
CMYK 12, 7, 0, 0
퍼플
Hex #941FBA
RGB 148, 31, 186
CMYK 20, 83, 0, 27
라이트 블루
Hex #A8CBFF
RGB 168, 203, 255
CMYK 34, 20, 0, 0
다크 퍼플
Hex #4D1470
RGB 77, 20, 112
CMYK 31, 82, 0, 56
석세스(라이트)
Hex #BCECCB
RGB 188, 236, 203
CMYK 20, 0, 14, 7
데인저(라이트)
Hex #FCA39C
RGB 252, 163, 156
CMYK 0, 35, 38, 1
석세스
Hex #57CF7D
RGB 87, 207, 125
CMYK 58, 0, 40, 19
데인저
Hex #FC3D2E
RGB 252, 61, 46
CMYK 0, 75, 82, 1
석세스(다크)
Hex #12523D
RGB 18, 82, 61
CMYK 78, 0 26, 68
데인저(다크)
Hex #B0291C
RGB 176, 41, 28
CMYK 0, 77, 84, 31
라이트 그레이
Hex #747474
RGB 116, 116, 116
CMYK 0, 0, 0, 55
다크 그레이
Hex #DFDFDF
RGB 223, 223, 223
CMYK 0, 0, 0, 13
명확성
단순하고 깔끔하게 유지 메시지를 전달하는 필수 요소에 집중하여 시각적 개체를 단순하고 깔끔하게 유지합니다.
여백을 사용 여백을 사용하여 시각적으로 쉬어 갈 수 있는 공간을 제공하고 일러스트레이션에서 가장 중요한 구성 요소를 강조합니다.
시각적 요소를 너무 복잡하게 만들지 않음 사용자를 혼란스럽게 하거나 주의를 분산시킬 수 있는 불필요한 요소로 시각적 요소를 너무 복잡하게 만들지 않습니다.
선명도를 떨어뜨리지 않음 예술적 감각으로 일러스트레이션의 메시지를 흐리게 해서는 안 됩니다.
일관성
일관된 시각적 스타일 유지 모든 일러스트레이션에 일관된 시각적 스타일을 적용하여 일관된 브랜드 아이덴티티를 구축합니다.
브랜드 색상 고수 Cloudflare의 브랜드 색상, 타이포그래피, 아이콘 모음을 사용하여 통일된 외관을 유지합니다.
알아볼 수 있고 뚜렷하게 유지 다양한 제품에 사용되는 경우에도 일러스트레이션을 Cloudflare의 컨셉으로 인식할 수 있도록 합니다.
시각적 스타일에서 벗어나지 않음 기존의 시각적 언어에서 벗어나지 않습니다. 혼란이 생기고 브랜드 인지도가 저하될 수 있기 때문입니다.
관련 없는 스타일과 색상을 사용하지 않음 관련 없는 스타일이나 색 구성표를 도입하지 않습니다. 우리 일러스트레이션은 모두 같은 무리에 속하는 것처럼 보여야 합니다.
접근성
확대 고려 시각 장애가 있는 사용자가 제대로 보려면 이미지를 확대해야 할 수도 있습니다.
대비를 고려함 특히 다양한 용도로 사용되는 경우 패턴, 레이블을 사용하여 요소를 구분해서 명확한 선, 모양, 색상을 보장합니다.
대체 설명을 제공 br> 장식이 아닌 일러스트레이션에 대해서는 화면을 읽는 독자가 이해할 수 있도록 대체 텍스트 설명을 제공합니다.
투명성 및 솔직함
제품 + 기능을 솔직하게 표현함 Cloudflare 제품의 특징과 기능을 과장하거나 오해의 소지가 있는 시각적 요소 없이 명확하게 표현합니다.
실제 이점을 보여줌 일러스트레이션을 사용하여 사용자에게 제품의 실제 이점과 결과를 보여줍니다.
창의성
호기심 + 상상력을 발휘함 디자인 과정에서 창의성과 상상력을 발휘하여 일러스트레이션을 매력적이고 기억에 남도록 만듭니다.
은유 + 직유를 사용함 사용자가 공감할 수 있는 은유와 직유를 사용하여 복잡한 컨셉을 공감할 수 있는 방식으로 전달합니다.
너무 글자 그대로 표현하지 않음 추상적인 개념을 너무 글자 그대로 표현하여 시각적인 매력을 제한하지 않습니다. Cloudflare 제품은 대부분 어떤 식으로든 서버와 관련이 있지만, 모든 일러스트레이션이 서버와 관련된 경우 고객이 Cloudflare 제품을 구분하는 것이 불가능해집니다. 대신 각 제품의 고유한 특성에 집중합니다.
진부하고 지루한 이미지를 사용하지 않음 독창성이 부족하고 진부하거나 과도하게 사용된 이미지를 사용하지 않습니다. Cloudflare를 독특하게 만드는 요소는 아주 많습니다. 차별화에 집중합니다.
표현
다양하고 포용적인 일러스트레이션을 사용함 일러스트레이션에 다양한 커뮤니티와 포용적인 환경이 반영되어 있는지 확인합니다.
다양한 배경, 문화 등을 선보임 다양한 배경, 문화, 인구 통계 출신의 사람들을 표현하여 보편성을 조성합니다.
동질적인 환경을 만들지 않음 사용자나 환경을 동질적인 방식으로 나타내지 않습니다. 가능한 한 다양한 사용자를 대표하려고 노력합니다.
고정 관념, 편견, 오해를 배제함 문화적 편견이나 오해를 영속화하는 고정 관념이나 캐리커처를 사용하지 않습니다.
리소스가 필요하신가요?
로고, 사진, 배경, 배너, 동영상, 일러스트레이션 등의 크리에이티브 자산을 다운로드하세요.