유리로 만든 채팅방, 그리고 되찾은 2초

안녕하세요? Eddy입니다. 이번에는 모바일 앱 이야기예요.

1.4.43을 설치하고 채팅방을 열면 화면이 낯설 거예요. 위아래에 딱 붙어 있던 막대가 사라지고, 헤더와 입력창이 대화 위에 유리처럼 떠 있어요. 눈에 띄는 변화는 그거 하나지만, 그 뒤에서 바꾼 게 꽤 많아요. 왜 그렇게 했는지 적어 볼게요.

막대가 화면을 먹고 있었어요

휴대폰 화면은 작아요. 그런데 채팅방 위에는 헤더, 아래에는 입력창과 도구 모음이 늘 자리를 차지하고 있었죠. 실제로 대화가 보이는 영역을 재어 보니 생각보다 좁았어요. "그러면 막대를 얇게 만들자"가 첫 번째 답이었는데, 얇아진 만큼 버튼이 작아져서 손가락이 빗나가더라고요.

그래서 방향을 바꿨어요. 막대를 없애지 말고 띄우자. 헤더와 입력창을 반투명한 유리로 만들어 대화 위에 얹으면, 대화는 화면 끝까지 흐르고 버튼 크기는 그대로예요. 유리 뒤로 대화가 비쳐 보이니 "이 아래에 더 있다"는 것도 자연스럽게 알 수 있고요.

유리 하나를 그리는 데 네 겹이 들어가요 — 뒤를 흐리는 블러, 옅은 흰 채움, 윗면에 스치는 하이라이트, 그리고 가장자리의 부드러운 림. 네 겹이 다 있어야 "유리"로 보이고, 하나라도 빠지면 그냥 "투명한 판"이에요. Android에서는 블러가 기본으로 꺼져 있어서 처음엔 딱 그 투명한 판이 나왔어요. 켜는 데 한참 걸렸습니다.

상태는 바탕이 아니라 테두리가 말해요

거래처 방에서 내부대화를 켜면 예전에는 화면 전체를 두르는 사각 테두리와 두 가지 톤의 배경이 생겼어요. 유리 위에 그 사각 링을 얹으니 서로 부딪히더라고요. 이제는 입력창의 테두리가 브랜드색으로 바뀌는 것 하나로 말해요. 내가 지금 어디에 쓰고 있는지는 결국 입력창이 알려주는 게 맞으니까요. 여기서는 정색하고 덧붙일게요 — 표시 방식만 바뀌었지, 내부대화가 우리 조직 멤버에게만 보인다는 규칙은 그대로예요.

2초는 어디에 있었나

화면을 다시 그리는 김에 채팅방이 열리는 시간을 재 봤어요. 방을 누르고 대화가 보이기까지 스켈레톤(회색 뼈대)이 약 2초 떠 있었어요. 이상한 건, 그릴 메시지를 이미 손에 쥔 채로 가리고 있었다는 거예요. 스켈레톤은 메시지가 있을 때만 그려지는데, 메시지가 있는데도 왜 기다렸을까요.

두 가지가 겹쳐 있었어요. 하나는 공지 정보를 서버에 한 번 더 물어보고 나서야 화면을 여는 옛 규칙 — 공지 배너가 메시지를 밀어내던 시절의 잔재였어요. 다른 하나는 "즉시 보여줘도 된다"고 주석에 적어 두고 정작 1.5초짜리 타이머를 걸어 둔 코드였고요. 둘 다 걷어내고, 마지막으로 봤던 대화를 먼저 보여준 뒤 새 메시지를 뒤이어 채우는 방식으로 바꿨어요. 저희 화면 녹화 기준으로 2.0초가 0.6초가 됐습니다. 개발용 빌드에서 잰 숫자라 실제 기기에서는 조금 다를 수 있어요 — 그래도 방향은 분명해요.

답장 방향을 바꿨어요

이건 며칠 손이 헤맬 수 있어서 미리 말씀드려요. 메시지를 밀어서 답장하는 제스처가 왼쪽→오른쪽에서 오른쪽→왼쪽으로 바뀌었어요.

이유는 하나예요. 왼쪽에서 오른쪽으로 미는 건 이제 앱 어디서나 뒤로 가기예요. 같은 방향에 두 가지 뜻을 두면 답장하려다 방을 나가고, 나가려다 답장이 열려요. 그래서 답장은 반대쪽으로 옮겼어요. 카카오톡과 같은 방향이라 익숙한 분이 더 많을 거라고 생각했고요. 그리고 밀 수 있는 영역이 말풍선 폭까지만이던 것을 행 전체로 넓혔어요 — 짧은 메시지는 밀 데가 없어서 답답했거든요.

출시 당일, 두 번 고쳤어요

솔직하게 적을게요. 1.4.43을 내보낸 날 두 가지 문제가 보고됐고, 그날 안에 두 번 고쳐서 내보냈어요.

첫 번째는 파일 선택창이 안 열리는 문제였어요. 첨부 메뉴에서 [파일]을 누르면 메뉴는 닫히는데 파일 선택창이 나타나지 않았죠. 원인은 순서였어요. 메뉴가 닫히는 애니메이션이 끝났을 때 저희는 "이제 닫혔다"고 판단하고 선택창을 열었는데, 화면 뒤에서는 아직 닫히는 중이었어요. 그 짧은 틈에 열린 선택창은 조용히 사라졌고요. 이제는 진짜로 닫힌 뒤에 열어요.

두 번째는 협업 채팅방의 사용자 정보 카드가 스크롤되지 않는 문제였어요. 카드 전체를 "바깥을 누르면 닫히는" 영역으로 감쌌더니, 그 영역이 손가락 움직임을 먼저 가져가서 카드 안 목록이 밀리지 않았어요. 닫는 영역을 카드 바깥으로 빼서 해결했어요.

둘 다 앱을 다시 설치할 필요 없이 조용히 적용됐어요. 앱을 완전히 닫았다가 다시 열면 반영돼요. 백그라운드에서 돌아오는 것만으로는 적용되지 않아요.

마무리

화면이 예뻐지는 건 좋은 일이지만, 그것만으로는 업데이트할 이유가 안 된다고 생각해요. 이번 버전은 예뻐진 만큼 빨라졌고, 제스처가 한 방향에 한 가지 뜻만 갖게 됐어요. 그리고 카드에서 바로 통화를 걸고 이메일을 보내는 것처럼, 화면을 오가지 않아도 되는 일이 몇 가지 늘었어요. 바뀐 목록은 업데이트 노트에, 쓰는 법은 사용자 가이드에 정리했어요.

늘 그렇듯, 불편한 게 있으면 알려 주세요. 유리는 깨지기 전에 고쳐야 하니까요.