어떤 작업을 하든 크롬 웹 스토어(Chrome Web Store)에는 거의 모든 사람에게 유용한 도구가 준비되어 있습니다. 그래픽 디자인이 본업이든 취미든, 몇 가지 확장 프로그램만 설치해 두면 작업 효율이 눈에 띄게 달라질 수 있습니다.
그래픽 디자이너라면 꼭 알아야 할 최고의 크롬 확장 프로그램 다섯 가지를 소개합니다.
1. WhatFont
첫 번째로 소개할 확장 프로그램은 WhatFont입니다. 이름에서 짐작할 수 있듯이, 이 확장 프로그램을 사용하면 버튼 클릭 한 번으로 웹사이트에 사용된 거의 모든 폰트를 식별할 수 있습니다.
사용법은 간단합니다. 크롬 웹 스토어에서 설치한 뒤 확장 프로그램 바에서 WhatFont 버튼을 클릭하면 됩니다. 그러면 마우스 커서가 올려진 텍스트의 폰트가 실시간으로 표시됩니다. 페이지를 이동하는 동안에도 자동으로 업데이트되므로 지금 보고 있는 폰트가 무엇인지 정확히 알 수 있습니다.
폰트 이름만 확인하면 충분하다면 여기까지만 사용해도 좋지만, 더 자세한 정보가 필요하다면 해당 텍스트를 클릭해 보세요. WhatFont가 작은 정보 박스를 펼쳐 수집 가능한 모든 정보를 알려줍니다.
폰트 이름, 스타일, 굵기(weight), 크기, 색상 등이 모두 포함되며, 샘플 알파벳도 함께 제공되어 나머지 문자들이 어떻게 보이는지까지 확인할 수 있습니다. 심지어 여러 개의 정보 박스를 동시에 열 수 있어, 눈으로는 비슷해 보이는 두 폰트를 비교할 때 특히 유용합니다.
2. ColorZilla
다음은 ColorZilla입니다. 그래픽 디자인 작업을 하다 보면 정확한 색상 값을 다루는 일이 매우 잦습니다. ColorZilla는 웹에서 보이는 색상을 찾고 식별하는 데 탁월한 크롬 확장 프로그램입니다.
설치 후 확장 프로그램 바에서 ColorZilla 버튼을 클릭하면 되는데, 이 확장 프로그램 하나 안에 정말 다양한 도구가 들어 있습니다.
대표적인 기능은 스포이드(eyedropper) 도구입니다. 화면의 아무 요소나 클릭하면 해당 픽셀의 색상을 RGB 값과 HEX 값으로 즉시 얻을 수 있습니다. 또한 고급 색상 선택기(color picker)도 내장되어 있어 원하는 색상을 직접 골라낼 수 있으며, 색상 선택 인터페이스는 익숙한 사용자라면 누구나 쉽게 다룰 수 있을 만큼 직관적입니다.
흥미로운 점은 ColorZilla가 색상을 추출한 요소 자체에 대한 상세 정보도 함께 제공한다는 것입니다. 태그 이름, 클래스 등의 정보를 알려주는데, 그래픽 디자인과 함께 웹 디자인도 겸하는 분들에게 의외로 유용한 기능입니다.
3. Site Palette
기존 이미지, 브랜드, 웹사이트에서 영감을 얻으려고 해본 적이 있다면, 이미지에서 중요한 색상 요소만 추출해내는 것이 얼마나 번거로운 일인지 잘 아실 겁니다.
Site Palette는 이 과정을 훨씬 쉽게 만들어 주는 확장 프로그램입니다. 방문하는 어떤 웹사이트에서든 빠르고 간편하게 색상 팔레트를 추출할 수 있습니다.
기본 사용법은 매우 단순합니다. 확장 프로그램을 설치한 뒤 Site Palette 버튼을 클릭하면, 해당 사이트에서 가장 많이 사용된 주요 색상들로 구성된 팔레트가 즉시 생성됩니다. 어떤 색상 조합이 효과적인지 파악하는 데 큰 도움이 되는데, 잘못된 색상 선택은 그래픽 디자인에서 피해야 할 대표적인 실수 중 하나이기 때문입니다.
팔레트 생성 외에도 생각보다 많은 기능을 지원합니다. 만든 팔레트로 공유용 링크를 생성할 수 있고, 팔레트 이미지를 만들어 미리보기하고 다운로드하여 다른 프로젝트에 활용할 수도 있습니다.
Adobe Swatch 사용자라면 확장 프로그램에 기본으로 내장된 지원 기능을 활용할 수 있으며, coolors.co와 Google Art Palette로 만든 팔레트도 호환됩니다.
4. Lorem Ipsum Generator (Default Text)
네 번째는 Lorem Ipsum Generator입니다. 로렘 입숨(Lorem Ipsum)에 익숙하다면 이 확장 프로그램이 하는 일을 금방 짐작할 수 있을 것입니다.
처음 들어보신 분들을 위해 설명하자면, 로렘 입숨은 실제 의미 없이 진짜 글처럼 보이는 기본 텍스트입니다. 단어 자체는 무의미하지만 문장 구조는 실제 글과 동일하기 때문에, 브랜드 메시지나 실제 콘텐츠가 들어갈 자리의 테스트 및 자리표시자(placeholder)로 활용하기에 완벽합니다.
Lorem Ipsum Generator는 필요할 때마다 적절한 자리표시자 텍스트를 빠르고 간편하게 생성해 주는 크롬 확장 프로그램입니다.
생성할 문단 수와 각 문단당 문장 수를 자유롭게 조절할 수 있어, 어떤 프로젝트에도 항상 맞춤형 자리표시자 텍스트를 준비해 둘 수 있습니다.
5. Inkscape
마지막으로 소개할 확장 프로그램은 Inkscape입니다. 크롬 확장 프로그램 하나로 이 정도의 작업이 가능하다는 사실에 놀라실 수도 있습니다.
Inkscape는 원래 Adobe Illustrator와 유사한 리눅스 데스크톱 앱으로, 강력한 벡터 그래픽 편집 도구를 갖춘 대표적인 무료 디자인 소프트웨어입니다. 이 확장 프로그램은 그 기능 전체를 브라우저로 가져옵니다.
자유곡선(freehand), 단순 경로(simple paths), 베지어 곡선(Bézier curves)을 활용해 처음부터 오브젝트를 만들 수 있습니다. 텍스트와 도형 도구는 물론 오브젝트 조작 도구도 지원하며, 회전이나 기울이기 같은 변형 작업을 수치 입력 방식과 직접 조작 방식 모두로 수행할 수 있습니다. 레이어와 오브젝트 그룹화 기능도 제공됩니다.
색상 선택기, 스포이드, 그라디언트는 물론 패턴 등도 모두 지원합니다. 벡터를 만들거나 편집할 때 필요한 거의 모든 작업을 이 확장 프로그램 하나로, 그것도 전부 브라우저 안에서 처리할 수 있습니다.
나에게 맞는 그래픽 디자인 도구 찾기
지금까지 살펴본 것처럼 크롬 웹 스토어에는 놀랄 만큼 다양한 도구가 준비되어 있습니다. 이 중 한두 가지라도 바로 설치해서 활용해 보고 싶은 확장 프로그램을 찾으셨기를 바랍니다.
브라우저 확장 프로그램은 디자이너가 활용할 수 있는 여러 도구 중 하나일 뿐이지만, 기존 작업 환경을 보완하는 훌륭한 역할을 합니다. 도구 모음은 넓힐수록 유리하니, 부담 없이 하나씩 추가해 보세요.