포토샵은 아주 오랜시간동안 큰 변화없이 인터페이스를 유지해왔습니다. 그 말은 즉 버전에 크게 구애받지 않고 기능들을 찾아쓸 수 있다는 이야기이기도 합니다.

포토샵에서는 주로 아래와 같이 큰 맥락으로 나눠서 볼 수 있습니다.

  • 메뉴표시줄
  • 툴패널 + 옵션바
  • 캔버스
  • 윈도우 패널

이러한 화면구성을 효율적으로 이용하며 자기만의 방법으로 작업하는 다양한 방식들이 존재합니다. 이렇듯 정해진 인터페이스지만, 정답은 없습니다. 오히려 더 나은 방법이 여러사람의 아이디어 속에서 계속해서 나오고 있습니다.

포토샵을 통해서 나오는 다양한 이미지들도 결국 이러한 기본 기능을 어떻게 조합해서 잘 사용하느냐에 따라 퀄리티가 다르게 나옵니다. 모든 메뉴를 다 잘 알 필요는 없습니다. 필요한 것만 익히면 됩니다.

대부분의 사용자들이 그렇게 포토샵을 활용하고 있고, 지나치게 많은걸 알아야할 필요도 없습니다.

보시다가 궁금하신 점 있으면 댓글 남겨주시고, 구독 및 좋아요도 부탁드릴께요. 계속되는 컨텐츠 생산에 큰 응원이 되어줍니다.

 

카페24 쇼핑몰 솔루션을 이용할 경우 SSL 보안인증서를 신청하면 무료로 설치가 가능합니다 (2018.2.7기준). 90일마다 새로 갱신된다는것을 보니 아마도 let’s encrypt를 이용하는 것으로 추측됩니다. 저도 현재 운영중인 블로그에 그렇게 적용해서 쓰고 있습니다. 참고 : 무료 인증서 설치 포스트

그런데 문제는 예상 밖의 곳에서 터졌습니다. https는 외부에서 끌어오는 이미지도 같은 보안 프로토콜이 적용 되어있어야 정상적으로 표현이 되는데, 현재 회사에서는 외부 이미지 호스팅(http)에서 이미지를 끌어다 쓰고 있다보니 모두 이미지가 정상적으로 노출 되지 않는다는 문제가 있었습니다. 자바스크립트를 통해 들어오는 경로를 모두 강제로 https로 변경해주는 스크립트를 제공하다보니 http://~ 로 불러오는 이미지가 전부 주소가 https:// 로 바뀌는 것이 원인이라는걸 파악했습니다. 통상적으로 보안프로토콜이 적용되는 사이트에서 이미지 소스를 삽입할때 프로토콜을 따로 명시하지 않도록 권고하고 있습니다. 예를 들어서 https://www.example.com/img.jpg 또는 http://www.example.com/img.jpg 라고 명시하지말고 그냥 //www.example.com/img.jpg 라고 명시하는걸 추천하고 있습니다.

하지만 카페24 쇼핑몰 솔루션에서 이미지를 이렇게 삽입할 경우엔 같은 https:// 프로토콜로 자동으로 변환해서 http://로 불러와야할 이미지도 무조건 https://로 붙어서 이미지가 전부 깨지는 겁니다. 잘못된 경로에서 호출하는 결과가 되는것이죠. 그래서 무척 고민하고 어찌할까 골머리를 싸매며 구글의 도움을 청했습니다. 제가 자바스크립트 실력이 미천해서 한참 검색하고 헤매다가 아래 포스팅을 참고하고 힌트를 얻었습니다.

제품 정보에서 상세이미지가 전부 깨지는것이 원인이었기때문에 , 해당 부분만 탐색해서 img 태그에 삽입되는 주소가 http://로 강제 적용해주는 소스를 삽입했습니다. 아래 내용을 보시면 어느정도 참고가 될 것 같습니다.

See the Pen add ‘http:’ script by 배현기 (@illustudio) on CodePen.

모든 이미지가 http://로 적용될 것은 아니기때문에 상세이미지가 표현되는 영역(prd-detail) 내에서만 img 태그를 골라서 http://로 강제 적용해주는 스크립트로 해결 할 수 있었습니다. 하지만, 또 별개의 상황이 벌어질 수 있기 때문에 이것이 완전한 해결책은 아닙니다. 그냥 임시방편 정도로 볼 수 있겠네요. 조금 더 세밀하게 조절하자면, 각각의 이미지 태그에 클래스를 적용해서 특정 클래스의 이미지만 http:// 프로토콜이 적용되는 식으로 스크립트를 바꿔 써도 괜찮을 것같습니다.

최근 카페24 스킨을 잘못 구매한 덕분에 쓰레기 치우느라(?) 아주 곤욕입니다. CSS 코드를 중복해서 여러번 불규칙적으로 정의해놓은 덕분에 5000여줄의 코드에서 일일이 찾아 지워주고 나니 1000여줄로 줄어드는 상황에 어이가 없는데, 이게 문제는 카페24 솔루션 특징상 CSS 코드가 수십개는 되는데다 만든 놈이 추가한 파일들도 있다는거죠. 그래서 이런 반복 되는 작업을 어떻게 해결할 수 있을까 고민한 끝에 css-purge라는 tool을 발견했습니다. 15800여줄의 코드를 보고 이건 안되겠다 싶어서 찾게 됐는데 간단하게 1700여줄로 줄여주는걸 보면서 감탄과 동시에 스킨 제작자를 저주하게 되더군요. 물론 완전하진 않습니다. 자동으로 중복된 코드를 지우면서 다이어트 하는 과정에서 불필요하다고 판단되는 것들을 지우다보니 지워선 안될 코드들도 일부 지운게 확인 됐습니다.그럼에도 불구하고 이 툴은 정말 쓸만합니다. 누락된 부분은 찾아서 추가하면 되는데 3군데 정도 누락되서 크게 어려움을 겪지 않고 문제를 해결 할 수 있었습니다. 아래에 관련 링크를 걸어두겠습니다. 저처럼 중복된 정의들을 지우기 위해서 애쓰지 마시고 css-purge로 스트레스를 덜 받으시길 바랍니다. http://rbtech.github.io/css-purge/그리고 추가로 minify된 코드를 해제하는 플러그인도 있더군요 atom 패키지 중에서 atom-beautify 를 이용하면 간단하게 해결 가능합니다. install package를 통해서 설치 가능합니다

보통 포토샵을 처음 배우시는 분 – 물론 포토샵 뿐 아니라 어떤 분야건 다 마찬가지입니다만, 질문 하는 방법을 모르는 분들이 많습니다. 처음에는 어떤 특정 개인의 문제인 줄로만 알았는데, 대체로 초보자라는 위치에 있는 분들에게서 공통적으로 발견되는 부분들이라는걸 깨달았습니다. 이런 상황들은 보통 텍스트로 모든걸 해결하려는 상황에서 발생합니다.

좋은 예시가 될 것 같아 대화 내용을 하나 캡쳐해왔습니다.

위와 같은 경우는 지금도 사실 이해가 안 가는 질문입니다. 제가 이해력이 부족해서 그럴 수도 있지만, “따닥따닥” 이라던지, “구석”, “이상한 곳” 이런 표현들은 지극히 주관적인 기준에서 표현하는 것들입니다. 질문은 듣는 사람과 내가 공통으로 이해할 수 있는 객관적 표현이어야 합니다. 이를테면 ‘레이어에서 잠금도 풀었고, 주변부에 잘못 칠해진 곳 없이 깔끔하게 잘 정리된 이미지 레이어임에도 불구하고 선택 및 이동이 잘 안된다’라는 식의 구체적인 표현이 필요합니다.

상대방 머리속에서 그림이 그려지도록 질문을 해야지, 자기 머리속에 그려진 것을 일방적으로 쏟아내면 상대방은 무한한 상상의 나래만 펼치게 됩니다. 그러다보면 계속 엉뚱한 답변을 한다던지, 잘못된 답변을 하는데 시간을 낭비하기 마련입니다.

그래서 질문을 하기 전에 내가 이야기하고자 하는 내용을 먼저 적어보고 이야기해보시는 것도 좋은 방법입니다. 하지만 위와 같은 경우는 사실 텍스트로 질문하는 것이 불가능한 내용일 수도 있습니다. 그래서 질문하는 사람은 많은 걸 준비해야 합니다. 화면도 캡쳐해서 보여주고, 그래도 안되면 화면을 영상으로 캡쳐 해서 보내주는 노력이 필요합니다.

그래야 답변하는 사람도 정성껏 답변해 줄 수 있습니다.  도와주고 싶어도 무엇이 답답한지 알 수 없는 상황에서는 답을 해줄 수 없기 때문이죠. 그래서 질문하는 방법도 공부를 해야 합니다. 그리고 무엇보다 기본적인 선택과 이동이 잘 안되는 상황이라면, 기초가 되어있지 않기 때문에 발생하는 문제입니다.

대부분의 질문은 부실한 기초 때문에 발생합니다. 그래서 초보자는 유튜브나 블로그에서 발견하는 화려하게 이미지를 꾸미는 튜토리얼을 무조건 따라하지 않기를 바랍니다. 기본을 굳이 설명하지 않아도 알아듣는 대상을 향해 다루는 내용들을 초보자가 따라하다보면 혼란만 가중될 뿐입니다.

첫 술에 배부를 수 없고, 걸음마도 배우지 않고 뜀박질 할 수 없습니다. 화려해 보이는 이미지들도 결국은 기본적인 기능들을 잘 이해하고 조합하며 사용하면서 만들어내는 것들입니다. 절대 기초를 가볍게 여기지 마시고, 차근차근 인내심을 갖고 기초 툴 들을 반복적으로 다뤄보세요.

한 가지를 익숙해지면,  다음 단계로 넘어갈 때 무의식적으로 쓰게 되면서 학습해야 할 분량이 줄어들기 시작합니다. 그렇게 하나하나 더해가다 보면 결국 대부분의 툴 들을 쉽게 사용할 수 있는 수준으로 올라가게 됩니다.

포기 하지 말고 흥미로운 이미지를 가지고 기초 툴을 다루면서 이것 저것 실험해보세요. 공부가 아니라 놀이처럼 이것저것 만져보면서 발견하게 되는 새로운 즐거움 들도 있습니다. 그게 포토샵을 하는 재미이기도 하니까요.

포토샵 과외

휴일에 포토샵 1:1 과외를 진행했습니다. 교육을 받게 되신 분은 취미로 사진 촬영을 하시고, 직장에서는 프리젠테이션 자료를 만들면서 포토샵이 필요해서 배우게 되셨다고 합니다. 첫 시간이라 대략적인 인터페이스와 디지털 이미지를 다루는데 필요한 기본적인 이론들에 대한 교육과 더불어 직접 실습하면서 툴을 익혀보는 시간을 가졌습니다.

이처럼 포토샵은 전문가의 전유물이 아닌 대중적인 툴이 되어가고 있습니다. 하지만 처음 접하는 사람 입장에서는 복잡한 인터페이스와 수 많은 기능에 압도되어 섣불리 다가가기 어려운 것도 사실입니다.

인터넷에 아무리 많은 자료들이 공개되어 있다한들 초보자 입장에서는 무엇을 찾아서 익혀야할지도 막연하게 어려운 것이 현실입니다. 그야말로 구슬이 서말이라도 꿰어야 보배라는 말이 실감 나는 상황입니다.

그래서 초보자 입장에서 포토샵을 가르쳐 드리기 위해 많이 고민해보았습니다. 툴을 다루는데 이미 익숙해진 숙련된 전문가들 입장에서 초보자의 막연함을 이해하기에는 이미 잊혀져버린 개구리 올챙이적 시절 이야기가 되어버렸습니다.

그래서 초보자들과 많은 대화를 나눠 보았습니다. 무엇이 막연한지, 그들이 왜 이해하기 어려워하는지, 이론적인 접근을 어떻게 해야 수월하게 이해하고 받아들이는지 살펴보고 다양한 방법으로 설명해보았습니다.

딱딱한 이론적인 내용도 이해하기 쉽게 예를 들어서 그림과 곁들여 설명해드립니다. 이러한 부분들을 공부하고나면 그동안 이유없이 답답하게 느껴졌던 부분들을 해소하고 더 나아가 스스로 학습할 수 있는 능력이 생깁니다. 물고기를 잡아주기보다 스스로 물고기를 잡게 만들어 드리는 것이 바로 제가 지향하는 목표입니다.