인터랙티브 요소가 있는 동적 이미지를 만드세요.

프로젝트 개요
- 처음 화면에 "press Enter" 문구를 표시합니다.
- Enter 키를 누르면 화면 중앙에 점 하나에서 시작해 점점 커지는 동적 이미지가 생성됩니다.
- 점이 커질 때마다 중앙에 새로운 점이 나타납니다.

UI/UX 디자인 및 흐름
- 점에 대해 빨강, 주황, 노랑, 초록, 연파랑, 파랑, 보라의 순환 색상 패턴을 사용합니다.
- 각 새로운 점이 나타나고 커질 때 색상이 부드럽고 순환적으로 변경되도록 합니다.

핵심 기능 및 로직
- Enter 키 입력을 감지하여 점의 초기 나타남과 커짐을 트리거합니다.
- 순환 색상 패턴을 따르는, 중앙에서 연속적으로 커지며 새 점이 나타나는 기능을 구현합니다.
- 각 점은 나타날 때 동일한 커짐 동작을 보여야 합니다.

베스트 프랙티스
- 시각적으로 매력적인 부드러운 전환 및 애니메이션을 보장합니다.
- 지속적인 애니메이션을 지연 없이 처리할 수 있도록 성능 효율성을 유지합니다.
- Enter 키에 집중한 간단하고 직관적인 사용자 상호작용 모델을 구현합니다.

show the phrase "press Enter" If press Enter, create dynamic picture with a dot in the center of the screen, it enlarges, dot +n1, when it enlarges n+1, a new dot in the center appears, The dots should change colors cyclically from red to orange, yellow, green, light blue, blue, and violet, continue always

Q: What should happen when the new dot appears?
A: Should it also enlarge or have a different effect? yes

Q: How should the dots be styled?
A: Do you want them to be specific colors or just a uniform style? the colors go from red to orange, from orange to yellow, from yellow to green, from green to light blue, from light blue to blue, from blue to violetto  



Q: What should happen when the new dot appears?
A: The new dot should also enlarge, similar to the previous one.

Q: How should the dots be styled?
A: The dots should change colors cyclically from red to violet.