스크롤에 따라 캔이 이동하는 인터랙티브 HTML5 랜딩 페이지를 만들 때 활용하기 좋습니다.
Make me a professional html5 website of cold drink can animation, which roams to different and different positions when we scroll and then add text of a website named coca cola
스크롤을 내릴 때마다 여러 다른 위치로 이동하고 코카콜라라는 이름의 웹사이트 텍스트가 추가되는 전문적인 음료 캔 애니메이션 HTML5 웹사이트를 만들어 주세요.
출처 · prompts.chat · Cold Drink Can HTML5 Animation Website — 원문은 출처에 게시된 그대로이며, 권리는 원작자에게 있습니다.
Gemini로 프롬프트를 실행해 생성한 화면입니다. 화면 안에서 직접 조작하실 수 있습니다.
Three.js를 활용하여 스크롤 및 자동 시연에 따라 3D 음료 캔이 화면 곳곳을 누비며 다채로운 앵글과 위치로 이동하는 인터랙티브 웹사이트를 제작했습니다. 실시간 캔버스 텍스처로 생성된 'TPI 콜라' 캔을 중심으로 제품 라인업 변경 탭, 스크롤 연동 모션, 팝업 안내 등 실제 동작하는 유저 인터페이스를 구현했습니다.
Make me a professional html5 website of cold drink can animation, which roams to different and different positions when we scroll and then add text of a website named TPI 콜라
Gemini로 실행한 결과입니다. 입력 항목에는 국내 환경의 예시값을 적용했습니다(AI 생성 — 사실 확인 필요).
Make me a professional html5 website of cold drink can animation, which roams to different and different positions when we scroll and then add text of a website named TPI 콜라
Three.js를 활용하여 스크롤 및 자동 시연에 따라 3D 음료 캔이 화면 곳곳을 누비며 다채로운 앵글과 위치로 이동하는 인터랙티브 웹사이트를 제작했습니다. 실시간 캔버스 텍스처로 생성된 'TPI 콜라' 캔을 중심으로 제품 라인업 변경 탭, 스크롤 연동 모션, 팝업 안내 등 실제 동작하는 유저 인터페이스를 구현했습니다.
원문과 같은 언어로 보완한 프롬프트입니다. 점수는 명확성 · 구체성 · 출력 형식 · 재사용성 기준의 AI 평가입니다.
Act as a frontend developer. Create a responsive single-file HTML5/CSS/JS landing page for "[Coca-Cola]". Implement smooth scroll-triggered animations where a drink can moves to different layout positions per section, accompanied by styled brand text.