251103 내일배움캠프 1일차 TIL

팀 미션 수행(팀 로고 만들기, 헤더 만들기 등)

우리 조의 이름은 2(Two)조와 함께(Together)의 합성어 처럼 만든 'Two-gether'로 결정되었다.

이에 따라 팀의 로고를 만들고 팀원들과 아바타를 맞춰 꾸미는 등의 활동을 했다.

 

처음에 결정된 팀 이름을 들으면서 '투게더' 아이스크림이 생각이 났던 탓인가, 그래서 AI로 로고 이미지를 생성해내는 내내 아이스크림만 붙잡고 생성을 했던 기억이 난다.

팀 활동으로 만들었던 팀 로고 시안

 

나는 Microsoft에서 제공하는 'Copilot' 이라는 AI 프로그램을 활용하여 해당 로고를 만들었다. 비록 최종적으로 선정된 것은 아니지만 생성형 AI 프로그램을 통해 내가 원하는 만큼의 이미지를 만들어낼 수 있다는 것을 깨달았다는 것 만큼으로도 충분한 가치가 있었던 일이라고 생각한다.

다음에도 이미지를 생성할 일이 있다면 이번에 한 것 보다는 더 자세하게 프롬포트를 작성할 수 있을 것 같다.

 

디자인 개론 강의 수강(1강 ~ 2강)

디자인이란 무엇인가?(1강)

 

디자인: 목적에 맞는 설계를 통해 문제를 해결하고, 기능성과 심미성을 조화롭게 구현하는 창의적 활동

단순히 예쁘게 만드는 것이 아니라, 사용자의 경험과 감정에 영향을 주는 전략적 사고 과정.

 

일반적으로 디자인을 생각하면 예술적인 것을 생각했었는데, 실제는 전혀 다르다는 것을 깨달았다.

 

일반적으로 공예품 생산은 예술가가 대량생산을 염두하여 만드는 것이 아니기 때문에 개별적 수작업이 바탕이 된다.

반면 디자인 제품은 제작자와 디자이너가 분리되어 있다. 또한 제품의 원가에 따라 생산계획을 짜고, 그 비용과 계획에 맞게 디자인되어야 하며 설계 및 기획 단계에서 기술과 효율성이 중요하다. 또한 대량생산이 가능하도록 디자인되어야 하며, 사용자와 기능에 따라 달라진다. 

 

그래픽 디자인, 시각디자인(visual communication design): 목적 지향적인 설계를 'Visual Language'를 통해 기능적, 시각적으로 구현하는 것.

Visual Laguage(시각 언어): 텍스트 없이 시각적인 요소만으로 상징과 의미를 전달하고 소통하는 것.

(예: 아이콘, 픽토그램)

 

또한 디자인을 할 때 기능적 시각적 구현을 AI를 도움을 받게 될 수 있다는 점이 흥미로웠다. AI를 통해 아이디어를 실체로 구현할 수 있다는 것이 기대된다.

 

 

그래픽 디자인 분야의 주요 직업이 아래와 같이 5가지로 분리가 되어있다.

 

1) 브랜드 디자인

- CI/BI 디자이너: 아이덴티티를 전문적으로 설계하는 회사와 그 조직에서 일하는 디자이너가 해당된다. 

(CI: Corporate Identity(기업 아이덴티티 디자인) (BI: Brand Identity(브랜드 아이덴티티 디자인))

 

- BX(Brand eXperience(브랜드 경험)) 디자이너: 로고뿐만 아니라 브랜드의 경험 전체, 즉 매장 및 고객 플로우를 통합 설계하는 역할 

- 브랜드 디자이너

- 브랜드 커뮤니케이션

 

2) UI/UX 디자인

- UI 디자이너: User Interface 디자인, 사용자 접점의 인터페이스를 디자인한다. (시각적인 측면)

- UX 디자이너: User eXperience 디자인: 사용자 경험, 즉 사용성에 더 초점을 맞춘 디자인을 한다. (기능적인 측면)

- 프로덕트 디자이너: 규모가 큰 서비스의 경우, 서비스를 하나의 제품으로 인식하고 제품이나 서비스의 전반적 사용경험을 디자인한다.

(예시: 사용자 니즈 파악, 제품의 방향성 결정, 사용성 테스트 등)

 

3) 패키지 디자인

- 패키지 디자이너: 종이포장이나 식음료 및 화장품 등의 용기 디자인을 모두 포함한다.

 

4) 광고 디자인: 과거에는 TV나 라디오, 신문, 잡지 등 매스미디어가 주류일 때는 비중이 컸지만 이들의 영향력이 줄고 온라인 광고 시장이 확대되면서 콘텐츠 디자이너 등의 새로운 역할이 생겨났다.

- 광고 디자이너: 광고 디자인 분야 종사

- 아트 디렉터: 광고 대행사에서 광고 디자이너가 커리어를 많이 쌓으면 아트 디렉터로 불리기도 한다.

- 콘텐츠 디자이너: 온라인 분야의 콘텐츠를 디자인한다.

 

5) 출판/편집 디자인

- 편집 디자이너: 책, 책이 아닌 인쇄물(리플랫, 포스터, 브로슈어 등)을 디자인한다.

- 북 디자이너

 

디자인의 원칙(2강)

디자인의 원칙: 디자인하는 매체나 시스템, 시각적 레이아웃, 사용자 경험 등을 만들 때, 지켜야 하는 기본적 지침이나 개념. 이 원칙들을 지키면 시각적 완성도와 더불어 기능성을 향상하고, 사용자의 이해도를 높이는 데 아주 유용하다.

 

균형(Balance): 영역을 구성하는 디자인 요소의 시각적 무게를 어느 한쪽에 치우침 없이 안정적인 구도를 가지도록 배치하는 원리

밸런스를 맞추는 방법은 일반적으로 대칭균형과 비대칭 균형이 있다. 

 

대칭균형: 양쪽의 요소가 동일한 크기, 형태, 색을 가진 상태를 말한다. 이런 대칭적 상황에서 자연스럽게 안정감을 느낄 수 있다.

비대칭 균형: 양쪽의 요소가 크기와 색상이 다른 상태를 말한다. 비대칭 균형은 크기와 색상의 조합으로 시각적인 에너지와 집중도를 높일 수 있다. 

 

대칭균형의 예시

https://www.behance.net/gallery/236289213/CookBook-Bash-Poster

CookBook Bash Poster - Chelsea Moody

해당 디자인의 경우 같은 요소를 비슷한 간격으로 배치하여 안정감을 느끼게 하였다.

 

비대칭균형의 예시

https://www.behance.net/gallery/237281827/Posters 

Posters - Alex Korn

해당 디자인의 경우 색과 크기, 형태가 다른 요소를 배치하여 시각적인 집중도를 높이고 있다.

 

 

대비(Contrast): 서로 상반되는 요소를 함께 배치하여 구성하는 요소들의 대립으로 흥미, 긴장감, 강조 등을 표현하는 원리

 

대비의 종류

크기 대비: 서로 상반되는 크기의 요소를 배치할 때 발생하는 것으로, 시각적으로 강한 흥미를 유발한다.

 

크기 대비의 예시

https://www.behance.net/gallery/119927397/Covers-for-my-favourite-Books/modules/682622683

Covers for my favourite Books - Silja Goetz

크기가 큰 고래와 작은 크기의 배를 배치하여 긴장감을 유발한다.

 

색상 대비: 서로 다른 색상의 요소를 배치할 때 발생한다. 시각적으로 다이내믹한 감각을 제공하고, 다른 대비보다 더 눈에 띄는 효과를 보여준다.

 

색상 대비의 예시

https://www.behance.net/gallery/237082943/KoKoA-chocolate/modules/1363534033

KoKoA - chocolate - Kate Davydov

각 초콜릿의 패키지에 다른 색상과 텍스트를 부여하여 제품별로 구분이 됨을 분명히 한다.

 

형태 대비: 서로 다른 형태의 조합에서 발생하며, 시각적 재미와 변화를 만든다.

 

형태 대비의 예시

 

https://www.behance.net/gallery/236748629/60th-aniversary-of-Casio/modules/1361302135

60th aniversary of Casio - DAQ Studio

각기 다른 모양의 요소가 다른 위치에 배치되어 있어 역동성과 시각적 재미를 부여한다.

 

 

계층구조(Hierarchy): 디자인 요소들의 중요도에 따라 계층 구조를 형성하여 사용자의 주의를 유도하고, 정보전달의 우선순위를 정하는 원리

 

디자인 요소에서 시각적 우선순위를 구조적으로 구성하여 계층구조를 잘 만들면, 정보가 전달되기 유리하다. 또한 기능적이나 심미적인 측면에서 잘 조화된 디자인이라고 말할 수도 있다.

 

전달하고자 하는 정보의 중요도에 따라 단계별, 크기별, 위치별로 계층구조를 설정할 수 있다.

 

텍스트 위주 편집물에서는 모든 텍스트가 동일하게 처리되면 정보의 구분이 어려워지므로 전달력이 약화된다. 그래서 디자인에서 어떤 것을 먼저 보게끔 할지 정해야 한다.

타이틀, 서브타이틀, 본문 등 각 요소를 별도의 규칙으로 배치하고, 중요 포인트는 한쪽에 모아서 강조한다. 이렇게 하면 정보 전달의 효율성이 높아지고 메시지 전달 효과 및 사용자 경험이 향상된다.

모든 텍스트가 동일하게 처리되면 정보의 구분이 어려워지므로 전달력이 약화된다. 그래서 디자인에서 어떤 것을 먼저 보게끔 할지 정해야 한다.

 

 

 

 

계층구조를 잘 표현한 디자인의 예시

계층구조의 예시

해당 디자인은 '두 발로 세계를 제패하다'라는 타이틀의 전시를 홍보하기 위한 포스터로, 전시의 이름을 가장 크게, 가장 대비되는 색상(노란색)으로 배치하여 해당 전시의 이름을 먼저 볼 수 있도록 의도하였다. 또한 그다음으로 큰 크기로 전시 일정과 장소를 표기하였으며, 상단 좌측에 '광복 80주년 기념 특별전'이라는 텍스트를 삽입하여 위에서부터 아래로 향하는 시선의 동선을 설정할 수 있다.

 

출처: 국립중앙박물관>전시>특별 전시>현재 전시> 상세

Home

 

 

통일성(Unity): 일정한 양식과 질서를 통해 다양한 디자인 요소끼리 서로 조화를 이루면서 일관된 메시지를 표현하는 원리. 

디자인 요소가 조화와 일관성을 이뤄 전체적으로 하나의 완성된 느낌을 주고, 많은 요소로 하나의 목소리를 내는 것이 목표이다.

질서를 만들어서 시각적 안정감을 제공한다.

 

반복: 어떤 디자인 요소를 반복해서 배치하여 통일성을 부여하는 방식

근접: 근접한 디자인 요소를 그룹핑하여 통일성 부여

정렬: 디자인 요소를 정렬 및 정돈하여 통일성 부여

 

 

통일성의 예시

 

https://www.instagram.com/p/DHbJ_v6hRZm/?utm_source=ig_web_copy_link

로그인 • Instagram

해당 디자인은 유사한 구성의 텍스트 디자인을 반복하여 배치함으로써 디자인 내에서의 통일성을 부여했다.

 

 

https://pin.it/6 OhPLQkdF

Gyuul 님이 보낸 핀을 확인해 보세요.

해당 디자인은 유사한 구성의 요소를 가지런하게 배열하여 통일성을 주었다. 또한 각 요소의 색상과 모양이 조금씩 다른 것을 확인할 수 있는데, 이를 통해 지루함을 절감시켰다.

 

https://www.behance.net/gallery/199605299/Color-Theory-Teoria-del-color/modules/1131173489

Color Theory / Teoría del color - Alba Cantalapiedra

해당 디자인은 인포그래픽 중 하나로, 그래픽과 텍스트로 표현되는 것이 디자인 내에서 일관적으로 펼쳐진다.

 

리듬(Rhythm): 여러 디자인 요소들을 규칙적으로 반복하거나 점진적으로 변화시킴으로써 시각적 율동감을 부여하는 원리.

 

리듬의 예시

https://www.mmca.go.kr/exhibitions/exhibitionsDetail.do?exhFlag=3&exhId=202501060001888

국립현대미술관

전시 <기울인 몸들- 서로의 취약함이 만날 때>의 포스터에서는 텍스트의 정렬을 오른쪽에서 왼쪽으로 조금씩 움직임으로써 리듬감을 부여하고 텍스트만 있을 때 생길 수 있는 지루함을 보완한다.

 

 

https://www.mmca.go.kr/exhibitions/exhibitionsDetail.do?exhFlag=3&exhId=202401250001744

국립현대미술관

전시 <보이는 수장고: MMCA 이건희컬렉션 해외 명작 전>의 포스터는 휘어지는 선들을 배치함으로써 리듬감을 부여했다.

 

 

강조(Emphasis): 특정 요소나 영역을 형태, 색, 크기 등을 강화하여 시선을 집중시키고 주목도를 높여 메시지를 효과적으로 전달하는 원리.

적절한 강조는 디자인 효과를 극대화하고 사용자의 참여를 유도하며 기억에 남는 경험을 제공할 수 있다.

 

 

디자인 감각 훈련

Day 1: 컬러 팔레트 리서치

각 레퍼런스에서 메인, 보조, 포인트 컬러를 뽑아내고 이에 대한 팔레트 제작과 컬러의 느낌 등을 기재하는 과제를 수행했다.

 

플래시 이미지(출처: 핀터레스트)

디자인 감각훈련 수행을 위해 나는 평소에 좋아하던 캐릭터인 '플래시'를 레퍼런스 삼아 각각의 컬러를 추출하고, 색상과의 관계를 파악했다.

 

같은 플래시의 모습임에도 불구하고 상황에 따라 색감이 달라지고, 이에 대한 그림의 인상 자체가 달라진다는 것은 언제나 놀라웠다.

그리고 또 느낀 것은 세상 아래 같은 색상은 없다는 것이었다.

비슷해 보이는 색상도 HEX가 완전히 달라지는 것을 보고 '나는 아직 한참 멀었구나'라는 생각이 들었다.

각 색상이 어떻게 조화가 되는지, 포인트컬러가 해당 그림에서 어떻게 포인트를 주는지도 곰곰이 생각할 수 있는 기회를 얻었다.

앞으로 그림이나 다른 디자인 작품들을 보면서 색상을 통해 예술가 또는 제작자의 의도를 파악할 수 있지 않을까 싶다.

 

그래도 오늘 첫날이어서 정신이 없었음에도 불구하고 원하는 목표만큼 할 일을 마쳐서 그래도 기분이 좋다.

비록 몸상태는 아주 안좋지만 이만큼 한게 기적이다. 앞으로 건강관리 더 열심히 해야겟다.

 

내일은 디자인개론의 3강을 수강하면서 타이포그래피에 대한 개념을 익히고, 그 개념을 익힌 상태에서 폰트 리서치를 하면 더 잘 되겠다는 생각이 든다.

오늘하루도 정말 다들 고생많았고 내일도 힘내봅시다!