여둘까 Office Layout TIL 15

폭을 맞춰 놓고 태블릿을 만져 봤다

만져 보니 세 가지가 막혀 있었다

앞서 좁은 화면 대응을 하면서 폰·태블릿·넓은 화면 세 폭을 자동 검사에 넣었다. 도면이 폭을 다 쓰는지, 서랍이 여닫히는지, 가로로 넘치지 않는지까지 본다. 전부 통과였다.

그 뒤 태블릿에서 직접 만져 보니 세 가지가 안 됐다. 축척 보정이 한 번 눌렀는데 바로 거리를 물었고, 팔레트에서 가구를 끌어낼 수가 없었고, 광고가 안 떴다.

초록불인데 버그가 있던 것은 앞선 TIL 14에서도 그랬다. 다만 그때는 아무도 그 동작을 검사에 적어 두지 않아서였고, 이번은 적어 둔 검사가 손가락을 흉내 낼 수 없어서다. 적혔느냐의 문제와 흉내 낼 수 있느냐의 문제는 다르다.

• 폭은 기계가 재고 손가락은 사람이 만져야 나온다. 자동 검사는 화면 크기를 흉내 낼 뿐이지 손가락으로 누르는 일은 흉내 내지 않는다
• 그래서 “작은 화면 대응했다”는 말은 “좁혀도 안 깨진다”까지만 보증한다. 그 화면에서 실제로 일을 끝낼 수 있는지는 다른 질문이다

---

가구를 놓을 방법이 없었다

앞선 TIL 14에서 폰 편집을 접은 이유가 바로 이것이었고, 그때 「다른 조작을 새로 정해야 한다」로 닫아 뒀다. 이번에 그 조작을 정했다.

태블릿까지는 편집을 받아 주기로 정해 둔 화면이었다. 그런데 여둘까에서 가구를 놓는 방법은 팔레트에서 도면으로 끌어다 놓는 것 하나뿐이고, 이 끌어다 놓기는 브라우저가 마우스용으로 둔 기능이라 손가락으로는 시작조차 되지 않는다. 편집을 받아 주기로 한 화면에서 정작 아무것도 놓을 수 없었다.

선택지를 받아 세 가지 중에서 골랐다. 탭하면 화면 가운데에 놓기, 항목을 고른 뒤 도면을 찍어 그 자리에 놓기, 항목마다 더하기 버튼 달기.

탭해서 바로 놓는 쪽을 골랐다. 놓은 자리가 마음에 안 들어도 손가락으로 끌어 옮기면 되기 때문이다. 자리를 먼저 고르게 하는 안은 한 번에 정확히 놓게 해 주지만 단계가 하나 늘고, 그 정확함은 어차피 끌어서 다시 맞출 것이라 그만한 값을 못 한다.

• 조작을 고를 때 기준은 “한 번에 정확한가”가 아니라 “틀렸을 때 고치기 쉬운가”였다. 고치기 쉬우면 첫 동작은 대충이어도 된다
• 대신 편집은 길게 누르기로 밀었다. 자주 하는 일이 짧은 동작을 가져가는 게 맞다

---

광고는 서랍 안에서 안 뜬다

세 번째는 광고였다. 태블릿에서는 팔레트가 화면을 덮는 서랍이 되는데, 광고 자리가 그 팔레트 안에 있다. 서랍은 닫힌 동안 화면 밖에 있고, 광고는 한 번도 화면에 들어온 적 없는 자리를 채우지 않는다. 그래서 서랍을 열어도 빈 칸이었다.

레이아웃만 바꿨다고 생각했는데 그 안에 세 들어 있던 외부 서비스가 같이 깨진 것이다. 우리 코드는 아무 문제가 없었다.

• 화면 구조를 바꿀 때는 그 안에 남의 것이 들어 있는지 본다. 광고·지도·결제창처럼 밖에서 와서 자리를 채우는 것들은 자리가 언제 보이는지에 따라 동작이 달라진다
• 그리고 이건 내 손으로 확인할 수가 없다. 광고는 로컬에서 아예 뜨지 않아 고쳤는지 아닌지는 배포한 뒤에야 알 수 있다. 확인이 안 되는 수정이 하나 섞여 있다는 걸 알고 올리는 것과 다 고쳤다고 믿고 올리는 것은 다르다

---

Series: Today I Learn