코드로 아쿠아가든 만들기


GPT-5 테스트 겸 코딩으로 아쿠아가든을 만들어봤습니다.
https://outliner-coach.github.io/aquagarden/
(GPT-5와의 채팅 프롬프트 https://chatgpt.com/share/68971a78-4950-800e-ab85-d3391b3d9275)
GPT의 캔버스 기능으로 만들어서 깃헙 페이지에 코드 복붙해서 배포했습니다.
처음엔 SVG로 시작했다가 물고기나 수목 인테리어가 예쁘게 안나와서 3D 그래픽으로 마무리했습니다.
기능은 별로 없구요, 그냥 관상용(?)인데 오브젝트들을 클릭하면 명언이 나옵니다.
하다보니 (원하는 기능은 아니었지만;) 줌인,줌아웃, 카메라 앵글 돌리기 등도 되긴 합니다. ㅎㅎ
신기한 부분은 이미지 하나 안쓰고 모든 것이 html 파일 하나 안에 있는 코드로 만들어진 것 정도이겠습니다.
(그래서 물고기나 수초 비주얼이... ^^^^^^)
여러번 프롬프트 잡도리도 해야 했고 에러도 몇번 나긴 했지만
GPT-5 그닥 별로네 라고 생각했는데 비슷한 컨셉으로 예전에 만든 것과 비교해보면 확실히 에러가 나는 비율이나 수정한 시간 자체가 확 줄긴 한 것 같습니다.
체감상 예전에 비해 걸린 시간이 최소 50%는 줄어든 것 같아서
GPT-5의 코딩 실력을 확인하게 된 프로젝트였습니다.
더불어 이렇게 백엔드나 DB, API가 없는 간단한(?) 웹페이지는
깃허브 페이지 기능으로 배포하는 것이 가장 쉬운 배포 방법인 것 같습니다.
퍼블릭으로 해야 하지만.. 어차피 기술적 해자 따위는 없으므로 ^^
Subscribe to my newsletter
Read articles from Wonkyung Lee directly inside your inbox. Subscribe to the newsletter, and don't miss out.
Written by
