1. 마우스 움직여서 웹페이지를 스크롤하기


웹브라우저에서 세로로 긴 페이지는 마우스 휠로 스크롤하기 귀찮았어요. 더 편한 방법이 무엇일지 고민하다가 평범한 마우스로도 노트북의 터치패드나 애플의 매직마우스처럼 스크롤하면 좋겠다고 생각했습니다. 마우스를 좌우로 움직여서 웹페이지를 스크롤하는 기능을 Tampermonkey의 유저스크립트로 구현했습니다. 작년에 ChatGPT와 대화하면서 만들었어요. 대화 내역은 삭제해서 없어요.


설치:

1. 구글 크롬에서 확장 프로그램 Tampermonkey를 설치합니다.

2. 확장 프로그램 페이지에서 개발자 모드를 켭니다.

3. https://pastebin.com/nUrKjwJY 에서 코드를 복사합니다.

3. Tampermonkey 유저스크립트에 복사한 코드를 붙여넣고 저장합니다. 


사용 방법:

마우스 Y버튼(마우스에서 엄지손가락 위치에 있는 두 버튼 중 앞에 있는 것)을 누른 채로 마우스를 좌우로 움직이면 화면이 상하로 스크롤됩니다. 제자리에서 눌렀다 떼면 기본 동작(다음 페이지로 가기)을 수행해요.


문제점:

대부분 웹사이트에선 되는데 일부 웹사이트에서 정상적으로 작동하지 않습니다. ChatGPT나 Gemini에서 안 됩니다.


마우스를 앞뒤로 움직이면 위아래로 스크롤되는 쪽이 더 직관적이지만, 마우스를 쥐고 앞뒤로 움직여보면 불편해서 좌우로 움직이도록 수정했어요.











2. 웹페이지에서 텍스트 선택 색상 바꾸기



웹 브라우저에서 텍스트를 선택하면서 읽는 습관이 있어요. 기본값은 선택한 영역이 파란 배경에 흰 글씨로 표시되는데 그게 못생겼고 읽기 불편해서 회색으로 바꾸고 싶었습니다. Gemini한테 물어보면서 간단히 구현했습니다. 


사용 방법:

위 스크립트처럼 https://pastebin.com/4YyMGgPJ 에서 복사한 코드를 Tampermonkey 유저 스크립트에 등록하면 됩니다. 


문제점:

일부 웹사이트는 선택 영역의 색상을 직접 정의해서 작동하지 않거나, 어두운 배경에 흰 글씨를 써서 선택한 영역이 돋보이지 않을 수도 있어요.












3. 단축키로 사전 찾기


AI와 일상적인 대화를 하면서 사전을 자주 찾아봅니다. 제가 쓰는 단어가 어떤 의미인지 정확히 알고 싶고, 어원, 한자, 유의어, 반의어 등을 찾으면서 글쓰기를 연습하기 위해서입니다. 네이버 사전, 다음 사전, 국립국어원 표준국어대사전 등에 검색해도 되지만 새 탭을 열고 단어를 검색하면서 작업이 끊겨 불편했습니다. 사이드바나 작은 팝업창에서 검색하거나 앱으로 사전을 검색할 수 있으면 좋겠는데 마음에 드는 확장프로그램도 없고 윈도우11에서 작동하는 앱도 찾기가 어려웠어요. 그래서 AI의 도움을 받아서 만들었습니다. 다음 어학사전 웹페이지를 띄워주기만 하는 아주 간단한 앱입니다.


Gemini 2.5 Pro와 협력해 만들었습니다. 코드는 대충 훑어보고 AI가 써준대로 그냥 복사해서 붙여넣었습니다. 주석도 귀찮아서 안 지웠어요.

https://gemini.google.com/share/fec427869a9c


설치:

1. 윈도우11 데스크톱에서 Node.js, Electron을 설치하고 프로젝트를 하나 만듭니다. 어려우면 AI한테 도와달라고 하세요.

2. 프로젝트 폴더에 main.js, package.json, icon.png를 만듭니다.

main.js는 https://pastebin.com/Lm2KeV8e 를 복사해 저장합니다.

package.json은https://pastebin.com/UzFSpc2u 를 복사해 수정합니다.

icon.png는 구글에서 dictionary png를 검색해 적당한 이미지를 다운받습니다.

3. npm run build 명령어로 실행 파일을 만들고 실행합니다. 사전은 백그라운드에서 항상 켜져 있습니다.

4. (선택) 실행(Win+R)에 shell:startup을 입력하고 시작프로그램에 바로가기를 등록합니다.


사용 방법:

Control+Alt+Shift+Q를 누르면 앱이 열립니다. 한 번 더 누르면 닫힙니다.


윈도우11, 4k모니터 150% 배율, 108키 키보드를 쓰는 제 환경에 맞게 값들이 하드코딩되어 있어요. 단축키를 직접 누르지는 않습니다. AULA F108 키보드가 복잡한 매크로를 지원하지 않아서 계산기 키를 Ctrl+Alt+Shift+Q로 설정해 사전을 켜는 용도로 바꿨습니다.



4. 후기


웹 개발에 대한 기본적인 지식은 있어서 이정도 프로그램은 AI의 도움 없이도 직접 작성할 수 있어요. 하지만 적절한 수단(플랫폼, 프레임워크, 라이브러리 등)을 선택하고, 새로운 도구의 사용 방법을 익히고, 공식 문서를 참고하면서 더디게 진행하고, 오류가 생기면 원인을 찾으려고 한참 노력하고, 스택오버플로우나 공식 문서를 읽으면서 수정하는 과정이 너무 번거로웠습니다. 그러다 보면 지쳐서 미루다가 결국 포기했어요. 하지만 AI의 도움을 받으면서 모든 과정이 빨라지고 문서를 읽는데 드는 노력이 줄어들면서 완성할 수 있었습니다. 빠르게 결과를 확인하고 개선하면서 눈에 보이는 성과가 있다는 점이 가장 좋았습니다.


대회에 참가하면서 '이게 다른 사람에게도 도움이 될까?'라는 생각을 했습니다. 그러다가 똑같은 기능을 가진 프로그램이 있는지 검색해 봤습니다. 있더라고요. 당연히. ScrollAnywhere나 Selection Colors라는 확장프로그램이 이미 존재하고, 그게 더 잘 작동합니다. 그렇지만 제 노력이 무의미하다고 생각하지는 않아요. 남들이 만든 프로그램을 써보며 내게 맞는 프로그램을 찾는 방법이 여전히 가장 편하고 잘 작동하지만, 그것이 불가능하다면 AI의 도움을 받아 직접 코딩해도 된다는 사실을 체감했으니까요. AI와 협력해서 프로그램을 만드는 과정도 재미있고, 내가 만든 앱을 내가 쓰면서 만족스러웠습니다. 물론 직접 해결하기 전에는 검색부터 충분히 해야겠다는 깨달음도 얻었습니다.


AI와 나누는 대화가 정신 건강에도 엄청 도움됐어요.