클로드는 문제를 재밌게 해결해주네

AI로 이미지를 열심히 만들다가 현타가 왔어.

만들어진 이미지는 예쁘지만 뭔가 애매하게 불편해. 심지어 약간 비위가 상하는 느낌이야. 이 AI 멀미는 생각보다 심각했고, 나는 이 멀미를 해결하고 싶어서 20년만에 카메라도 샀어. 조금 정밀한, 제대로 된 이미지를 보면 조금 해소가 되지 않을까 싶었거든. AI 멀미는 카메라 덕에 좀 나았어. 하지만, 완전한 해결책은 아니었지. AI는 업무에서는 어쨌든 계속 써야 하는 도구잖아. 완전히 멀어질 수도 없어서, 이것저것 공부하던 중에... 우리 회사에서 박람회에 참가하게 되었다는 뉴스를 들었어. (음. 귀찮은데)

넓은 부스를 분양받아서 세 자회사가 나눠 써야 하는 상황이더라구. 딱히 총괄하는 헤드도 없어서 논의가 꽤 피상적으로 흘러갔어. AI 이미지만 만들던 내가, 뭐 도울 게 있을까 싶어서 클로드로 간단한 html을 만들어 봤는데... 클로드 코딩, 이거 꽤나 쉽고 재밌네? 

 

🏗  조작법

드래그	회전
우클릭 드래그	이동
스크롤	줌 인/아웃
←↑→↓	키보드 회전
인터랙션
선분 클릭	격벽 순환 (없음→1m→2m→4m)
셀 클릭	색상 순환
노드 드래그	위치 자유 이동

🖱 드래그: 회전  |  우클릭: 패닝  |  스크롤: 줌  |  ←↑→↓: 회전  |  노란 선 클릭 → 격벽 생성/제거

 

 

9m x 12m 의 박람회  부스 공간. 서른 평이 약간 넘는 공간을 세 자회사가 어떻게 나눌 수 있을까를 각 회사에서 입장에서 구상해 볼 수 있도록 툴을 제공하기로 했어. 클로드와 대화하면서 "말로만" 원하는 걸 이야기 했더니 금방 파일을 만들어주네. 첫 안은 매우 단순했고, 지금은 여섯 번 정도 revise 한 결과물이야. 

• 9x12x4미터의 공간을 n개로 나누고, 그 사이에 벽을 세울 수 있음
• 각 셀을 롤오버하면 색이 밝아지는데, 클릭하면 녹색-보라색-파란색-회색으로 순환하게 함
  (각각 자회사를 상징하는 색상이며 회색은 공용공간 
• 벽은 노란색으로 하되, 노란색 선분을 클릭하면 1m-2m-4m-없어짐으로 순환하게 함.
• 각 모서리와 꼭지점에 원형 핸들을 두고, 영역 내에서 드래그하게 하되, 움직임에 따라 핸들에 붙어있는 선이 변형됨
• 선이나 셀에 롤오버하면 길이 또는 너비값을 알 수 있음 
• (MIL, KYS, LIB등은 주변 부스의 약칭임. 보안상 AI에게 구체적 사명은 넣지 않음)

실제로는 약간 더 복잡한 대화를 했지만, 거의 저 정도의 지시문 만으로 만든 html을 공유하는 건 즐거운 경험이었어. 

이걸 개발자에게 요청하면 얼마나 걸릴까?
개성이 없는 좌표 조정 탬플릿은 약간의 서칭으로도 찾을 수 있겠지만, 그 서칭하는 노력의 절반 정도만 시간을 써서 내게 딱 맞춘 툴을 만드는 건 참 대단한 것 같아. 

ps.
이미지 만드는 건 이미 나는 뒤떨어져 가고 있는 것 같고 코딩 역시 늦깎이 진입인데... 재밌어^^ 

 

booth.html

0.69MB