대화형 채팅 채널
2025.02.11
2025.02.15
2025.02.17
조
아래 요구사항을 모두 만족하는 React 웹 앱을 만들어주세요.
요구사항:
1.
Tailwind CSS와 Framer Motion을 함께 사용해주세요.
2.
전체 화면을 차지하는 캔버스(혹은 div) 위에서 여러 캐릭터가 등장하고 움직이는 간단한 게임을 만듭니다.
3.
캐릭터들은 아래 URL의 스프라이트 시트를 사용합니다:
•
이 스프라이트 시트에는 가로 4 x 세로 2, 총 8개의 캐릭터가 있으며, 각 캐릭터마다 가로 3 x 세로 4 프레임을 갖습니다.
•
6번째(두 번째 줄의 두 번째) 캐릭터는 사용하지 않도록 해주세요.
4.
마우스를 클릭하면 클릭한 위치에 무작위 캐릭터(6번째 캐릭터 제외)가 새로 생성됩니다.
5.
생성된 캐릭터들은 일정 간격마다 자동으로 랜덤한 방향으로 이동하고, 충돌(근접) 시 서로 밀어내며 한국어 말풍선을 표시합니다.
6.
캐릭터 스프라이트는 이동 방향에 따라 애니메이션 프레임이 변경되어야 하며, 각 캐릭터 머리 위 가운데에는 랜덤한 한국어 이름을 표시해 주세요.
•
이름 예시: ‘김민수’, ‘이서연’ 등 (최소 30개 이상의 이름 후보 풀 사용)
7.
말풍선 내용도 한국어 문장으로, 여러 문장 후보 중 하나가 무작위로 표시되도록 해주세요.
8.
캐릭터를 빠르게 걷는 느낌이 들도록 이동 속도를 적절히 높여주세요.
9.
코드 전체를 포함한 하나의 React 컴포넌트 형태로 만들어주시고, 필요하다면 다른 컴포넌트나 헬퍼 함수 등을 자유롭게 추가하세요.
You do not have permission to write posts
Share
조
조현정
캔버스
