모든 작업이 창 하나 안에서 끝나고, 내보내는 이미지는 화면에 보이는 것과 정확히 같습니다. 테마와 크기는 한 번 정하면 앱을 다시 열어도 유지되므로, 고민이 필요한 건 첫 번째 코드뿐입니다. 그다음부터는 붙여넣고 내보내면 끝입니다.
1. 코드 붙여넣기
코드를 복사해서 ⌘⇧V로 Codeshot에 바로 붙여넣으세요. 이 단축키는 창 안 어디에서든 전체 소스를 교체하므로, 편집 영역을 먼저 클릭할 필요가 없습니다.
붙여넣는 순간 강조 표시가 적용됩니다. 언어는 60가지 중에서 코드 자체를 보고 판별되고, 짧은 조각이라 애매할 때는 언어 메뉴에서 직접 지정할 수 있습니다. C 세 줄과 C++ 세 줄은 어떤 판별기에도 똑같아 보이니까요.
편집기를 찍는 대신 텍스트를 붙여넣는 것이 핵심입니다. 커서도, 선택 영역 강조도, 여백의 아이콘도, 편집기의 줄 너비도 남겨 두고 올 수 있습니다. 어느 것도 이미지에 들어갈 이유가 없습니다.
2. 테마 고르기
구문 테마는 30가지이고 각각 밝은 변형과 어두운 변형이 있습니다. 앱과 같은 스타일시트로 그려진 전체를 나란히 보기가 가능합니다.
고를 때 알아 두면 좋은 두 가지가 있습니다. 읽는 사람에게 익숙한 이미지를 만들고 싶다면 쓰던 편집기에 맞추세요. Swift라면 Xcode, 대부분은 GitHub입니다. 다만 작게 볼 곳에 올릴 이미지라면 익숙함보다 대비가 중요합니다. 부드러운 밝은 테마는 피드 크기로 줄어들면 구조가 무너집니다.
3. 배경 고르기
코드는 캔버스 위에 놓입니다. 그 캔버스는 macOS 배경화면 19가지, 그러데이션 92가지, 직접 정한 단색, 또는 여러분이 넣은 이미지가 될 수 있습니다.
배경을 완전히 끄고 투명하게 내보낼 수도 있습니다. 이미 자체 배경이 있는 슬라이드나 페이지에 올릴 때 필요한 방식입니다.
4. 프레임 다듬기
창의 모서리 둥글기, 창 안쪽 여백, 바깥쪽 여백, 그림자를 설정합니다. 신호등 버튼과 창 제목은 켜고 끌 수 있고, Mac에 설치된 고정폭 글꼴이면 무엇이든 쓸 수 있습니다.
여기는 한 번만 손대는 설정입니다. 마음에 들게 맞춰 두면 이후의 모든 코드에 그대로 적용됩니다. 열 번째 이미지가 몇 분이 아니라 몇 초에 끝나는 이유의 대부분이 이것입니다.
5. 알맞은 크기로 내보내기
크기가 내용을 따라가게 두거나, 비율로 고정하세요. 1:1, 4:3, 3:2, 16:9, 9:16, 2:3, 3:4가 있습니다. 프리셋은 너비와 높이 입력란의 단축일 뿐이라, 다른 비율은 직접 입력하면 됩니다.
내보내기는 1×, 2×, 3× 중에서 고릅니다. 기본은 2×로 두세요. 작은 글자를 1×로 내보내면 레티나 화면에서 흐려 보이고, 코드 이미지가 아마추어처럼 보이게 만드는 가장 흔한 원인이 바로 이것입니다.
그다음엔 편한 방식으로 앱 밖으로 꺼내세요. ⌘⇧C로 클립보드에 바로 복사하거나, 미리보기를 다른 앱으로 끌어다 놓거나, ⌘S로 저장하면 됩니다.
어디에 올릴 것인가
알맞은 비율은 전적으로 올릴 곳에 달렸고, 플랫폼마다 잘라내는 방식이 다르니 제대로 맞출 값어치가 있습니다. X, LinkedIn, Facebook용 개별 가이드와 나머지 크기 가이드가 있습니다.
마지막으로 한 가지, 분명히 적어 둡니다. 이미지는 복사할 수도, 검색할 수도, 화면 낭독기로 읽을 수도 없습니다. 코드가 보기 위한 것이 아니라 쓰기 위한 것이라면, 이미지 옆에 원본 링크를 함께 올리세요.