우아. 아시는 분들은 많으시겠지만 벌써 11년차 웹 개발자로 살아온 필자입니다. 글쓰는 재주도 별로 없지만 블로그에 많은 분들이 방문해서 질문도 남겨주시고, 초보자분들을 위한 포스팅은 항상 많이들 봐주셔서 감사한 나날을 보내고 있습니다.

  사람의 욕심은 끝이 없는거겠죠? 필자는 디자인 쪽에도 자연스럽게 관심이 가서 이런 저런 책들로 공부를 많이 해왔습니다만, 실제로 업무 영역에서 담당하는 업무가 디자인이 아니다 보기 실제로 활용하는 경우가 적어서 실력이 잘 늘지는 않더군요. 그래도 꾸준히 관련 서적들을 보면서 시야를 넓여 가고 있습니다.

  이번에 소개해 드릴 책도 이런 분야의 책입니다.

  바로 "만들면서 배우는 모던 웹사이트 디자인" 이라는 한빛미디어 서적 입니다. 웹 디자인은 다른 디자인 영역과 마찬가지로 고유의 특성과 규칙이 존재하고 그에 맞게 해나가는 것이 노하우 입니다. 기술과 접목되는 부분도 있기에 순수 예술처럼 자유롭지는 못한 것이 아쉽기도 한 부분입니다.

  화면에 표현되는 것, 그리고 사용자와의 반응성을 생각하고 서버와의 기능 조화를 이루어야 하기도 하고 기술적인 스펙의 한계에 맞추어야 하는 등. 한계를 가진 범위 안에서 최대한의 역량을 선보여야 하는 것은 웹디자이너의 숙명이 아닐까 합니다.

  앞서 말씀드렸지만 필자는 웹 개발자로 11년을 지냈습니다. 많은 웹디자이너들과 작업을 해봤고, 다른 영역의 디자이너들 심지어 개인 홈페이지를 꾸미기를 원하는 일반인에 이르기까지 많은 사람들의 디자인 작업을 보고 웹으로 옮겨내는 작업들을 진행해 왔습니다. 간단한 웹의 경우 필자가 직접 디자인 하는 경우도 많았고요.

  그런 많은 사람들과 작업을 하다보면 스트레스를 받는 부분들이 있습니다. 바로, 사람마다의 작업방식이 항상다르다는 것입니다. 미술을 예로 들면, 처음 미술을 시작하는 분들이 재료는 무엇을 준비해야할까요? 하고 물어보고 연필화로 시작하는 사람, 물감으로 그림을 그리는 사람들이 다양하고 같은 연필로 그리더라도 어떤 캔버스 위에다 작업할지 어떤 작업 방식을 취하는지에 따라 결과물의 양상이 상당히 달라집니다. 그것처럼 웹디자인도 동일한 경우가 많습니다.

  같은 웹페이지 디자인이라 하더라도, 어떤 사람은 사이즈 제한 없이 일러스트 작업을 하기도 하지만 포토샵으로 사이즈를 정해놓고 작업을 하기도 합니다. 이때 같은 포토샵을 사용한다고 해도, 각각 이미지의 해상도, 설정해 놓은 컬러셋 등이 다르고, 레이어와 폴더 구조도 천차만별입니다.

  그러한 문제점을 스스로 가지고 있던 와중에 이번에 모던 웹사이트 디자인이라는 책을 접하게 되면서 신선한 충격을 받았습니다. 내가 지금까지 일해 왔던 전문 웹디자이너들 중에서도 이러한 규칙을 가지고 작업하는 사람이 많지 않았는데. 이 저자는 정말 프로같다. 그리고, 자신의 노하우를 아낌없이 책에 공개하는 모습이 존경스럽기까지 했습니다. (한국 저자들은 약간 노하우 공개를 꺼려한다는 생각을 가지고 있는 필자입니다.)

  일반 디자인 서적들이 화려한 일러스트와 효과들로 표지를 장식하는 것들을 많이 보아왔는데, 이 책은 표지부터 달랐습니다. 한빛 미디어만의 색깔이 나기도 했고. 저같은 사람이 볼때! 아 이 책은 뭔가 체계적으로 배울만한 것이 있겠다. 라고 생각하기 충분하게 만드는 표지 디자인이었습니다.

  내부는 체계적이지만 뭔가 이뻐! 라고 점점 편을 들게 만드는 이 책! 그냥 마냥 찬양하게 되는 책이 되어버린 듯한 이 느낌? 그것은 목차를 보면서 더욱 심해집니다.  

  목차를 보면, 일반 웹 디자인 서적에서는 코빼기도 보이지 않던 기초중의 기초 포토샵의 설정!!!!!! 부터 나옵니다. 대 충격 초 충격 마냥 충격! 을 받았습니다. 필자도 디자인을 조금 해봤다고 말씀드렸죠? 거기다가 웹 디자이너들의 작업을 웹에 적용하려면 포토샵, 일러 등은 필수중의 필수입니다.

  그런데 저기서 설명된 내용은 단 한번도 설정해 본적도 없고, 저렇게 설정하는 것을 알고 있는 디자이너도 많지 않다는 사실에 충격을!!!! 학교에서는 안 가르쳐 주는거냐!!! 디자인과 각성하라! 라고 외치고 싶지만. 잘하는 분들은 다 알고 계시다는거! 혹시 한번도 배워보지 못하신 분들은 이 책을 통해 차근차근 기초부터 배워 보시면 너무너무 좋을 것 같습니다. 저도 첫장은 건너뛰는 편인데 이번 책은 하나하나 다 따라해 보게 되더라고요.

  거기다 저자의 세심함이 보이는 이 각 단계들의 캡쳐! 윈도우와 맥OS 양쪽 모두에서 메뉴들을 캡쳐해서 수록해 주셨습니다. 메뉴 이름이름이야 다 똑같고 구조도 다 비슷한대 뭐! 라고 하실지 모르겠으나, 블로그를 운영하다 보니 조금만 위치가 달라도 헤매는 분들이 많은걸 보면 이것은 저자느님의 위대하고 탁월하신 배려가 아닌가 싶습니다.

  저는 특히 이 컬러 설정 관련된 부분들이 전체적으로 좋았습니다. 모니터의 컬러를 맞추는 부분은 알고 있었는데, 모니터의 컬러 프로파일도 있다는 것만 알았지 이렇게 큰 차이를 가질줄은 몰랐습니다. (디자이너들은 A당과 N당 그래픽 카드의 색감차이에도 민감합니다.) 그리고 웹 브라우저 마다 또 차이가 있을 줄이야? 충격과 또 충격! 이제 디자이너분이 여기는 좀 이상하게 보이는 거 같아요! 라고 말씀하시면 아 그 버전의 웹 브라우저는 컬러 프로파일을 제대로 지원하지 않아서 그렇습니다. 하핫 이라고 말씀드릴 수 있을 것 같습니다.

  이런 중요한 내용들이 빠짐없이 수록된 이 책에서 조금 아쉬운 부분이라면, 웹 디자인을 어떻게 해야 하는지 셋팅과 구조의 관점. 그리고 디자이너가 알아야할 기본 소양등에 충실한 반면, 디자인 실무 부분, 많은 분들이 관심있어하실 디자인 예제부분이 적다는 것입니다. 반대로 생각해 보면 지금껏 예제로 나와 있는 책은 많았지만 이런 책은 거의 없었던 것이라고 생각해 볼 수도 있겠습니다.

  필자도 그런 디자인 예제 책은 너무나도 많거든요? 그래서 이 책이 가뭄의 단비와 같이 느껴집니다. 혹시 디자인 예제 책으로만 보기에는 뭔가 한계가 느껴지셨고 기본부터 다시 차근히 탄탄히 공부해 보고 싶은 디자이너분 이시라면 이 책을 보시는 것을 강력히 추천 드리겠습니다.

  오늘의 리뷰 끝!

＜＜만들면서 배우는 모던 웹사이트 디자인＞＞현대 웹사이트 디자인 만들면서 이것 저것 다 배울 수 있는 좋은 책인 것 같다. 개발을 하면서 디자이너와의 소통이 필요하기에 먼저 오프라인 강의를 통해 이름을 알린 야무님의 책을 통해서 디자이너와 더 가까워 질 수 있고 디자이너에게 알려주거나 팁을 주기에도 또한 선물을 하게 되면 정말 기분 좋게 책을 받고 웹디자이너로서의 길을 순탄히 나아갈 수 있을 것 같다.

고등학교 시절 컴퓨터그래픽스운용기능사 자격증을 공부도 하여서 취득하고 학교 수업에도 포토샵과 일러스트를 배우면서 포토샵을 배우면서 포스터를 제작하는 것과 일러스트를 통한 캐릭터 그리기 등을 모방형태로 많이 했었고 따는 연습을 많이 했던 기억이 난다.

컴퓨터에 대한 이해와 지식이 없었는데 포토샵을 하는데 더 좋은 환경 최고의 환경을 만드는 방법도 있었다니 정말 신기하다는 느낌을 받았다. 저의 컴퓨터는 포토샵을 하기 위해 어떠한 상태인가 궁금하였는데 SSD 64비트 intel i5에 듀얼코어였다.

포토샵 cs4부터 싱글코어보다는 듀얼코어가 좋다는 것을 알 수 있었고 SSD 보다는 HDD가 포토샵을 키는 것에는 SSD가 빠르겠지만 HDD가 더 좋다는 것을 알 수 있었다. 처음 포토샵을 공부하고 사용할 때는 그냥 사용하면 되겠지 하고 별다른 관심과 필요한 정도만 쓰면 되겠지 하는 생각을 하였었지만 이 책을 통해서 포토샵을 더 이해하고 컴퓨터도 이해하면서 친구 같은 느낌을 먼저 주면서 포토샵과 친근해질 수 있도록 도와주는 책이라는 느낌을 받았다.

웹사이트 디자인을 위한 단순한 이론적 지식이 아닌 실무에서 현업에서도 사용을 할 수 있는 자세한 설명과 깔끔한 디자인 호감이 가는 글씨체를 통해서 ‘아 정말 야무 강사님은 사람들의 마음을 움직이는 강사가 아닐까?’ 하는 생각도 하게 되었다.

작업환경을 설정하는 것부터 웹 타이포그래피, 웹 그리드 시스템, 프로토타이핑, 차세대 엡 벡터 글픽, 웹 컬러 매니지먼트, 이미지 슬라이싱, 웹 그래픽 디자인, 반응형 디자인 등을 통하여 웹 디자인 소양부터 실무 활용 테크닉가지 필요한 내용을 빠르게 골라 볼 수 있게 구성이 되어있다.

책의 목차도 다른 책들과 차별화 되게 목차를 찾아 페이지를 찾아가는 것이 아니라 강의 중 받았던 질문이나 질문 할법한 것들을 먼저 목차로 만들어서 자신이 궁금한 질문이 있다면 질문으로 찾는 목차에 있는지 살펴본다면 있다면 더 쉽게 질문거리를 해결 할 수 있는 센스 있는 목차였고 혹여 나 내가 하고 싶은 질문이 없더라도 질문으로 찾는 목차에 없더라도 목차에 찾아 있다면 쉽게 해결 할 수 있을 것이라 생각한다.

알찬 구성과 알찬 구성으로 되어 있는 책을 보면서 꼭 웹디자이너가 아니더라도 포토샵정도는 좀 사용할 수 있으면 좋지 않을까 생각하는 사람이라면 이 책을 통해서 한층 포토샵에 푹 빠지기도 할 것이고 즐길 수 있는 사람이 되지 않을까 생각이 든다. 모던 웹사이트 디자인 책에 이어 나올 모던 웹사이트 제작 책도 벌써 찾는 사람도 많은 것 같고 많은 실무진들과 입문자에게 실무에서 도움이 되는 책이라 생각한다.

탄탄한 책 구성도 좋지만,

제목이 참 좋더라.

만들면 쉽다, 만들면 재밌다, 만들면 놀랍다

만들면서 배우는 모던 웹사이트 디자인

단언컨대 책의 제목, 카피의 힘에 열외인 책이 없을 것이다.

딱딱하고 기계적일 것 같아보이는 컴퓨터 분야의 서적임에도 불구하고,

한참 동안 책을 펼치지 못하고 책 제목을 계속 들여다봤다.

내 시선은 '만들면서 배우는'이라는 문구에 한동안 멈춰있었다.

요즘은 '무언가 하고 싶다'고 하면, 그걸 하기보다는

거기까지 도달하는 생각, 잡념들이 참 많다.

그러한 고민의 시간이 불필요하다는 건 아니다.

하지만, 지나치게 과잉되서는 좀처럼 시도하기가 어렵게되버린다.

그렇기에 내게는 이 책인 '웹사이트 디자인, 고민은 이제 멈추고, 만들면서 배워봐!'라고

다독이는 메시지로 들려 좋았다.

여튼 첫 인상에 대한 이야기가 길어져버리고 말았지만,

책을 펼치면 '이 책을 보는 방법'이 2페이지로 구성되어있어

한 눈에 파악하기가 쉽다.

목적에 따라서 읽는 것이 가능하도록 3가지 목적을 나누어서 분류했다.

개인적으로 관심이있는 작업 환경 설정과 웹 컬러 매니지먼트와 웹타이포그래피를 체크해두었다.

사전처럼 관심사들을 미리 찾아볼 수 있는 점도 참 좋다.

전문가로서 한 걸음 내딛기 위해서는 자신 안에 쌓아둔 지식들을 혼자 가지고 있기보다는

많이 퍼내야 또 다시 새로 담을 수 있다고 한다.

익숙한 말로, 고이면 썩는다는 말처럼 쌓아두기만 해서는 아무것도 되지 않는다는 의미리라.

이 책의 지은이 야무님은 알고 있는 지식에 대해 아낌없이 이야기해준다.

이렇게 우리가 '무엇을' 고려하고, 염두해두면서 작업해야하는지를

알려주기 때문에 어떤 것을 선택하고 집중해야하는지 알 수 있었다. 

광활하다못해 넘쳐나는 정보의 시대에, 정확하고 믿음직한 책을 찾게되어 

처음 접하는 내용임에도 쉽게 배울 수 있어 즐거웠다.

공부라는게 열심히 하는 것도 중요하지만,

계속 해나가기 위해서는 '알아가고 있다는 느낌적인 느낌'이 중요하다는 생각이 든다.

이런 안전장치는 꼭 챙길 필요가 있다. 기껏 열심히 했는데 파일이 사라지거나 에러가 나면

너무 속상하기에..... 과거에 기사를 작성하거나 작업하던 내용이 몽땅 에러난 경험이 있어서

아쉬워했던 기억이 난다. 이제 포토샵 파일 안전하게 저장하시길!

웹디자인 책이라고해서 '웹디자인'만 다루는 건 아니고

'웹디자인'을 보다 편하게, 웹디자인으로의 문턱을 낮춰준 책이라는 생각이 들었다.

배워야 하는 웹디자인 지식들도 있지만, 평소 궁금했으나 물어볼 정도는 아니었다고 생각하는

디자인의 이유들을 짧게 접할 수 있어 리프레쉬되기도 한다.

'태초부터 그러했겠거니'하고 쉽게 생각했던 부분이

'실은 이러한 이유가 있었다'고 알게 되니 웹 디자인의 중요성을 새삼

느끼게 되는 기회가 됐다.

하반기에 출간 예정인 '웹사이트 제작'편은 어떤 내용으로,

또 어떤 구성을 담아냈을지 기대된다.

만들면서 배우는 모던 웹사이트 디자인 

​

한빛리더스 8기 2번째 미션도서로 "만들면서 배우는 모던 웹사이트 디자인"을 선택했습니다.  

사실 일반적인 웹디자인 튜토리얼 책이겠지 했는데, 

첫 장부터 저의 예상을 넘어섰습니다.

1장 웹 디자인을 위한 준비에서는 

웹디자인을 하기 위하여 하드웨어(CPU, 메모리, 저장장치, GPU 등등) 뿐만 아니라 프로그램(포토샵, 일러스트레이터), 모니터설정까지 정말 웹디자인 전문가 다운 꼼꼼함으로 설명하고 있었습니다. 

웹디자인 쪽은 아니지만 그래픽 디자인 관련 업무를 하고 있다 보니, 

들어는 보았지만 무시하고 그래픽 디자인 작업을 했던 저 자신에 난 전문가가 아니었구나 하는 자괴감과 함께 부끄럽고 마음을 다시 가다담으면서 정독을 했습니다.

4장 차이를 줄이는 웹 컬러 매니지먼트에서는 

브라우저에서 보는 이미지와 포토샵에서 보는 이미지의 색구현 차이가 난다는 사실에 대하여 명확하고 설명해 주고 있어서 좋았습니다. 클라이언트에게 직점 시안을 들고 가서 보여줄 때와 이메일을 통해서 시안을 보냈을 때 내가 보고 있는 이미지와 다르게 인식하고 피드백을 주고 받을 때가 좀 있었는데, 이 책에서 언급한 것처럼 명확하게 인지하고 있다면 클라이언트에서 휘둘리는 일이 줄어 들것 같습니다.

5장 업무 생산성을 높이는 이미지 슬라이싱은 포토샵으로 디자인 작업을 하는 사람들에게 강추하는 장이 될 것 같습니다. 

사실 포토샵은 개인별로 작업방식이 차이가 있습니다. 똑같아 보이는 결과물을 만드는 방법에도 개인별로 여러가지 방법으로 작업을 하는데, 여기서는 이미지 자르기 하나를 여러가지 방법으로 설명하면서 좀더 빠르게 정확하게 작업을 할 수 있는 저자의 팁을 소개하고 있어서 도움이 되었습니다.

6장, 7장, 8장, 9장은 저자의 작업방식을 따라하는 방식이라, 일반적인 튜토리얼 책과 비슷합니다. "moqups"를 활용한 프로토타이핑, 반응형 웹을 위한 중단점을 설정한 그래픽 디자인 방법 등은 초보 디자이너들에게 좋은 연습이 될 수 있을 것 같습니다. 그런데 중간 중간 액션을 활용하거나 레이러를 정리하는 방법 등 업무효율성을 높일 수 있는 팁들은 연차가 있는 디자인너에게도 도움이 될 것 같습니다. 

오랜만에 좋은 책을 읽은 것 같아서 기분이 좋았습니다. 

이 책은 초보자 보다 웹디자인이나 그래픽 디자인을 하고 있는 2~3년차 디자이너가 읽으면 좋을 것 같습니다. 초보자 입장에서 보는 것보다 업무를 어느정도 이해하고 있지만 뭔가 부족하다고 느낄 때 다시 기초로 돌아가 이 책을 읽는다면 느끼는 점이나 얻는 점이 많을 것 같습니다. 

이 책은 디자인을 하기 위해 주변 정리와 도구를 손질하고 연필을 꺼내 스케치를 완료한 상태 같습니다. 

이제 가위질과 풀질이 필요할 것 같은데, 후속이라는 "만들면서 배우는 모던 웹사이트 제작"이 기다려 집니다.

약간 아쉬운 점은 저자가 프로그램을 캡쳐할 때 Mac에서 한 것 같은데, 설명은 단축키 설명이 ctrl 즉 윈도우 기준으로 되어 있는데, Mac 사용자는 command로 생각하고 따라하면 될 것 같은데, 너무 기초적인 부분이라서 넘어간 것 같지만, 모든 페이지에 설명을 넣을 필요까지는 없지만 책 어딘가에 언급이 있었으면 좋았을 것 같습니다. 

그리고 뒷북일지 모르지만 이번에는 오탈자를 2개나 찾아내서 왠지 뿌듯했습니다. ㅋㅋㅋ

기존의 웹사이트 만들기 책과는 좀 다르다.

기본적인것이지만 정확히 몰랐던 부분을 확실히 알려주는 책이다.

그리고 하나의 방법을 주구장창 알려주고 설득하는 것이 아니라 다양한 방법을 소개해준다

현재 UI개발자로서 5장의 이미지 슬라이싱에 관심이 있었는데 딱히 누구도 이미지 슬라이싱에 대해서는

알려주는 저서라던가 방법같은걸 알려주지 않았었는데 항상 실무에서 쓰이는 방법이라 매우 유용하다고 생각하였다.

아는 부분도 있었지만 모르는 부분을 알게되었고,

이미지 슬라이싱의 다양한 방법들이 있음을 알게되었다.

플러그인의 사용이나 포토샵CC 프로그램의 소개까지 있어서 한단계 더 나아가 무언가 얻은 느낌이었다.

플러그인을 찾거나 하려면 시간도 많이 걸리고 영문버전이 많아서 사실 찾기가 쉽지 않았는데

좋은 정보를 얻을 수 있어 좋았다.

또한 이미지가 많이 삽입이 되어있어 책을 읽으면서 이해에 도움도 많이 되는것 같다.

생각보다 빨리 읽어내려갔다 ㅎ

이번책은 웹디자이너에게 좀더 유용하다면 개발자에게 더 가까운 다음 책이 기대된다.

 

한빛미디어의 '만들면서 배우는'시리즈를 만난건 이번이 두번째다.

2년 전 '만들면서 배우는 html5+css3+jQuery'를 보면서 독학으로 배운 html5랑 css3를 연습했던 터라

'만들면서 배우는'시리즈는 나에게 친절한 실용서로 남아있다.

야무작가님은 참 대단하신듯! 이렇게 좋은 책을 꾸준히 내는 것도 보통 일이 아닐텐데 말이다.

 

이번 '만들면서 배우는 모던 웹사이트 디자인'은 지금 하고 있는 일에

바로 접목시킬 수 있겠단 생각에 더 반가웠다. 

나는 편집디자인으로 시작해 웹디자인으로 전향한 케이스라

전문전인 스킬이 항상 부족한 느낌이 들었다.

몇년 디자인 일을 해보니 누군가 나서서 나를 가르쳐주기를 바라는 건 욕심이라는 생각이 들었다. 

더 많은 것을 알고 싶어 답답하다면 스스로 찾아 공부해야하는 수 밖에 없다. 

그래서 좋은 실용서적은 나에게 개인선생님이나 마찬가지다.

수많은 실용서적 중에 좋은 책을 찾아내는 안목도

노하우가 필요하다고 생각한다. 개개인마다 딱 맞는 스타일이 있게 마련이므로...

나에겐 한빛미디어가 잘 맞는 편! ㅎㅎ

 

이 책의 목차는 총 9장으로 이루어져 있다.

1장_ 웹 디자인을 위한 준비

2장_ 이미지가 아닌 웹 타이포그래피

3장_ 웹 그리드 시스템

4장_ 차이를 줄이는 웹 컬러 매니지먼트

5장_ 업무 생산성을 높이는 이미지 슬라이싱

6장_ 큰 그림을 그려 보는 빠른 프로토타이핑

7장_ NEXT STEP! 웹 그리픽 디자인

8장_ BUILD UP! 반응형 웹 그래픽 디자인

9장_ 차세대 웹 벡터 그래픽 시대 개막

 

 

 

일하는 시간 동안 나와 항상 함께 하는 것이 바로 '포토샵'이다. 포토샵은 애증의 관계다.

작업하다가 가끔 "작동이 중지되었습니다"라는 창이 뜰 때마다 심장이 쿵!하고 내려 앉는 느낌이 든다.

수고롭게 작업한 결과물을 날려버릴 때 가장 절망스럽다. 그나마 나는 손가락을 아예 Ctrl+S에 붙이고

자주 누르는 습관이 있어서 큰 참사를 겪은 일은 많이 없다. 

포토샵은 어떤 환경을 만들어서 쓰느냐에 따라 어떤 단축키를 쓰느냐에 따라 작업속도가 많이 차이난다.

단축키 덕후로서 작업에 필요한 웬만한 단축키는 다 정리해놓았지만 어떤 환경이 포토샵에 최적화된

환경설정일까 늘 궁금했었는데 제일 첫장에 환경설정 챕터가 있어서 아주 유용하게 잘 적용했다. 

책에 나온대로 설정을 바꿔놓고 최적의 상태로 작업하게 되었다. 

 

 

 

'이미지가 아닌 웹 타이포그래피'는 조금 안타깝게 느껴지는 챕터였다. 

아직은 이미지 위주의 웹 디자인을 하고 있는 나에게 웹 타이포그래피는 현실이라기 보다는 

남아있는 숙제 혹은 이상향 같은 느낌이 든다.

깔끔한 그리드에 아름다운 영문 웹폰트로 꾸며진 외국 사이트를 

볼 때와 오밀조밀 (웹폰트가 아닌)복잡한 이미지가 섞인 한국의 사이트를 볼 때

느끼는 마음이 자꾸 생각나서 조금 안타까운 마음이 들었다.

우리 한글도 웹폰트로 많이 나와서 이미지가 아닌 웹 타이포그래피가 많아지길 바란다.

 

 

 

부끄러운 이야기지만 그리드라는 기초공사를 제대로 짓지 못하고 디자인을 많이 했다. 

이것도 핑계에 속할진 모르겠지만, 딱딱 떨어지는 느낌의 디자인이 아니라 이미지 위주의 약간 화려한

구도를 선호하는 클라이언트가 많아서 그리드에 벗어나는 디자인을 많이 해왔는데 이번에 책을 읽으면서

가능하면 처음부터 그리드를 켜놓고 구도를 짜는 연습을 해야겠다는 생각을 했다.

연습하다 보면 자연스럽게 구도잡을 때 그리드에 맞춰 잡게 될 것 같다.

물론 모든 사이트를 12칼럼 그리드시스템에 맞춰 작업할 필요는 없다.

상황에 맞게 디자인의 다양성을 추구하는 것이 더 좋겠다. 하지만 반응형 웹 디자인을 할 경우

그리드시스템을 이해하고 작업하는 것이 아주 중요하다. 3장에서는 그리드를 한줄 한줄 만드는 것부터 

손쉽게 만들 수 있는 방법까지 모두 나와있다.

 

 

 

다른 챕터들보다 가장 먼저 들춰보았던 장이 4장_차이를 줄이는 웹 컬러 매니지먼트이다. 

디자이너라면 컬러에 민감할 수 밖에 없는데 인쇄디자인과는 또 다르게 사람들마다

사용하는 모니터에 따라 컬러가 다르게 표현되어 내가 작업하는 모니터에서는 보이는 색이

고객의 모니터에는 안보이는 상황도 벌어진다.

같은 컬러를 놓고도 누구는 진하다, 흐리다 라고 말할 수 있는 애매하고 어려운 분야가

컬러라고 생각한다.캘리브레이션을 통해 최적의 상태로 만들 수도 있겠지만

가격도 비싸고 어쩐지 부담스럽다. 책에서는 os 마다 브라우저 마다 차이가 나는

컬러시스템에 대해 자세히 설명되어 있다. 컬러에 대한 이해가 높은 디자이너가

진짜 디자인의 끝판왕이라고 생각하는데 이 챕터를 통해 많은걸 공부할 수 있었다.

 

 

 

웹디자인을 하면서 가장 많이 쓰는 툴 중에 하나가 슬라이스툴이다. 

한번만 자르면 그다지 힘들지 않겠지만 수정하고 또 자르고 자르고 또 자르고...

네이밍하고 네이밍 네이밍... 나만 이렇게 비효율적으로 일하는게 아닐까 싶을 정도고

지겹고 중복되는 작업이 슬라이스 작업이다.

책에서는 기초적인 슬라이스 방법 뿐 아니라 다이싱기법으로 이미지 자르기,

액션을 등록해 간편하게 슬라이싱하는 방법 등을 소개하고 있다.

 

 

 

본격적인 디자인을 하기 전 그러니까 기획단계에서 고객과의 커뮤니케이션에 필요한게

목업이 된 시안이다. 아무 것도 정해져 있지 않은 상태에서 바로 디자인을 들어가기란

여간 힘든 일이 아니다. 괜히 시간과 힘을 낭비하는 경우가 많기 때문에 규모가 크고

복잡한 프로젝트일 수록 목업단계를 거치게 된다. 나는 발사믹 목업이라는 프로그램을

사용하고 있는데 책에서는 moqups이라는 도구를 소개한다. 둘다 웹 브라우저에서

바로 사용이 가능하고 아이콘들도 다양해서 간단한 페이지를 구성하는데 더 없이 좋다.

시간이 촉박할 수록 기획이 잘 이루어져야하는데 목업툴을 이용해 기획하고 디자인한다면 

고객과 더 깊은 커뮤니케이션이 가능하다. 

총평

+ 이 책은 웹디자인을 처음 배우는 학생보다는 어느 정도 경력이 있는 디자이너나 학생에게 도움을 줌.

+ 이미 포토샵과 온종일 함께 하는 디자이너에게도 아직 모르고 있던 새로운 Tip을 선사함.

+ 현재 디자인 흐름에 만족할 것이 아니라 차세대 웹디자인을 제안하고 디자이너로서 발전할 수 있는

   도전의식을 심어줌.

+ 두꺼운 책을 보면 따라할 엄두가 나지 않지만 하나하나 따라하다보면 어느새 실력이 항샹해 있는

   자신을 발견함.

+ 작가 야무님의 스타일을 어느정도 파악함. (세번째, 네번째 책도 나오면 꼭 사고싶게 만듦)

점점 웹에 대한 관심이 늘어나면서 제대로 배워보고 싶다는 생각을 했지만,

쉽사리 행동으로 옮겨지지 않던 때에 이 책을 만났다.

디자이너로서 웹표준과 접근성, 웹 그래픽 디자인 강사로 활동하고 있다는 작가님의 이력에 신뢰할 수 있었고,

전반적으로 깔끔한 책 디자인과 똑같이 따라해볼 수 있는 실습으로 구성되어 있어서 직접 배울 수 있는 기회라고 생각했다.

완전 초보가 읽기보다는 어느 정도 포토샵을 사용할 줄 알아서 툴을 다루는 데는 익숙한 사람이 읽으면 좋은 책인 것 같다.

출간한지 한달된 따끈따끈한 책 +_+

이 책에는 디자이너라도 모르고 지나칠 깨알 Tip이 많아서 하나하나 나열하기 힘들 정도.

꼭 책을 봐야만 알 수 있는 몇가지 깨알 팁을 정리해보자면,

+ 포토샵 성능을 향상시키는 설정

하드웨어에 대한 정보는 사실 디자이너들은 잘 모른다. 

어떻게 구성하면 더 성능이 좋은 지, 포토샵 메모리 관리와 포토샵의 속도를 향상 시키는 정보들이 가득 들어있다.

이 부분은 그냥 읽는 다고 이해할 수 있는 부분이 아니라서 똑같이 따라해보면 좋다 :-)

+ CS6에서 제공되는 포토샵  저장/복구 기능

Ctrl + S 는 정말 생활화가 되어 나도 모르게 누르고 있을 때가 많지만

그래도 종종 프로그램이 부딪히거나 할 때 훅! 꺼져버리는 포토샵 때문에 속상했던 경험은 디자이너라면

누구나 있었을 것이다. 이 책에서는 CS6에서 추가된 복구기능을 알려준다.

+ 타이포그래피 디자인

타이포그래피 사용 능력을 보면 디자인 기본기가 얼마나 탄탄한지 알 수 있다.

텍스트를 사용할 때 안티알리아싱 설정 값에 따라 어떻게 다른 지 이미지로 설명해주는 부분이 인상적이었다.

+ 그리드 시스템을 설계할 때 칼럼을 12개로 설정하는 이유 

디자인을 할 때 가장 중요하게 생각하는 부분이 그리드인데, 이 부분 설명은 정말 깔끔하게 잘 되어있다.

그리드를 잘 짜놓으면 디자인도 정리되어 보이고 정보들이 눈에 잘 띄며 짜임새 있어 보인다.

그리드를 짜는 방법과 반응형 웹에 대응하여 칼럼 나누는 법, 그리고 칼럼은 왜 12개여야하는 지 자세히 설명 되어 있다.

요즘 멀티미디어관련 공부를 시작하면서

웹디자인 관련 자격증도 준비하고 바쁜 나날을 보내고 있는데요,

​

단순한 기초수준의 디자인이 아니라  

웹디자인이라는 영역을 실무에 맞춰서 기초를 다듬었으면 좋겠다는 생각이 있었는데

'만들면서 배우는 HTML5+CSS3+jQuery'를 통해 절대적인 신뢰를 심어주신 야무님의 저서가 나왔기에

고민할 필요도없이 선택한 '만들면서 배우는 모던 웹사이트 디자인' 입니다.

만들면 쉽다, 만들면 재밋다, 만들면 놀랍다 라는 부제처럼

무턱대고 '실전이란 이런거지!'라고 외치며 예제만 줄줄 늘어놓는다던가,

기본소양은 알고 시작해야한다며 주절주절 이론지식을 펼쳐내는 책은 싫어하는데

만들면서 배운다는 의미를 느끼게 해준 책인듯합니다.

​

포토샵과 연계되는 부분에서 몰랐던 기능을 많이 알게되었고

생소했던 프로토타이핑과 반응형 웹 디자인에 대한 개념도 확실히 알게되었습니다.

이 책은 크게 3개의 파트로 나뉠수있는데

첫번째- 1장. 작업환경시스템/9장. 차세대 웹 벡터 그래픽

두번째- 2장. 웹 타이포그래피/3장. 웹 그리드 시스템/4장. 웹 컬러 매니지먼트/5장. 이미지 슬라이싱

세번째- 6장. 프로토타이핑/6장. 웹 그래픽 디자인/8장. 반응형디자인

​

이론과 실무를 동시에 자연스러운 흐름으로 책에 풀어내신것에 대해 감탄했습니다. 

최적의 작업환경을 만들어놓는 준비과정이 담긴 부분에서는 

'이런게 진짜 팁 아닐까?' 하는 생각을 했습니다.

디자인이외의 부분(컴퓨터하드웨어적인)은 어떻게 적용을 시켜야 하는지도 헷갈리고 어려운 부분이 많은데

이부분도 쉽게 풀이해서 설명되어 있었고 따라할수있게 정리되어 있어서 좋았습니다.

웹타이포그래피같은 경우는 CSS구현하여 나와있어서 정말 많은 도움이 되었습니다.

웹디자이너라고 해서 디자인만 하는 시대는 아니니까요.

책을 진행하면서 생길법한 질문들에 대한 답을 명쾌하게 정리해주어서

마치 '니맘이 내맘이고 내맘이 니맘이지..'

신공을 발사해주는듯한 정리된 포인트들이 참 매력적이였습니다. 

그리고 제가 가장 마음에 들었던건 바로 이것.

전문용어나 생소한 언어에 주석을 달아서 확실한 개념을 잡아준것입니다.

따로 찾아볼필요없이 정확히 이해하고 진행할수있어서

초보자들에게도 친절한 책이라고 말씀드리고 싶습니다.

​

한가지 조금 아쉬운점이라면,

저자가 너무 실무포인트를 알게줄게 많아서 안달이 난것처럼 보인다랄까..ㅋ

(여기저기 팁들이 흩어져있는 기분)

물론 중요한 포인트들이 안들어갈순 없으니

다음엔 좀더 일관성있게 팁이 들어갈수있도록 정리되어있길 바랍니다.

마지막으로 이 책을 한마디로 표현한다면 '열정적인 책' 이라고 표현하고 싶습니다.

하나라도 더 가르쳐주고싶은 마음이 책을 읽는 저에게도 느껴지니까요.

​

못다한 이야기가 많다며 아쉬움이 남는다는 저자의 말을 보며

2014년 하반기 예정인 만들면서 배우는 모던 웹사이트 제작편도 기대해봅니다.

굿디자이너가 되시길 바래요~

웹디자인과 관련된 책들이 홍수처럼 넘쳐난다.

웹디자인 카테고리에 등록 된 책만해도 어마어마 하다.

저마다 이 책 한권이면 진짜 웹디자이너가 될 수 있을것 같이 홍보한다.

실상은 그렇지 않은데 말이다.

나는 웹관련 직종에서 활동하며 최신 정보를 얻기 위해 

웹서핑도 하고 신간 웹관련 도서도 즐겨본다.

그래서 참 많은 책들을 접했고 이런 종류의 책을 보면 목차만 쓱 훌터 봐도

이책은 좀 괜찮은데? 아...이건 어떻게 책으로 나온거지?

라는 나름의 판단이 선다. 

그런 나에게 만들면서 배우는 모던 웹사이트 디자인은 여타 따라하기식의 책들과 달랐다.

불필요한 군더더기를 쫙 빼고 실무에서 꼭 필요한 내용들로 짜임새 있게

구성했다. 간결한 구성은 다른 책들과 차별화를 시도했다는 느낌이였다.

책의 난이도는 초급에서 중급 정도의 수준이다. 그리 두껍지 않고 쉽게 설명한 편이다.

웹디자인에 발을 담그고 싶거나 기존에 가지고 있던 디자인 습관을 재정립하고 싶은

사람이라면 한번쯤 정주행 해볼 만한 책이다.