즐겁게 알고, 보고, 만들어보자!
아이콘과 픽토그램의 역사와 지식, 노하우, 실례, 디자인 방법의 요령까지!

쿠와사와 디자인 연구소를 졸업한 후 미치요시 디자인 연구실을 거쳐 호소야마다 디자인 사무소에 입사했다. 잡지 『seven』(아사히 신문사), 『로하스 메디컬』
등의 창간과 『山と溪谷』, 『Web Creator』(엠디엔코퍼
레이션), 『Newton』(뉴턴프레스)등의 리뉴얼을 담당
했다. 잡지, 도서 등 종이 매체의 편집 디자인을 중심으로 아트 디렉션, 디자인을 담당하고 있다.

chapter 1 아이콘이란?
_우리가 ‘아이콘’이라 부르는 것은 무엇일까?
_화면상의 ‘아이콘’에도 다양한 종류가 있다
_‘기호론’에서는 ‘아이콘’을 이런 식으로 자리매김한다
_흔히 사용하는 단어 ‘픽토그램’과 ‘아이콘’의 차이는?
_우리는 매일 ‘아이콘’에 둘러싸여서 생활한다
_재빨리 의미와 기능을 전할 수 있다
_작은 공간 안에 많은 정보를 넣을 수 있다
_그림+단어로 기억하기 쉽고 떠올리기 쉽다
_태어나서 자란 지역에서 사용하는 말을 넘어서서 의미를 전할 수 있다
_우리는 아이콘을 ‘보는’ 것일까, ‘읽는’ 것일까

chapter 2 아이콘을 살펴보자 -역사편-
_인류는 문자보다 훨씬 전부터 ‘그림’이나 ‘선’을 그려왔다
_동굴에 그려진 것은 ‘선’뿐만은 아니었다
_바위에 그려진 그림에는 예부터 아이콘 느낌의 표현이 다수 사용되었다
_세계 최대의 ‘아이콘’은 남미 대륙에 있다
_많은 사람을 매료하는 히에로글리프는 ‘아이콘’의 선조 격?
_히에로글리프 외에도 세상에는 ‘아이콘’과 유사한 문자가 있었다
_이윽고 문자가 단어의 소리를 나타내게 되자, 기호는 다른 기능을 진화시키게 되었다
_일본이 자랑하는 아이콘, 가몬은 무척이나 모던하고 쿨하다
_지도 기호는 아이콘의 천국
_현대로 이어지는 ‘아이콘’은 교통표지가 그 시작
_‘픽토그램’, 도쿄 올림픽에서 꽃을 피우다
_‘직감적’인 반응이 요구되는 자동차 아이콘은 의외로 오래전부터 존재했다
_지금도 교통기관에서 많이 볼 수 있는 사인은 1974년에 정비되었다
_모두를 위한 컴퓨터에서 ‘아이콘’이 탄생했다
_컴퓨터 화면이 컬러가 되자, 아이콘도 컬러가 되었다
_직접 터치할 수 있는 아이콘도 90년대에 등장했다
_인터넷 브라우저의 등장으로 아이콘도 대항해 시대에 들어서다
_스마트폰의 등장은 ‘아이콘’의 두 번째 생일
_그리고 전부 평면이 되었다? 화면은 플랫 디자인의 세계로
_앞으로 아이콘 디자인은 어떤 식으로 변하게 될까

chapter 3 아이콘을 만들어 보자
_‘아이콘’을 디자인하자
_아이콘 디자인 진행 방식
Step 1 목적 확인
_왜 아이콘을 사용하는가
_어디에서 사용하는가
_‘누가’ 보는가
_‘무엇’을 전하고 싶은가
Step 2 대상을 리서치하자
_무엇을 그릴지 정해져 있는 경우
_애초에 무엇을 그리면 좋을까?
Step 3 형태의 스타일을 생각하자
_스타일로 공유, 인식된다
_반복함으로써 스타일이 된다
Step 4 러프 스케치의 중요성
_종이 위에서 손을 움직이자
지금까지의 정리
_디자인은 왔다 갔다 하면서
Step 5 실제로 만들어 보자
_트레이싱 방식으로 만들기 1
_트레이싱 방식으로 만들기 2
_그리드 방식으로 만들기 1
_그리드 방식으로 만들기 2
_그리드 방식으로 만들기 3
_그리드 방식으로 만들기 4
Step 6 브러쉬업의 포인트
_화이트 스페이스, 빈틈 체크
_모서리 체크
_그리드는 기준일 뿐
_전체를 다시 한번 수정

chapter 4 아이콘의 변형
다양한 디자인&아이디어
_‘아이콘’이란 전부 똑같을까? 다양한 스타일을 시도해 보자
폰트 패밀리라는 사고방식
_‘그림 문자’이므로 ‘폰트 패밀리’를 참고할 수 있다
선의 굵기를 바꾼다
_선의 굵기만 바꿔도 인상은 크게 달라진다
모서리를 둥글게 한다
_모서리 처리 방식에 따라 전체적인 인상은 크게 달라진다
검게 칠한다
_검게 칠한 면을 메인으로 하는 아이콘 디자인
선을 자른다
_선을 닫지 않은 빈틈이 있는 아이콘
다양하게 시도해 본다
_원, 수직선, 수평선, 45도의 선만으로 아이콘을 만들어 본다
실루엣 형태로 만든다
_실루엣 느낌의 아이콘을 최대한 단순화해 본다
사각 도트로 만들어 본다
_굵은 비트맵 아이콘은 레트로한 분위기
전구나 LED의 이미지로
_둥그스름한 도트로 만드는 아이콘은 전자게시판 느낌
점선으로 만들어 본다
_라인 스타일 아이콘을 점선으로 만들어 본다
색을 더한다
_아이콘 일부에 핀포인트로 색을 넣는다
_아이콘 일부에 같은 색과 형태를 반복해서 더한다
_검은색 외의 2색 배색으로 아이콘을 색칠해 보자
아이소메트릭 변형
_아이콘의 한 면을 비스듬하게 변형해 본다
입체로 만든다①
_위에서 내려다본 아이콘을 만들어 본다
_아이콘에 다양한 두께를 부여하여 깊이감을 연출한다
손으로 그린 느낌
_아이콘의 선을 손으로 그린 느낌으로 만들어 본다
_아이콘의 선을 연필로 그린 것처럼 만들어 본다
그러데이션
_그러데이션으로 변형해 본다
변화, 강조를 더한다
_아이콘의 요소 중 일부를 빛나게 한다
일부를 흐리게 한다
_보일 듯 말 듯? 아이콘의 일부를 흐리게 처리한다
유머는 중요
_아이콘에 무언가를 더하거나 빼 본다
퍼즐을 모티프로
_심플한 파츠를 조합해서 만든다

chapter 5 아이콘 사례집 13가지
column
_컴퓨터 화면상의 충격은 휴지통에서 시작되었다? -휴지통 아이콘의 역사-
_아이콘은 언어의 차이를 넘어설 수 있을까?
_아이콘의 역사를 돌아보자 ?아이콘 연표-
_해외에서 만난 아이콘·픽토그램
_특별한 아이콘, 화살표와 풍경 아이콘
_‘그림 문자’의 역사 -그림 문자도 아이콘의 친구?-
_공중위생과 아이콘 디자인
Technique
_아이콘 제작에 활용 가능한 2가지 도구 -‘라이브 코너’와 ‘패스파인더’