1. PROJECT_OVERVIEW.md 파일을 만들고 프로젝트 구조와 앞으로 만들 기능을 정리했다.
2. 책 공유 기능을 공유 링크가 아니라 메인 검색 노출 여부로 다시 정리했다.
3. 책 공유, 책 검색, 로그인, 관리자 기능, 서재 편집 작업을 체크리스트로 추가했다.
4. 로그인 후 계정 프로필 화면이 열리도록 만들고, 버튼 구성을 정리했다.
5. 관리자 페이지를 추가하고 관리자 계정만 접근할 수 있게 했다.
6. 관리자 이동 버튼은 계정 프로필 안에서만 보이게 정리했다.
7. 관리자 뱃지는 계정 프로필 화면 안에서만 보이게 바꿨다.
8. 모바일에서 관리자 글씨와 뱃지 크기를 보기 좋게 조정했다.
9. Supabase service role key를 확인하고 실제 원격 작업이 가능하게 했다.
10. 한 계정을 수동 인증 처리해 로그인 가능 상태로 만들었다.
11. 테스트 계정에 어린 왕자 샘플 독서 기록을 추가했다.
12. 서재 페이지가 Supabase reading_entries 데이터를 읽어오도록 연결했다.
13. 로그인 오류 메시지를 한국어로 바꿔 사용자가 이해하기 쉽게 했다.
14. 메인 페이지의 서재 이동 버튼을 삭제하고 상단 검색창을 추가했다.
15. 책 삭제 버튼을 책 제목 옆으로 옮기고 모바일 겹침을 줄였다.
16. 완료한 작업을 PROJECT_OVERVIEW.md 체크리스트에 반영했다.
17. 주요 변경 뒤 TypeScript 검사를 돌려 문제가 없는지 확인했다.
1. 음주운전의 위험을 체험할 수 있도록 1인칭 운전 게임을 구성했다. 도로가 아니라 운전자의 시야가 흔들리게 표현했다.
2. 도로와 차선을 입체적으로 만들고 차선이 흔들리거나 공중에 떠 보이던 문제를 고쳤다. 건물도 앞면과 옆면이 보이도록 바꿨다.
3. W키와 위쪽 화살표로 가속하고 방향키로 차선을 변경할 수 있게 했다. 최고 속도와 화면 이동감을 높여 빠르게 달리는 느낌도 강화했다.
4. 음주 상태가 심해지면 반응이 늦어지고 차량이 비틀거리도록 만들었다. 일정 확률로 누른 방향과 반대로 잘못 움직이는 상황도 추가했다.
5. 아무 키도 누르지 않았는데 차량이 혼자 움직이던 문제를 고쳤다. 정차 상태에서는 조향, 비틀거림과 카메라 흔들림이 모두 멈추게 했다.
6. 중앙선을 기준으로 진행 방향을 구분했다. 플레이어와 같은 방향 차량은 오른쪽, 마주 오는 차량은 왼쪽으로 달리며 플레이어도 중앙선을 넘지 못하게 했다.
7. 세단, SUV와 쿠페 차량의 형태를 다르게 만들었다. 유리창, 바퀴, 범퍼, 번호판, 전조등과 후미등을 추가해 범퍼카처럼 보이던 외형을 개선했다.
8. 가까워진 차량이 사라지거나 플레이어 차량을 통과하던 문제를 고쳤다. 차량마다 위치와 속도를 따로 계산해 자연스럽게 이동하도록 했다.
9. 안전거리를 유지해도 앞차가 자석처럼 끌려와 충돌하던 문제를 고쳤다. 플레이어가 실제로 더 빠르게 접근해 차체가 닿을 때만 사고가 발생하게 했다.
10. 앞차 두 대가 나란히 도로를 막지 않도록 서로 다른 거리에 배치했다. 사고가 발생해도 사고 차량을 제외한 일반 차량은 계속 움직이게 했다.
11. 사고 10초 후 경찰차 두 대가 도로를 따라 접근하고 정차하도록 만들었다. 경찰관이 플레이어에게 다가와 수갑을 채우는 1인칭 검거 장면으로 수정했다.
12. 위험도 100%에서 운전자가 순간적으로 조는 장면을 추가했다. 눈꺼풀이 반복해서 닫히고 반응 지연과 차량 비틀거림이 더 심해지도록 했다.
1. 예전 계정으로 만들어져 있던 저장 기록을 전부 지우고 새 계정 이름으로 처음부터 다시 만들었다. 지금까지 작업한 파일은 그대로 두고 기록 관리만 새로 시작한 거라 작업물은 그대로 남아있다.
2. 예전 계정 소유였던 온라인 저장소를 그대로 쓸 수 없어서, 새 계정에 "bit-flow"라는 이름으로 온라인 저장소를 새로 만들고 지금 작업 폴더와 연결했다.
3. 새로 만든 온라인 저장소에 지금까지 작업한 내용을 처음으로 올려서 새 계정에서도 확인할 수 있게 만들었다.
4. 비밀 설정값을 넣어두는 예시 파일 이름을 실제로 쓰는 파일 이름으로 바꾸고, 화면 안내 문구와 설명 문서에 남아있던 예전 파일 이름도 같이 맞춰 고쳤다.
5. 게임 기록과 순위를 저장하던 방식을 다른 저장 방식으로 통째로 바꿨다. 저장하고 불러오는 코드, 누가 무엇을 볼 수 있는지 정하는 규칙, 로컬 테스트 설정까지 전부 새 방식에 맞게 다시 만들었다.
6. 새로 바꾼 저장 방식에서 순위표를 점수 순으로 빠르게 찾아오지 못하던 부분을 발견해서, 빠진 설정 한 줄을 추가로 채워 넣었다.
7. 구글 로그인용 진짜 값들을 설정 파일에 채워 넣었다. 형식이 맞게 잘 들어갔는지 확인해서 문제없다는 걸 확인했다.
8. 지금 당장은 안 쓰지만 나중에 필요할 수도 있는 구글 로그인 관련 값 하나를 잃어버리지 않게 설정 파일에 같이 저장해뒀다.
9. 로그인할 때 휴대폰 번호로 한 번 더 확인하는 보안 기능을 새로 만들어 넣었다. 인증번호를 보내고 확인하는 화면, 등록하고 해제하는 화면까지 갖췄다.
10. 나중에 이 사이트를 실제로 인터넷에 올릴 때 쓸 서비스 관련 설정을 추가하고, 기획 문서와 설명 문서에도 나중에 이 서비스로 배포할 거라는 내용을 적어 넣었다.
11. 서버에서 점수를 검증하는 방식을 계속 쓰려면 유료 결제 등록이 필요하다는 걸 알게 됐다. 그 대신 부정행위 방지 기능을 일부 포기하고 결제 없이 가는 쪽으로 결정했다.
12. 서버에서 점수를 검증하던 코드를 걷어내고, 로그인한 사람이 자기 게임 기록과 순위를 직접 저장할 수 있게 저장 규칙을 다시 짰다. 남의 기록을 덮어쓰거나 이미 제출한 기록을 다시 바꾸는 것 같은 뻔한 악용은 막아뒀다.
13. 사이트를 서버 없이도 돌아가는 정적인 형태로 빌드하도록 바꾸고, 인터넷에 올릴 때 쓰는 설정도 그에 맞게 고쳤다.
14. 화면에서 서버를 거치지 않고 저장소에 바로 기록을 저장하고 불러오는 새 코드를 만들었다. 아직 실제 화면과 연결하는 마무리 작업은 남아있다.
교통사고 시뮬레이션1. 교통사고 예방 시뮬레이션의 내용을 분석해서 PLAN.md에 기획 문서를 작성했다. 게임의 의도, 도움이 되는 점, 게임 요소, 기대 효과, 자체 검토 체크리스트를 정리했다.
2. SUV 급커브 상황에서 도로가 끊겨 보이는 문제를 확인했다. 커브 도로를 여러 조각으로 붙이던 방식에서 하나의 이어진 도로처럼 보이도록 바꿨다.
3. 커브 도로와 직선 도로가 같은 차선인데도 선으로 갈라져 보이는 문제를 고쳤다. SUV 급커브 단계에서는 기본 직선 도로를 숨기고 전용 커브 도로가 자연스럽게 보이게 했다.
4. 급커브가 너무 완만해서 위험 상황처럼 보이지 않는 문제를 고쳤다. 커브 각도를 오른쪽 90도에 가깝게 바꾸고 더 급하게 꺾이도록 조정했다.
5. 급커브 전에 직선 도로가 분명히 보이지 않는 문제를 고쳤다. 커브 진입 전 직선 구간을 길게 늘려서 실제 도로처럼 먼저 직진하다가 꺾이게 했다.
6. 급커브 뒤쪽 도로가 이어지지 않는 것처럼 보이는 문제를 고쳤다. 커브 이후에도 오른쪽으로 도로가 계속 이어지도록 길이를 늘렸다.
7. 커브 끝과 이어지는 도로 사이가 벌어진 것처럼 보이는 문제를 고쳤다. 연결 부분에 아스팔트 패치를 추가해서 틈이 보이지 않게 했다.
8. 급커브 상황이 실제 도로처럼 느껴지도록 가드레일을 추가했다. 커브 바깥쪽을 따라 난간이 이어지게 만들어 위험한 구간이라는 느낌을 살렸다.
9. 급커브에서 필요한 안내 표시가 없던 문제를 고쳤다. 노란색과 검은색 화살표 표지판을 커브 바깥쪽에 배치했다.
Travel Cheak1. 짐 체크 페이지에서 빈 안내 문구를 없애고 + 버튼 중심으로 바꿨다. 카테고리를 더 빠르게 만들 수 있게 하기 위해 화면을 단순하게 정리했다.
2. + 버튼을 누르면 카테고리 이름을 묻는 창이 뜨던 방식을 없앴다. 대신 바로 새 카테고리가 만들어지고 안에서 이름과 짐을 입력할 수 있게 바꿨다.
3. 카테고리 안에 짐이 없을 때 나오던 안내 문구를 지웠다. 빈 상태에서도 화면이 덜 복잡해 보이게 했다.
4. 카테고리가 생긴 뒤에도 + 버튼이 항상 맨 아래에 오도록 바꿨다. 새 카테고리를 계속 추가하는 흐름이 자연스럽게 이어지게 했다.
5. 카테고리가 1개 이상 생기면 “카테고리 생성” 문구가 사라지게 했다. 실제 내용이 생긴 뒤에는 불필요한 제목이 화면을 차지하지 않게 했다.
6. 카테고리 이름 칸의 크기를 조정했다. 기본 글씨가 잘리지 않으면서도 여백이 어색하지 않게 맞췄다.
7. 카테고리 이름 칸을 누르면 예시 글씨가 사라지게 했다. 사용자가 바로 입력할 수 있는 느낌이 들도록 바꿨다.
8. 카테고리와 + 버튼을 휴대폰 화면에 맞는 정사각형 타일로 바꿨다. 삼성 노트 앱처럼 카테고리를 카드처럼 고르는 화면을 만들기 위해서였다.
9. + 버튼을 누르면 확대되는 듯한 편집 화면이 열리게 했다. 카테고리 제목과 짐 추가는 이제 바깥 화면이 아니라 상세 화면 안에서 하도록 바꿨다.
10. 편집 화면 오른쪽 위에 나가기 버튼을 만들었다. 나가면 축소되는 듯한 효과와 함께 카테고리 목록으로 돌아오게 했다.
11. +로 들어간 뒤 아무것도 쓰지 않고 나가면 카테고리가 생기지 않게 했다. 빈 카테고리가 잠깐 보였다 사라지는 문제도 바로 없어지게 고쳤다.
12. 새 카테고리에서 내용을 쓰기 시작하면 나가기 버튼이 생성으로 바뀌게 했다. 사용자가 지금 새 카테고리를 만들고 있다는 느낌을 더 분명하게 했다.
13. 기존 카테고리를 수정하면 나가기 버튼이 변경으로 바뀌게 했다. 내용을 바꿨다는 상태가 화면에 바로 보이도록 했다.
14. 기존 카테고리 수정 중 되돌리기 버튼이 뜨게 했다. 처음에는 편집 시작 전 상태로 돌아가게 만들었다.
15. 되돌리기 기능을 다시 바꿔서 마지막 동작 하나만 되돌리게 했다. 제목 입력, 짐 추가, 짐 삭제, 체크 변경을 한 단계씩 되돌릴 수 있게 했다.
16. 새 짐을 추가하면 목록 맨 위에 생기도록 바꿨다. 방금 추가한 짐을 바로 확인하기 쉽게 만들었다.
17. 카테고리를 길게 누르면 삭제 선택 모드로 들어가게 했다. 이때 + 버튼은 사라지고 카테고리들은 작아지며 선택된 항목에 체크가 뜨게 했다.
18. 선택 삭제 모드에서 다른 카테고리를 누르면 함께 선택되게 했다. 여러 카테고리를 한 번에 지울 수 있게 하기 위해서였다.
19. 선택 삭제 모드 아래쪽에 휴지통 버튼을 만들었다. 누르면 선택된 카테고리가 한 번에 삭제되고 원래 화면으로 돌아오게 했다.
20. 선택 삭제 모드 오른쪽 위에 취소 버튼을 만들었다. 취소 버튼이나 휴지통 버튼으로만 선택 모드를 끝낼 수 있게 했다.
21. 취소 버튼 때문에 카테고리 목록이 아래로 밀리던 문제를 고쳤다. 버튼은 오른쪽 위에 겹쳐 뜨고 목록 위치는 유지되게 했다.
22. 카테고리를 길게 누를 때 갑자기 작아지는 대신 천천히 줄어들게 바꿨다. 길게 누르는 동작이 더 부드럽게 느껴지도록 했다.
23. 한 카테고리를 길게 누르는 동안 다른 카테고리들도 함께 천천히 작아지게 했다. 선택 모드로 들어가는 변화가 화면 전체에서 자연스럽게 보이게 했다.
24. 길게 누르기 완료 순간 화면이 옆으로 살짝 움직이던 문제를 고쳤다. 목록을 다시 그리지 않고 현재 타일에 상태만 붙이도록 바꿨다.
25. 작업 중간마다 스크립트 문법 검사를 실행했다. 수정 후에도 사이트 코드가 깨지지 않았는지 확인하기 위해서였다.
타바타 루틴 메이커(미완)1.인스턴트 음식의 1인분 칼로리를 볼 수 있는 기능이 없어서, 왼쪽에 인스턴트 음식 kcal 버튼을 만들어 누르면 피자, 라면, 햄버거 같은 음식 목록이 창으로 뜨게 했다.
2. 음식마다 소모하기 버튼을 붙여서, 누르면 운동 화면에 그 음식의 칼로리가 게이지로 나타나게 했다. 처음에는 지금 루틴을 몇 번 해야 다 소모되는지 알려주고, 운동을 시작하면 소모한 만큼 게이지가 줄어들게 만들었다.
3. 칼로리가 쉬는 시간에도 줄어들면 이상하니까, 실제로 몸을 움직이는 운동 구간에서만 게이지가 줄어들도록 했다.
4. 화면 아래에 있던 추가로 원하는 부분 입력칸과 루틴 만들기 버튼이 굳이 필요 없어서 없앴고, 이제는 목표만 고르면 루틴이 알아서 바뀌게 했다.
5. 보완하고 싶은 부분을 두 가지 골라도 앞에 고른 운동만 나오던 문제가 있어서, 두 가지를 고르면 각 목표의 운동을 두 개씩 섞어 보여주도록 고쳤다.
6. 목표는 최대 두 개까지만 고를 수 있게 안내 문구를 바꾸고, 두 개를 고르면 나머지 버튼이 눌리지 않게 막았다.
7. 초보와 저강도 항목이 다른 목표들과 같은 자리에 섞여 있어서, 그 항목만 따로 빼내어 아래에 별도 버튼으로 만들었다.
8. 처음에는 초보 버튼을 켜면 골라둔 목표가 무시됐는데, 초보와 목표를 함께 섞어 쓸 수 있게 바꿔서 저강도 운동과 원하는 부위 운동이 같이 나오게 했다.
9. 운동을 누르면 그 동작을 따라 하는 애니메이션을 넣어봤지만, 움직임이 운동과 전혀 맞지 않고 어색해서 다시 뺐다.
10. 음식 목록에서 소모하기 버튼이 항목마다 아래 한 줄을 더 차지해 스크롤이 너무 길어서, 버튼을 같은 줄 오른쪽으로 옮기고 글자도 줄여 목록을 짧게 만들었다.
11. 음식이 순서 없이 섞여 있어 찾기 불편해서, 목록을 가나다 순으로 정렬해 보여주게 했다.
12. 구간이 바뀌기 5초 전에 나던 삐 소리를 알아듣기 어려워서 5,4,3,2,1을 한국어음성으로 세어주도록 바꿨다.
1. 만들 서비스의 방향이 흐릿해서 PRD.md에 서비스 개요, 목표, 주요 기능, MVP 범위, 성공 기준을 정리했다. 말하는 사람의 말을 듣는 사람 언어로 바꿔 보여주고 들려주는 서비스로 정리했다.
2. index.html 한 파일 안에 화면, 디자인, 동작 코드를 모두 넣어 바로 실행할 수 있는 웹 앱을 만들었다. 따로 여러 파일을 나누지 않아도 브라우저에서 확인할 수 있게 했다.
3. 지원 언어가 너무 넓어지지 않도록 한국어, 일본어, 중국어, 영어, 프랑스어만 선택할 수 있게 했다. 말하는 사람 언어와 듣는 사람 언어를 각각 고를 수 있게 만들었다.
4. 사용자가 말한 내용을 화면에 원문으로 보여주고, 듣는 사람에게 전달될 말을 따로 크게 보여주도록 만들었다. 대화 상황에서 원문과 번역문을 헷갈리지 않게 나눴다.
5. 번역된 말을 듣는 사람 언어로 다시 읽어주는 기능을 넣었다. 사용자가 직접 읽지 않아도 상대방에게 음성으로 전달할 수 있게 했다.
6. 듣는 사람에게 어떤 언어로 전달됐는지 잘 보이지 않던 문제를 고쳤다. 번역 결과 아래에 전달된 언어와 전달 방식을 따로 표시했다.
7. 선택한 언어 하나만 보이던 화면을 고쳐서 한국어, 일본어, 중국어, 영어, 프랑스어 번역을 모두 같이 볼 수 있게 했다. 다른 나라 언어 결과를 한눈에 비교할 수 있게 했다.
8. 안녕 같은 짧은 말이 번역되지 않고 안내 문구로 나오던 문제를 고쳤다. 기본 인사말과 자주 쓰는 짧은 표현을 번역 사전에 추가했다.
9. 안녕, 만나서 반가워처럼 여러 표현이 섞인 문장이 번역되지 않던 문제를 고쳤다. 쉼표가 있거나 없어도 아는 표현을 이어 붙여 번역할 수 있게 했다.
10. 정해진 문장만 번역되는 한계를 줄이기 위해 실제 공개 번역 API를 연결했다. 이제 사전에 없는 자유로운 문장도 인터넷이 연결되어 있으면 번역 요청을 보내 결과를 받을 수 있게 했다.
11. 번역 API가 실패하거나 인터넷 문제가 있을 때 완전히 멈추지 않도록 기본 번역 사전을 예비용으로 남겨뒀다. 사용자가 가능한 범위 안에서 계속 테스트할 수 있게 했다.
12. 번역 중인지 사용자가 알 수 있도록 상태 문구와 번역 중 표시를 넣었다. 결과가 바로 안 나올 때 앱이 멈춘 것처럼 보이지 않게 했다.
13. 말하는 사람 언어와 듣는 사람 언어를 한 번에 바꾸는 버튼을 만들었다. 양쪽이 번갈아 말해야 하는 상황에서 매번 언어를 다시 고르지 않아도 되게 했다.
14. 번역한 원문과 결과를 대화 기록으로 남기게 했다. 이전에 어떤 말을 어떤 언어로 전달했는지 다시 볼 수 있게 했다.
15. 만든 기능이 깨지지 않았는지 자바스크립트 문법 검사를 했다. 로컬 서버도 켜서 페이지가 정상적으로 열리는지 확인했다.
16. 실제 번역 API가 작동하는지 확인하기 위해 안녕 만나서 반가워를 일본어로 번역해 봤다. 결과가 정상적으로 나와서 자유 문장 번역 흐름이 연결된 것을 확인했다.
17. PRD.md의 MVP 설명을 제한된 예시 번역 사전 중심에서 공개 번역 API 기반 자유 문장 번역 중심으로 바꿨다. 실제로 만든 기능과 문서 내용이 맞도록 정리했다.
1. 전체 쪽수를 0으로 입력할 수 있게 바꿨다. 대신 전체 쪽수가 0이면 잘못 저장되지 않도록 확인 버튼이 비활성화되게 했다.
2. 전체 쪽수와 읽은 쪽수 입력칸의 숫자를 전부 지운 뒤 새로 입력할 수 있게 바꿨다. 숫자를 지우면 바로 0이 다시 나타나던 불편함을 줄였다.
3. 독서 기록을 쓰는 칸의 기본 세로 길이를 줄였다. 처음 화면에서 기록장이 너무 길게 보여서 더 짧고 가볍게 보이도록 조정했다.
4. 책장에 보이는 책의 좌우 길이를 조금 줄였다. 책들이 화면에서 너무 넓게 보이지 않도록 폭 계산과 기본 폭을 함께 낮췄다.
5. 왼쪽 위 사이트 로고를 누르면 메인 페이지로 이동하게 바꿨다. 로고가 링크처럼 보여도 디자인이 깨지지 않도록 밑줄과 색상도 정리했다.
6. 사이트 시작 시 나오던 첫 화면을 없앴다. 루트 주소로 들어와도 바로 메인 화면을 볼 수 있도록 바꿨다.
7. 새로고침할 때 오류가 날 수 있던 시작 페이지 구조를 고쳤다. 다른 페이지를 그대로 다시 내보내던 방식 대신 공통 메인 화면을 따로 만들어 안정적으로 불러오게 했다.
8. 관리자 계정으로 볼 이메일을 설정할 수 있게 만들었다. 환경변수에 등록한 이메일로 로그인하면 상단에 관리자 표시가 보이도록 했다.
9. 독서 기록을 추가했을 때 새 기록의 읽은 쪽수가 이전 기록보다 작으면 확인하지 못하게 바꿨다. 읽은 쪽수가 뒤로 줄어드는 잘못된 기록을 막기 위해 확인 버튼을 비활성화했다.
10. 변경할 때마다 빌드를 돌려서 앱이 깨지지 않는지 확인했다. 몇 번 개발 서버 캐시처럼 보이는 오류가 있었지만, 최종 빌드는 정상으로 확인했다.
코딩 블랙잭1. 블록으로 알고리즘을 아무리 조립해도 게임에 전혀 반영되지 않던 문제를 고쳤다. 코드를 만드는 도구를 텅 빈 것으로 새로 만들어 쓰고 있어서, 원래 들어 있던 도구를 가져다 쓰도록 바꿨다.
2. 최신 버전에서 내가 만든 블록들이 인식되지 않던 문제를 고쳤다. 블록을 등록하는 방식이 바뀌어서 새 방식에 맞게 다시 등록했다.
3. 조건에 걸리지 않으면 카드를 계속 뽑아 터지던 문제를 고쳤다. 아무 결정도 나오지 않으면 무조건 멈추도록 기본값을 항상 넣어줬다.
4. 예상치 못한 값이 나와도 안전하게 멈추도록 판정을 바꿨다. 이제 확실하게 뽑기라고 할 때만 카드를 뽑는다.
5. 렛츠코딩 라운지 랭킹 기능을 붙였다. 만판이 모두 끝난 뒤 평균 점수를 자동으로 등록하게 했다.
6. 블록이 하나도 없어도 게임이 그냥 돌아가던 문제를 고쳤다. 이제 블록이 없으면 실행하지 않고 블럭이 없습니다라고 알려준다.
7. 화면 배치를 새로 바꿨다. 제목을 맨 위에 두고 긴 설명글은 지웠으며, 왼쪽은 블록 코딩 오른쪽은 결과가 보이게 나눴다.
8. 최고 점수가 늘 21로만 나오는 이유를 확인했다. 여러 판을 돌리면 운으로라도 21이 한 번은 나와서 실력과 상관없는 값이었다.
9. 21이 나온 횟수와 가장 낮은 점수를 결과에 새로 넣었다. 평균만으로는 알기 어려운 알고리즘의 성향을 볼 수 있게 했다.
10. 가장 낮은 점수에서 터진 판은 빼고 계산하도록 바꿨다. 터지면 0점이라 매번 0만 나와서 아무 의미가 없었다.
11. 한 번에 도는 판 수를 백 판에서 만 판으로 늘렸다. 판이 많아질수록 평균 같은 결과가 훨씬 안정적으로 나온다.
12. 실행하면 무작위 한 판이 실제로 어떻게 흘러가는지 눈으로 보여주게 했다. 카드가 한 장씩 내려오고 멈추거나 터질 때 표시가 뜨도록 움직임을 넣었다.
13. 21이 나온 값을 천백여덟칠 분의 만처럼 보여주던 걸 퍼센트로 바꿨다. 한눈에 알아보기 쉽게 소수점 둘째 자리까지 표시했다.
14. 무작위 판을 한 판만 보여주던 걸 원하는 만큼 최대 열 판까지 한꺼번에 보여주게 했다. 판마다 따로 카드가 깔리고 결과도 각각 표시된다.
15. 판 수에 따라 카드 크기가 자동으로 바뀌게 했다. 판이 적으면 크게 많으면 작게 나와서 한 화면에 다 들어온다.
16. 카드가 작아지는 정도를 더 크게 조정했다. 판을 많이 켜도 화면 밖으로 넘치지 않도록 했다.
17. 결과에서 늘 21로 고정되던 최고 점수를 지웠다. 그리고 결과 상자를 오른쪽에서 알고리즘 바로 아래로 옮겼다.
18. 결과에서 가장 낮은 점수와 랭킹 문구를 지웠다. 랭킹 자체는 그대로 두어서 점수는 계속 자동으로 등록된다.
19. 결과 항목을 지우면서 화면이 멈추던 오류를 고쳤다. 이미 없앤 자리를 코드가 계속 찾고 있어서 그 부분을 함께 정리했다.
20. 게임 진행 쪽의 긴 글자 기록창을 지웠다. 대신 블록 없음이나 오류 같은 안내는 카드 위 한 줄에 뜨도록 옮겼다.
21. 고친 내용이 실제로 되는지 매번 브라우저를 띄워 직접 확인했다. 화면을 캡처해 카드가 뽑히고 멈추는 것까지 눈으로 검증했다.
축구 게임1. 선수 얼굴이 점 몇 개로 찍힌 것 같아 가짜처럼 보이던 걸, 캔버스에 실제 얼굴을 그려 머리에 입히는 방식으로 바꿨다. 피부 음영, 흰자와 눈동자·눈빛, 눈썹, 코 그림자, 입술까지 그려 사람 얼굴처럼 보이게 했다.
2. 선수들이 다 똑같이 생겨 구분이 안 되던 걸, 피부색·머리색·눈동자색·수염 유무를 선수마다 다르게 조합해 저마다 다른 사람처럼 보이게 했다.
3. 선수 몸이 걸어도 뻣뻣하게 서 있던 걸, 걷고 뛸 때 팔다리가 앞뒤로 흔들리고 몸이 위아래로 들썩이는 동작을 넣었다.
4. 팔이 몸에서 떨어져 붕 떠 보이던 걸, 팔은 어깨를, 다리는 엉덩이를 축으로 접히도록 바꿔 몸에 붙어 자연스럽게 흔들리게 했다.
5. 팔다리가 너무 크게 휘저어 어색하던 걸, 흔들리는 폭과 속도를 줄여 차분하게 걷고 뛰는 느낌으로 다듬었다.
6. 몸이 네모 상자처럼 각져 보이던 걸, 상체는 둥글게 하고 팔다리는 원통으로 바꿨다. 손과 축구화 모양도 새로 만들고 팔뚝·허벅지는 살색, 정강이는 흰 양말로 나눠 사람 몸처럼 보이게 했다.
7. 잔디가 그냥 초록색 판이라 밋밋하던 걸, 잔디 깎은 줄무늬와 자잘한 결이 보이는 무늬를 넣어 진짜 경기장 잔디처럼 바꿨다.
8. 잔디판이 경기장 절반만 덮고 있던 걸 바로잡아 필드 전체를 제대로 덮게 했고, 경기장 밖으로도 이어지는 바깥 지면을 깔았다.
9. 배경이 온통 초록색이라 벽처럼 답답하던 걸, 위쪽은 하늘색으로 바꾸고 멀리는 안개로 흐릿하게 처리해 탁 트인 느낌을 줬다.
10. 햇빛 방향이 경기장을 벗어나 그림자가 거의 안 보이던 걸, 빛이 경기장 한가운데를 비추도록 맞춰 선수 그림자가 잔디에 제대로 지게 했다.
11. 골대에 기둥만 있고 허전하던 걸, 뒤와 옆·위를 감싸는 그물망을 달아 진짜 골문처럼 보이게 했다.
12. 경기장 주변이 텅 비어 있던 걸, 네 방향에 계단식 관중석을 세우고 색색의 옷을 입은 관중 수백 명을 앉혔다.
13. 관중이 가만히 멈춰 있으면 어색해서, 각자 몸을 들썩이게 하고 물결처럼 번지는 파도타기 응원을 하도록 움직임을 넣었다.
광부 게임1. 처음에는 단순한 2D 광부 게임을 만들었다. 이동, 채굴, 판매, 곡괭이 강화 같은 기본 흐름을 한 파일에서 실행되게 했다.
2. 게임이 너무 단순해 보여서 더 풍성한 광산 게임으로 바꾸려 해서 방향을 3D로 크게 바꿨다.
3. 브라우저에서 3D 광산을 볼 수 있게 Three.js 기반 화면으로 바꿨다. 동굴, 광물, 수레, 레일, 랜턴이 보이도록 구성했다.
4. 광물은 네모 블록이 아니라 광맥과 결정 모양으로 그렸다.
5. 시작 화면을 게임 화면이 아니라 인벤토리 가방 화면으로 바꿨다. 가방에서 보유 골드와 광물을 보고 광산을 고를 수 있게 했다.
6. 광산으로 이동할 때 갑자기 바뀌는 느낌을 줄이기 위해 로딩 화면을 만들었다. 광물을 실은 수레가 덜컹이며 움직이는 장면을 넣었다.
7. 수레 위 광물이 둥근 덩어리처럼 보여서 수정과 크리스탈 모양으로 바꿨다. 로딩 화면이 광산 게임 분위기에 더 잘 맞게 됐다.
8. 화면 비율이 세로로 늘어나 보이는 문제가 있었다. 캔버스 크기 설정을 고쳐 게임 화면이 찌그러지지 않게 했다.
9. 게임 화면 양옆에 빈 공간이 남는 문제가 있었다. 캔버스가 브라우저 전체를 쓰도록 바꾸고 정보창은 화면 위에 뜨게 했다.
10. 사진 같은 3D 광부 게임 느낌을 원해서 다시 3D 동굴 게임으로 만들었다. 직접 움직이며 광물 가까이에서 클릭해 채굴할 수 있게 했다.
11. 처음 시작 위치가 동굴 안쪽이라 어색했다. 광산 입구 앞에서 시작하게 바꾸고, 입구 아치와 바깥 바닥, 입구 조명을 추가했다.
12. 1인칭만이 아니라 3인칭도 쓸 수 있게 바꿨다. V 키와 버튼으로 시점을 바꾸고, 3인칭에서 보이는 광부 캐릭터를 추가했다.
13. 새 광산 버튼으로 바로 넘어가는 방식이 어색해서 고쳤다. 광산 끝에 열린 길을 만들고 수레를 타고 다음 층으로 가는 방식으로 바꿨다.
14. 수레가 순간이동처럼 느껴지는 문제가 있었다. 처음 수레 하나만 쓰고, 레일을 따라 천천히 덜컹거리며 다음 광산으로 이동하게 바꿨다.
15. 이동 중에도 조작이 가능하면 어색해서 수레 이동 중에는 잠시 조작과 채굴을 막았다. 도착하면 다음 층 광산 입구에서 다시 시작되게 했다.
숫자특공대1. 좀비 적을 추가하고, 죽으면 그 자리에 해골이 남도록 만들었다. 해골은 5초 뒤 같은 자리에서 좀비로 한 번만 부활하게 바꿨다.
2. 부활한 좀비가 다시 죽었을 때 계속 부활하던 문제를 고쳤다. 처음 죽은 좀비만 해골을 남기고, 부활한 좀비는 다시 부활하지 않게 했다.
3. 좀비가 죽어 해골이 남아도 보석은 바로 나오게 만들었다. 부활을 기다리는 동안에도 보상을 먹을 수 있게 했다.
4. 보석을 많이 먹을수록 다음에 필요한 보석 양이 늘어나게 바꿨다. 처음에는 적은 양으로 시작하고, 진행할수록 점점 더 많이 모아야 하게 했다.
5. 죽었을 때 전투 기록이 다음 판에 남던 문제를 고쳤다. 점수, 처치 수, 보석 진행도, 시간 같은 전투 기록이 초기화되게 했다.
6. 죽은 뒤 다시 전투를 시작하면 체력이 낮게 남아 있던 문제를 고쳤다. 새 전투를 시작할 때 체력이 항상 최대치로 차게 했다.
7. 1분이 지나면 중간보스가 나오게 만들었다. 중간보스를 잡으면 고기와 움직이는 무지개 보석을 떨어뜨리게 했다.
8. 고기를 먹으면 체력이 최대 체력의 절반만큼 회복되게 했다. 전투 중 위급할 때 보스 보상이 회복 수단이 되도록 했다.
9. 움직이는 무지개 보석을 먹으면 무기 선택 화면이 열리게 했다. 보스를 잡은 보상을 직접 먹어야 무기를 바꿀 수 있게 했다.
10. 3분이 지나면 최종보스가 나오게 바꿨다. 보스가 나오기 5초 전에 경고 메시지가 뜨도록 했다.
11. 최종보스가 나오기 전과 나올 때 잡몹이 사라지게 했다. 보스가 살아있는 동안에는 잡몹이 새로 나오지 않게 했다.
12. 최종보스가 5초마다 플레이어를 향해 빠르게 돌진하게 만들었다. 보스전이 더 위협적으로 느껴지도록 했다.
13. 보스가 소환될 때 잡몹이 보석으로 바뀌는 것처럼 보이지 않게 고쳤다. 기존에 필드에 있던 보석은 그대로 남게 했다.
14. 최종보스를 잡았을 때도 고기와 움직이는 무지개 보석을 주도록 바꿨다. 중간보스뿐 아니라 최종보스 보상도 먹을 수 있게 했다.
15. 최종보스를 잡으면 20초 동안 자석 효과가 켜지게 했다. 이 효과는 보스 보상으로 받은 임시 자석이라 시간이 지나면 사라지게 했다.
16. 최종보스를 잡자마자 스테이지가 바로 끝나 보상을 먹지 못하던 문제를 고쳤다. 20초 동안 보상을 회수한 뒤 스테이지가 끝나게 했다.
17. 처음에는 보라색 보석 한 개만 먹어도 숫자 퍼즐과 무기 선택 흐름이 열리게 바꿨다. 초반 성장이 너무 늦게 시작되는 문제를 줄였다.
18. 보석 요구량이 진행할수록 점점 늘어나게 조정했다. 처음에는 쉽게 무기를 고르고, 시간이 지날수록 더 많이 모아야 하게 했다.
19. 전투 중 새로 얻은 무기가 위쪽 무기 칸에 보이지 않던 문제를 고쳤다. 현재 전투에서 실제로 가진 무기 목록이 바로 표시되게 했다.
20. 무기를 고른 직후에도 화면 위 무기 표시가 바로 갱신되게 했다. 선택했는데 안 바뀐 것처럼 보이던 문제를 줄였다.
21. 자석을 골라도 보석이 끌려오지 않던 문제를 고쳤다. 선택한 자석은 전투 내내 계속 작동하고, 보스 보상 자석만 20초 동안 작동하게 했다.