드로잉 기술 없이 맞춤형 일러스트레이션을 디자인하는 단계별 가이드

오늘날 많은 기업에서 스톡 일러스트레이션이나 이미지를 사용하는 것을 봅니다. 이러한 옵션은 저렴하지만 시각적인 요소가 제품에만 국한되지 않기 때문에 브랜드 메시지가 희석됩니다.

소셜 미디어 및 B2B 마케터의 74%가 판촉에 시각적 효과를 사용하는 세상에서 시각적으로 자신을 차별화하는 방법은 매우 중요합니다.

당신의 브랜드가 다작이라면 사람들은 당신의 브랜드와 관련된 시각적 언어를 배울 것입니다. 다른 제품과 관련된 동일한 스톡 일러스트레이션을 보는 즉시 브랜드 아이덴티티가 약해집니다.

맞춤형 일러스트레이션을 통해 브랜드 아이덴티티의 요소는 공유된 관점과 개성을 중심으로 통합될 수 있습니다. 직관적인 수준에서 고객과 소통하고 브랜드가 지속적으로 스토리를 전달할 수 있도록 돕습니다.

하지만 많은 디자이너들이 그림 실력이 부족하다는 두려움 때문에 일러스트레이터 일을 기피합니다. 모든 디자이너가 그림 없이도 아름다운 일러스트레이션을 개발할 수 있는 방법을 알려 드리겠습니다.

세 가지 인기 있는 일러스트레이션 스타일을 살펴보고 매우 간단한 단계를 적용하여 처음부터 자신만의 아트웍을 개발할 것입니다. 따라하고 배운 내용을 적용하여 다음 프로젝트에 사용할 멋진 작품을 만들 수 있습니다.

유명한 우주 삽화를 재현하십시오.

디자이너이자 일러스트레이터인 Nina Georgieva는 이 악명 높은 Dribbble 작품의 선구자이며 이제 이 스타일은 하나의 트렌드가 되었습니다.

Georgieva에서 영감을 얻어 몇 가지 간단한 단계에 따라 우리만의 공간 일러스트레이션을 만들 것입니다.

이것이 결국 당신이 얻게 될 것입니다.

1. 별부터 시작하세요.

Illustrator의 "별 도구"를 사용하여 4점 별을 만듭니다. 그런 다음 75% 투명하게 만듭니다.

선택한 상태에서 Ctrl+C를 누른 다음 Ctrl+F를 눌러 제자리에 복제합니다.

앞의 모양을 축소합니다.

다음으로 빛나는 효과를 추가하십시오. 더 큰 모양을 선택하십시오. "모양" 패널에서 "가우시안 흐림 효과"를 적용합니다.

마지막으로 "심볼" 패널에 별 모양을 저장하여 나중에 컴포지션에서 사용할 수 있습니다.

2. 구름의 모양을 만듭니다.

다양한 너비의 직사각형을 쌓습니다.

"Pathfinder" 패널과 함께 병합합니다.

전체 모양에 높은 "모서리 반경" 값을 부여하여 마무리합니다.

3. 구름에서 행성 텍스처 만들기

구름 모양을 시작으로 위와 같이 행성 텍스처 효과를 생성합니다.

많은 구름 모양을 함께 쌓고 물결 모양 패턴을 만들기 위해 연속적인 바깥쪽 및 안쪽 곡선이 있는지 확인합니다.

4. 텍스처를 조정합니다.

행성 모양에 적용하기 전에 물결 모양을 단순화하십시오.

텍스처의 한 면에서 여분의 점을 제거하고 평평하게 만듭니다.

5. 질감이 있는 행성을 만듭니다.

물결 모양 패턴을 원으로 겹치고 "패스파인더" 패널에서 "나누기" 옵션을 사용하여 분할을 만듭니다.

원 외부에 생성된 여분의 모양을 삭제하고 행성의 각 측면에 다른 회색 값을 적용하여 조명 효과를 만듭니다.

6. 행성에 대기를 추가합니다.

두 개의 더 큰 원을 만들고 Ctrl+X를 누른 다음 Ctrl+B를 사용하여 행성 뒤에 붙여넣습니다.

올바르게 정렬하십시오.

새 원에 투명도를 추가하고 세 번째 원에 흐림 효과를 추가합니다("모양" 패널 내).

그룹화(Ctrl+G)하고 결과를 "심볼" 패널에 저장합니다.

7. 행성을 복제하고 색칠하세요.

"심볼" 패널에서 여러 행성 모양을 복사하고 각 면에 대해 두 가지 색상을 사용하여 다시 칠합니다.

"직접 선택 도구(A)"를 사용하여 선택하고 "스포이드 도구(I)"를 사용하여 색상을 선택하고 적용합니다.

8. 행성 크기 조정 및 위치 지정

"선택 도구(V)"를 사용하여 행성을 다른 위치로 이동하고 선택 시 나타나는 흰색 모서리를 드래그하여 다양한 크기를 지정합니다(비례 스케일링을 위해 "Shift" 키 유지).

9. 링을 추가합니다.

고리를 만들기 위해 행성 주위에 몇 개의 선 원을 그립니다.

링 앞에 작은 행성을 붙여넣으려면 선택한 다음 Ctrl+X(잘라내기) 및 Ctrl+F(앞에 붙여넣기)를 누릅니다.

10. 하늘에 구름과 별을 추가합니다.

"심볼" 패널로 돌아가서 구름과 별 모양을 끌어다 놓습니다.

공간 전체에서 원하는 대로 복제, 크기 조정 및 배치할 수 있습니다.

최종 결과는 다음과 같습니다.

크기, 위치 및 색상을 다양하게 조정하여 자신만의 것으로 만들 수 있습니다.

약간의 타이포그래피를 추가하면 짜잔, 새로운 맞춤형 바탕 화면 배경이 생깁니다.

Toptal 블로그 일러스트레이션 스타일 재현

Toptal 블로그는 전 세계 최고의 인재들이 만든 귀중한 통찰력과 영감의 원천입니다. 지금 읽고 있는 것과 마찬가지로 대부분의 기사에는 내용을 뒷받침하는 삽화가 있습니다. 우리는 물체를 묘사하기 위해 단순한 기하학적 모양과 밝은 색상을 사용합니다.

이 스타일을 적용하여 자신만의 음식 삽화를 만드는 방법을 살펴보겠습니다.

이것이 결국 당신이 얻게 될 것입니다.

1. 간단한 튀김을 그립니다.

튀김을 만들려면 긴 직사각형으로 시작하여 "펜 도구(P)"를 사용하여 가장자리를 가로질러 여러 점을 추가합니다.

"직접 선택 도구(A)"를 사용하여 점을 이동하여 모양을 조정합니다.

2. 마요네즈 용기를 만듭니다.

크기가 감소하는 세 개의 원을 뒤에서 앞으로 만듭니다.

바깥쪽 원은 컨테이너이고 중간 원(흰색)은 마요네즈, 안쪽의 작은 원(컬러 획 포함)은 조명 효과를 위한 것입니다.

내부 원을 반으로 자르고 "Stroke" 패널의 "Cap"과 "Corner"가 둥근지 확인합니다.

3. 케첩과 머스타드를 만든다.

마요네즈 컵을 복제하여 머스타드와 케첩을 만듭니다.

위에서 제안한 대로 소스와 조명에 다른 색상을 적용하기만 하면 됩니다.

4. 물결 모양의 양상추를 넣는다.

"펜 도구(P)"를 사용하여 직선을 추적하고 여러 점을 추가합니다.

"정렬" 패널에서 수평 간격을 분배합니다.

변경점을 아래로 드래그하고 완전히 부드러워질 때까지 모든 모서리를 최대한 둥글게 만듭니다.

5. 빵 조각을 만듭니다.

긴 타원형을 만듭니다. 물결 모양과 겹치고 "패스 파인더"패널에서 "나누기"옵션을 사용하여 분할을 만듭니다.

"나누기" 도구에서 얻은 여분의 모양을 제거한 다음 빵 조각을 다시 칠하십시오.

6. 버거 빵을 만듭니다.

빵 조각을 수직으로 미러링하고 상단 레이어에 티핑 포인트를 추가합니다.

부드러운 버거 롤빵을 만들기 위해 가장자리를 둥글게 만듭니다.

7. 버거를 마칩니다.

상추를 초록색으로 칠해주세요.

그런 다음 갈색, 노란색 및 빨간색을 각각 사용하여 고기, 치즈 및 토마토에 대해 서로 다른 "둥근 직사각형"을 만듭니다.

버거를 적절하게 레이어링하기 위해 물건을 이리저리 옮기십시오.

8. 버거로 핫도그를 만듭니다.

햄버거 그림으로 시작하여 토마토와 치즈를 제거하고 양상추를 마요네즈와 겨자로 다시 칠하고 아래쪽 빵을 복제하여 더 대칭적인 핫도그를 만듭니다.

9. 피자 모양을 디자인합니다.

버거의 맨 위 레이어부터 시작하여 아래쪽 포인트를 아래로 이동하고 더 가깝게 가져옵니다.

삼각형 모양을 복제하고 크기를 줄이고 치즈 베이스를 위해 노란색으로 만듭니다.

10. 토마토 모양을 추가합니다.

큰 빨간색 원과 작은 내부 원을 겹치고 "Pathfinder" 패널에서 "Minus Front" 옵션을 사용합니다.

피자 모양에 크기와 위치가 다른 여러 개의 토마토 조각을 놓습니다.

11. 고기 조각을 만드십시오.

"펜 도구(P)"를 사용하여 유기적인 갈색 모양을 그리고 복제한 다음 피자 위에 크기를 조정합니다.

12. 추가 토핑을 추가합니다.

피자 토핑을 완성하려면 빈 공간에 더 작고 색상이 지정된 둥근 획을 추가하십시오.

13. 빨대를 만듭니다.

긴 흰색 직사각형이 있는 별입니다.

"펜 도구(P)"로 두 점을 추가하고 상단 가장자리를 움직여 빨대를 구부립니다.

오른쪽 가장자리의 중간점을 복사하여 붙여넣은 다음 빨간색 획을 적용하고 칠은 하지 않습니다.

흰색 사각형의 중앙에 있는 빨간색 선을 이동합니다.

14. 소다 캔 모양을 만듭니다.

8면 다각형을 그립니다. 깡통을 추가하십시오; 위쪽 네 점을 위로 이동합니다. 캔처럼 보이도록 위쪽 및 아래쪽 가장자리를 바깥쪽으로 조정합니다(S).

상단과 하단에 둥근 직사각형을 추가하여 테두리를 만듭니다.

15. 캔 모양을 조정하고 빨대 크기를 조정합니다.

점을 움직여 모양을 조정한 다음 캔과 빨대를 적절한 비율로 조정하세요.

16. 캔에 웨이브 디자인으로 마무리합니다.

캔에 디자인을 위해 유기적이고 물결 모양을 그립니다.

그런 다음 "패스파인더" 패널로 분할을 만들고 여분의 외부 모양을 삭제합니다.

최종 결과는 다음과 같습니다.

모뉴먼트 밸리 게임에서 영감을 받은 일러스트레이션 재현

모뉴먼트 밸리는 UsTwo 스튜디오에서 만든 베스트 셀러 게임입니다. 2014년 Apple의 최고의 iPad 게임을 포함하여 수십 개의 상을 수상했으며 삽화 스타일은 Escher의 아름다운 기하학적 삽화에서 영감을 받았습니다.

이제 이 게임을 큰 성공으로 이끈 동일한 비주얼 스타일을 쉽게 만드는 방법을 배우게 됩니다.

이것이 결국 당신이 얻게 될 것입니다.

전체 그림의 빌딩 블록으로 평면과 큐브만 사용합니다.

색상 팔레트에는 물, 잔디, 나무 및 건물에 대한 4가지 색상이 있습니다. 각각은 3가지 음영으로 자연광을 시뮬레이션합니다.

1. 등각투영 평면을 생성합니다.

정사각형으로 시작한 다음 다음 세 단계에 따라 등각투영 모양을 만듭니다. 다른 등각투영 모양이 필요할 때마다 이 프로세스를 반복하므로 주의하십시오.

우리는 그것을 "등각 효과:"라고 부를 것입니다.

효과 > 3D > 돌출 및 경사로 이동합니다. 나타나는 옵션 패널 내에서 "위치" 드롭다운 내에서 "등각 투영 상단"을 선택합니다. "Extrude & Bevel" 첫 번째 옵션에서 "Extrude Depth"를 0으로 설정합니다.

이제 등각투영 평면이 있습니다.

모양을 더 잘 사용하려면 개체 > 모양 확장으로 이동합니다.

이렇게 하면 평면의 색상을 변경하고 점을 자유롭게 이동할 수 있습니다.

우리는 그것을 "확장 효과"라고 ​​부를 것입니다.

2. 섬의 면을 추적합니다.

섬 모양의 세 면을 만들려면 정사각형과 두 개의 길쭉한 직사각형을 만듭니다.

각각에 대해 "등각 투영 효과"를 반복합니다.

2단계에서는 "등각투영 상단", "등각투영 왼쪽" 및 "등각투영 오른쪽"을 각각 적용합니다.

3. 섬 기지를 완성하고 색칠하세요.

"확장 효과"를 적용하고 가장 밝은 부분이 항상 맨 위에 오도록 서로 다른 녹색 음영으로 각 얼굴을 색칠합니다.

4. 원근감 있는 큐브 면을 만듭니다.

3개의 정사각형에 "등각 효과"를 적용하고 2단계에서 왼쪽, 위쪽 및 오른쪽 등각투영을 적용합니다. 이렇게 하면 등각투영 큐브를 얻는 데 필요한 세 개의 면이 제공됩니다.

그림의 모든 개체는 세 개의 면만 사용합니다. 그것이 아이소메트릭 관점의 아름다움입니다.

5. 큐브를 구성합니다.

"확장 효과"로 모양을 해제하고 얼굴을 모은 다음 세 가지 회색 음영을 적용하여 조명을 시뮬레이션합니다.

팁: 가장 밝은 그늘이 항상 맨 위에 있습니다. 가장 어둡게, 오른쪽으로; 그리고 중간 톤, 왼쪽. 이것을 일러스트레이션 내의 모든 모양에 적용하면 자연광의 느낌을 줄 수 있습니다.

6. 트리 베이스를 시작합니다.

아이소메트릭 큐브와 동일한 단계를 따르고 이번에는 전체를 연결하기 전에 왼쪽과 오른쪽 면을 늘립니다.

그런 다음 나무를 표현하기 위해 세 가지 갈색 음영을 적용합니다.

7. 트리를 완성합니다.

나무 껍질을 축소하십시오. 큐브를 복제하십시오. 그리고 녹색으로 땅 모양처럼 얼굴을 색칠하십시오.

8. 큐브를 사용하여 빌딩 블록 만들기

큐브를 복제하고 건축 자재에 대해 분홍색으로 채색합니다.

규모를 가지고 놀아라. 낮은 지점을 아래로 이동하여 타워 기반을 만듭니다. 축소하여 기둥을 만듭니다.

9. 타워를 조립합니다.

타워 베이스와 핑크 큐브를 맞춥니다.

그들 사이에 약간의 공간을 두고 그 간격 안에 세 개의 기둥을 배치하십시오.

완벽한 정렬을 위해 "View" 메뉴 옵션에서 "Snap to Point" 및 "Smart Guides"를 설정했는지 확인하십시오.

10. 타워에 다리를 놓으십시오.

상단 평면에서 상단 및 오른쪽 점을 선택하고 트윈 타워의 등가 평면이 있는 점에 스냅합니다.

타워 브리지의 가장자리를 만들기 위해 오른쪽 평면을 복제하고 크기를 조정하기만 하면 됩니다.

11. 계단을 만듭니다.

타워에서 세 개의 얼굴을 복사하여 붙여넣습니다. 블록을 만들기 위해 가장자리를 정렬합니다. 그런 다음 아래쪽 점을 이동하여 한 계단 계단을 만듭니다.

단계를 여러 번 복제하고 배치합니다.

12. 계단을 닫습니다.

계단의 간격을 좁히려면 왼쪽에서 점을 정렬합니다.

13. 계단을 뒤집습니다.

완성된 계단을 선택하고 "반사 도구(O)"를 사용하여 왼쪽을 향한 두 번째 블록을 만듭니다.

조명 효과를 고려하여 왼쪽 및 오른쪽 얼굴의 색상을 변경해야 합니다. 오른쪽은 더 어두운 음영, 왼쪽은 중간 음영, 위쪽은 더 밝은 음영입니다.

14. 계단을 연결합니다.

몇 개의 큐브를 계단에 부착하여 디딤돌을 만들고 타워와 연결합니다.

15. 수심 효과를 만듭니다.

연한 파란색 표면을 복제하고 축소합니다.

다양한 위치에 놓고 더 어두운 파란색 음영을 추가하여 바다 깊이 효과를 완성하십시오.

16. 기존 비행기를 사용하여 데크 시작

계단과 타워브릿지와 마찬가지로 기존 면에서 시작하여 포인트를 적절하게 정렬하여 형태를 마무리하고 브라운 우드 쉐이드로 마무리합니다.

17. 데크에 기둥을 추가합니다.

나무 껍질을 선택한 다음 복제하고 축소하고 위치를 지정하여 데크 기둥을 만듭니다.

최종 결과는 다음과 같습니다.

바다에 더 크고 어두운 점을 추가하거나 섬 평면에 더 작은 색상의 등각투영 사각형을 추가하여 잔디와 꽃을 시뮬레이션할 수 있습니다.

전반적으로, 방금 배운 간단한 빌딩 블록을 사용하여 재미있고, 물건을 옮기고, 멋진 타워를 건설하십시오.

결론적으로

이 세 가지 가이드에서 보았듯이 멋진 일러스트레이션을 만드는 데 드로잉 기술이 많이 필요하지 않습니다.

다음 3가지 원칙만 명심하면 됩니다.

• 명확한 아이디어나 개념을 염두에 두고 시작하십시오. 무엇을 묘사하고 있습니까?
• 기존 아트웍과 스타일에서 영감을 얻으세요. 아티스트처럼 훔쳐보세요.
• 복잡한 요소를 관찰하고 작업할 수 있는 기본 기하학적 모양으로 변환합니다. 단순하게 유지하십시오.

자신만의 일러스트레이션을 만들고 Dribbble과 웹의 다른 곳에 새로운 예술 작품을 업로드하세요. 즐기다!

• • •

Toptal Design 블로그에 대한 추가 정보:

• 전자 상거래 UX – 모범 사례 개요(인포그래픽 포함)
• 제품 디자인에서 인간 중심 디자인의 중요성
• 최고의 UX 디자이너 포트폴리오 – 영감을 주는 사례 연구 및 사례
• 모바일 인터페이스에 대한 경험적 원리
• 예측적 디자인: 마법 같은 사용자 경험을 만드는 방법