문장 부호 디자이너 안내서
문장 부호는 단순한 마침표와 느낌표 이상입니다. 디자인 측면에서 문장 부호는 독자 나 사용자가 중지하거나 일시 중지시키는 원인이 될 수 있습니다. 텍스트를 읽거나 눈이 한 요소에서 다른 요소로 이동할 때 발생할 수 있습니다. 이러한 시각적 구두점은 어디에나 있으며 디자인 개념의 중요한 부분입니다.
구두점의 주요 요소에는 공백, 선, 규칙, 아이콘 및 색상뿐만 아니라 읽을 수있는 일반적인 문장 부호가 포함됩니다.
Envato Elements 살펴보기
문장 부호 란 무엇입니까?
문장 부호는 두 가지 주요 형태로 나타납니다. 즉, 읽기 과정에서 멈추게하는 요소 또는 한 객체에서 다른 객체를 볼 때 일시 정지를 만드는 요소입니다. 두 가지 유형의 구두점은 똑같이 중요하며 상황에 맞는 구두점은 상당히 알려져 있고 일반적이지만 모든 사람이 다른 시각적 신호에 대해 종종 생각하는 것은 아닙니다.
시각적 문장 부호는 디자인을보고있는 사람들을 계속 참여시키고 디자인을 읽거나 볼 때 피로를 예방할 수 있기 때문에 중요합니다. 자연 일시 중지는 인간 본성의 일부이며이를 일시 정지하여 원하는 시간과 장소에서 발생하는 정지를 만듭니다. 컨텍스트 및 시각적 흐름을 추가하는 데 도움이됩니다.
또한 사용자 / 리더가 더 쉽게 디자인 할 수 있습니다. "작업"이 완료되면 디자인을보다 쉽게 볼 수 있으며 노력이나 생각이 덜 듭니다. (그리고 우리는 오늘날 바쁜 세상에서 우리의 디자인을 보는 사람들이 더 쉽게 일할 수 있다는 것을 알고 있습니다.)
간단히 말해서 시각적 구두점은 디자이너가 디자인 내의 요소, 사진 또는 단어를 분리, 그룹화 또는 강조하기 위해 사용하는 모든 것입니다. 의도적이든 아니든, 시각적 구두점은 누군가 캔버스의 특정 부분을 멈추고 보도록합니다.
읽을 수있는 (텍스트) 문장 부호
가장 일반적으로 알려진 구두점 유형은… 음… 실제 구두점입니다. 읽는 동안 멈추게하는 텍스트에 나타나는 모든 표시는 문장 부호로 간주됩니다.
일반적인 기호는 마침표, 물음표, 느낌표, 별표, 엠 대시, 세미콜론, 괄호, 괄호, 줄임표, 따옴표, 콜론, 하이픈, 아포스트로피 및 쉼표를 포함합니다. 마크는 문장을 쓰거나 형성하는 맥락에서 사용될 수 있지만 종종 시각적 목적으로도 사용됩니다.
때때로 이러한 문자는 의미 또는 강조를 전달하기 위해 로고의 일부로 사용되거나 디자인 분야에서 사용됩니다. 공통의 특성과 이해하기 쉬운 의미로 인해 이러한 기호는 다양한 방식으로 사용하기 쉽습니다.
우주
문장 부호의 형태로 공간을 사용하는 것도 텍스트와 쓰기에서 비롯됩니다. 공백은 텍스트 블록에서 새 단락을 시작하거나 책에서 새 장을 시작하지 않는 데 사용됩니다. 공간은 마침표와 같이 뚜렷한 방식으로 또는 엠 대시와 같이 더 유동적 인 방식으로 작동 할 수 있습니다.
우주는 또한 시각적 시작과 정지를 만들고 눈이 움직이는 방향을 만드는 데 사용됩니다. 요소들 사이에 사용 된 공간의 양은 다른 컨텐츠와의 관계에서 그것들이 얼마나 가깝거나 멀리 떨어져 있는지를 나타낼 수 있습니다. 공간은 또한 여러 요소에 독립적으로 집중할 수있는 공간을 만들 수 있습니다.
United Strands에서 위의 이미지를보십시오. 셔츠 더미와 간단한 텍스트 사이에는 많은 공간이 있습니다. 이 공간은 사용자가 각 항목을보고 자체적으로 소화 한 다음 단위로 소화 할 시간을줍니다. 스페이스는 속도를 늦추기위한 알림으로 사용하고 화면의 요소를 연결하는 방법으로 사용됩니다.
Space는 위의 Nice and Serious 페이지에서 다른 결과를 가져옵니다. 빨간색 원 안에 4 개의 유사하지만 다른 항목 사이의 간격이 일정하기 때문에 자연스럽게 요소를 단일 이미지로 그룹화합니다. 각 요소 사이의 간격은 한 항목에서 다음 항목에 이르기까지 다소 단단하고 일관성이있어 단일 요소처럼 "느껴집니다".
라인과 규칙
선은 규칙으로 객체를 명확하게 구분합니다. (또한 권투 요소를 사용하여 동일한 효과를 얻을 수 있습니다.) 선은 한 것이 끝나고 다른 것이 시작되는 위치를 나타냅니다. 단락의 각 문장 끝의 기간과 매우 비슷합니다.
선은 종종 공간과 함께 사용되지만 항상 그런 것은 아닙니다. 서로 가깝거나 간격이없는 선은 밀착감을 느끼거나 때로는 해당 분리를 가로 질러 항목을 연결할 수 있습니다.
위의 예에서 선은 두 가지 방식으로 사용됩니다. 정사각형 페이지에서 여러 줄이 가상 또는 "고스트"버튼을 형성하는 데 사용됩니다. 선은 페이지의 클릭 가능한 부분을 나머지 부분과 구분하여 설정합니다. Agra Culture Kitchen & Press 페이지에서 라인은 두 가지 방식으로 사용됩니다. 요소에서 요소로 눈을 계속 움직이고 홈페이지의 로고, 본문 및 조치 요청 버튼과 같은 중요한 내용에주의를 집중시키기 위해 .
아이콘 및 디자인 요소
아이콘 및 기타 요소 (및 디지털 프로젝트를위한 사용자 인터페이스 도구)를 사용하는 것은 기능의 결과이지만 디자인 방향도 제공합니다. 이 도구는 사용자에게 디자인에서 어디로 가야하는지, 컨텐츠와 상호 작용하는 방법을 알려주고 특정 항목과 상호 작용할 때 사용자가 수행 할 전체 작업을 구성하는 데 도움을줍니다.
예를 들어, 인쇄 프로젝트에서 Facebook 및 Twitter 로고는 종종 회사가 좋아하거나 따라갈 수있는 페이지가 있음을 사용자에게 알리는 데 사용됩니다. 더 길거나 더 어려운 URL보다는 아이콘이 표준이되고 있습니다. 이러한 동일한 아이콘은 디지털 프로젝트에서 종종 이러한 사이트에 대한 클릭 가능한 링크로 사용되거나 사용자가 이러한 소셜 미디어 사이트 내에서 옵션을 공유하도록합니다.
아이콘과 디자인 요소도 다른 용도로 사용할 수 있습니다. 스토리 텔링 과정에서 시각적 차이로 작용하며 텍스트를 통해 또는 캔버스에서 한 항목에서 다음 항목으로 독자를 유혹하는 데 사용될 수 있습니다. 예를 들어 문어는 큰 상자를 색상 상자의 링크로 사용하고 아래 글 머리 기호의 시각적 탐색 요소로 사용합니다. Openbox는 유사한 방식으로 아이콘을 사용하며 다양한 삼각형 디자인으로 사용자가 사이트의 컨텐츠를 쉽게 이동할 수 있도록 도와줍니다. (방향에 따라 + 또는 x도 동일한 기능을 수행합니다.) 여기에서 메모의 또 다른 요소는 기본 텍스트 아래의 점으로, 규칙 및 탐색 도구 역할을합니다.
색깔
디자인에서 요소를 분리하려고 할 때 색상이 재미를 더할 수 있습니다. 그리고 그것을 달성하는 많은 방법이 있습니다. 색상 대비 흑백에서 주제별 색상 구성 또는 색상 패널에 이르기까지 선명한 대비에 이르기까지 다양한 색상을 사용하는 것이 흥미로운 방식으로 디자인의 특정 부분에 주목하는 쉬운 방법입니다.
위의 예는 색상을 사용하여 일시 정지를 만드는 두 가지 다른 방법을 보여줍니다. P'unk Ave 페이지에서 밝은 빨간색 아이콘이 단색 배경 공간에서 수영 중입니다. 즉각적인 시각적 영향과 연결을 제공합니다. (느낌표를 생각해보십시오.)
남호주 페이지는 색이 다른 방식으로 사용됩니다. 각기 다른 컨텐츠 섹션 (및 시차 프레임 워크의 조정 화면)은 서로 다른 컬러 화면을 사용합니다. 이를 통해 읽고있는 섹션과 다른 내용을 알 수 있습니다. 이 시각적 인 "세미콜론"은 한 생각을 마치고 다음 생각으로 넘어갈 시간을줍니다.
결론
문장 부호는 어디에나 있습니다. 텍스트에서 같은 이름의 작은 문자만큼 처음에는 분명하지 않지만 중요합니다. 시각적 인 구두점은 흐름, 방향을 만들고 독자 (및 사용자)의 피로를 예방합니다.
조화와 시각적 조화를 만드는 데 도움이됩니다. 더 큰 문제는 사용 여부가 아니라 디자인 프로세스에서 생각하는 것입니다. 시각적 인 구두점은 방금 발생 했습니까, 아니면 계획을 세우십니까? 의견에 귀하의 디자인 프로세스에 대해 더 알고 싶습니다.
