Bzzdex
← 앱 만들기

집중 타이머

정해진 시간만큼 재고, 끝나면 알려 주는 타이머 · 도구 ○○

이렇게 바꿔 보세요

프롬프트

25분을 재는 집중 타이머를 만들어 주세요. HTML 파일 하나로 열리고, 설치나 다른 파일 없이 브라우저에서 바로 돌아가야 합니다. CSS와 자바스크립트도 그 안에 넣어 주세요.

화면 가운데에 남은 시간을 크게 보여 주세요. 시작, 멈춤, 처음으로 버튼 세 개면 충분합니다. 시간이 다 되면 화면 전체가 색이 바뀌고 큰 글씨가 뜬다.

멈췄다가 다시 시작하면 이어서 가야 하고, 처음으로를 누르면 설정한 시간으로 돌아가야 합니다. 탭을 잠깐 다른 데 보고 와도 시간이 어긋나지 않게, 남은 시간은 시계로 계산해 주세요.

이미지 파일이나 외부 주소는 쓰지 마세요. 소리가 필요하면 브라우저가 직접 만들 수 있는 짧은 소리로 해 주세요.

다 만든 뒤에 시작-멈춤-다시-처음으로 순서로 눌러 보는 셈 치고 확인하고, 어긋나는 데가 있으면 고쳐서 최종본만 주세요.

쓰인 기법: 파일 하나로 만들기 · 무엇인지 먼저 말하기 · 화면에 띄울 것 정하기 · 하지 말 것 못박기

시간이 조금씩 밀리면 "setInterval 로 1초씩 빼지 말고 끝나는 시각을 정해 두고 남은 시간을 계산해 줘"라고 말해 보세요.


결과를 붙여넣으세요

이 앱을 만든 프롬프트도 같이 남기기 (선택)

AI에게 입력했던 말을 붙여넣으세요. 남에게 보일지는 나중에 정합니다.

0

이런 것도 있어요