AI가 "다 됐습니다"라고 할 때 사람이 직접 볼 화면 체크리스트 uriui 업무자동화 노트 · https://blog.uriui.com/vibe-coding-screen-bugs/ 쓰는 법 - AI가 완성을 보고하면, 공개(배포)하기 전에 아래를 위에서부터 직접 해 봅니다. - 이상한 곳을 찾으면 [AI에게 말하는 법]의 형식으로 알려 줍니다. - 1~2번은 AI에게 먼저 시키고, 3번부터는 사람이 직접 눈으로 봅니다. ================================================== 1. AI에게 먼저 시킬 것 (요청 문장 그대로 써도 됩니다) ================================================== [ ] "실제 브라우저로 열어서 맨 위부터 맨 아래까지 스크롤하며 화면을 확인해 줘." [ ] "움직이는 효과를 켠 채로 끝까지 스크롤한 뒤, 투명하거나 가려진 채로 남은 요소가 있는지 찾아 줘." [ ] "PC 폭과 휴대폰 360px 폭에서 각각 캡처해서 보여 줘." [ ] "버튼, 폼, 옵션 선택처럼 누를 수 있는 것은 전부 눌러 보고 결과를 표로 정리해 줘." 2. 다른 대화창(세션)도 같은 폴더를 만지고 있다면 ================================================== [ ] "작업 전에 원본 파일이 마지막으로 바뀐 시각을 확인하고, 내가 지금 보고 있는 버전(주소)을 기준으로 해 줘." [ ] 아직 덜 만든 페이지에는 '미완성' 표시를 해 두고, 공개 명령에서 빠지는지 확인했나? [ ] 공개(배포)하는 방법이 한 가지로 정해져 있나? (대화창마다 다른 방법으로 올리지 않게) 3. 사람이 직접 볼 것: 화면 ================================================== [ ] 맨 위부터 맨 아래까지 천천히 스크롤했을 때 크게 비어 보이는 칸이 없나? [ ] 글자가 사진이나 배경에 묻혀 안 보이는 곳이 없나? [ ] 휴대폰으로 열었을 때 옆으로 넘치거나 버튼이 겹치지 않나? [ ] 사진이 깨지거나 엉뚱한 사진이 나오지 않나? 4. 사람이 직접 볼 것: AI가 확인하지 않았을 조건 ================================================== [ ] 새로고침했을 때: 아래로 내린 상태에서 새로고침한 뒤 스크롤해도 정상인가? [ ] 뒤로 가기: 다른 페이지에 갔다가 돌아와도 정상인가? [ ] 옵션·탭·크기 같은 선택을 바꿀 때마다 사진·가격·글이 같이 바뀌나? [ ] 다른 기기: 휴대폰 앱/휴대폰 브라우저/PC 브라우저에서 각각 열어 봤나? [ ] 영상이 있다면: PC와 휴대폰 양쪽에서 실제로 재생되나? 5. 사람이 직접 볼 것: 내용 ================================================== [ ] 숫자·가격·연락처가 맞나? (예시용 가짜 값이 그대로 남지 않았나) [ ] AI가 원문을 줄이거나 바꿔 쓴 문장이 있으면 "이건 어디서 가져온 정보야?"라고 물어봤나? [ ] 공개하면 안 되는 정보(실명, 개인 연락처, 회사 자료)가 화면에 없나? ================================================== [AI에게 말하는 법] 증상을 좁혀서 한 번에 ================================================== - 어디서: 어느 페이지, 어느 부분 (가능하면 캡처에 빨간 표시) - 어떤 기기: PC 브라우저 / 휴대폰 브라우저 / 휴대폰 앱 - 언제: 처음 열 때 / 새로고침 뒤 / 버튼을 누른 뒤 / 옵션을 바꾼 뒤 - 어떻게 보이나: 빈칸 / 글자 안 보임 / 사진이 다름 / 멈춤 / 맨 아래로 튐 예) "치과 페이지 첫 화면에서, PC 브라우저로, 아래로 내린 뒤 새로고침하고 휠을 굴리면 맨 아래로 튀어."