익숙하고 유연한 채팅 경험

안녕하세요? Eddy입니다.

이번에는 두 버전(1.4.40·1.4.41)을 한 번에 이야기하려고 해요. 목록으로 적으면 꽤 길지만, 만들면서 머릿속에 있던 문장은 하나였어요.

익숙한 건 그대로 두고, 답답한 것만 유연하게.

채팅은 하루에 수백 번 만지는 도구예요. 그래서 새로운 걸 얹는 것보다 이미 손에 익은 걸 흔들지 않는 것이 훨씬 어렵고, 또 훨씬 중요해요. 이번에 한 선택들을 적어볼게요.

코드블록을 «맨 아래»에서 «문단 사이»로

전에는 코드블록이 메시지의 맨 아래에만 붙었어요. 구현하기 쉬운 모양이었죠 — 본문 한 덩어리, 그 아래 코드 한 덩어리.

그런데 실제로 쓰다 보면 사람은 이렇게 말하거든요. "먼저 이 설정을 보세요" → 코드 → "그리고 여기 이 줄을 이렇게 바꾸면 돼요" → 코드. 이 순서를 지키려면 메시지를 서너 번 나눠 보내야 했어요. 한 이야기가 네 칸으로 쪼개지면 읽는 사람은 위아래를 오가며 다시 붙여 읽어야 해요.

그래서 커서 자리에서 문단을 쪼개 끼워 넣는 방식으로 바꿨어요. 쓰던 자리에 코드 상자가 들어가고, 한 메시지에 여러 개를 담을 수 있어요. 입력창은 겉보기엔 그대로인데 안에서는 «본문–코드–본문–코드»가 지퍼처럼 맞물려요.

여기서 은근히 오래 붙잡은 건 간격이었어요. 처음 만든 버전은 코드 상자 위아래가 답답하게 붙어 있었는데, 여백을 넉넉히 주니 이번엔 문단 하나하나가 카드처럼 떠 보이더라고요. 결국 «줄바꿈의 리듬»에 맞췄어요 — 코드블록 앞뒤 간격을 문단 사이 간격과 같게. 새 부품이 아니라 원래 거기 있던 것처럼 보이는 게 목표였어요.

언어 선택과 복사 버튼은 그다음에 붙였어요. 색을 입히려고 무거운 라이브러리를 새로 넣진 않았고, 첨부 파일 미리보기에 이미 쓰고 있던 하이라이터를 그대로 재사용했어요. 지원 언어를 26가지로 끊은 것도 같은 이유예요 — 이미 들고 있는 번들 안에서만 고르면 앱이 무거워지지 않으니까요. 안 쓰는 100가지보다, 가벼운 26가지가 낫다고 봤어요.

이모지 — «등록»과 «사용»을 가른 이유

이모지는 재미있는 기능인데, 만들다 보면 의외로 계산이 필요해요.

팩을 열어 주기 시작하면 조직 하나가 수백 개를 담을 수 있게 돼요. 그러면 입력창의 자동완성에 비슷한 이름이 우수수 뜨고, 피커는 스크롤이 끝나지 않아요. 재미있으라고 넣은 게 오히려 방해가 되는 거죠.

그래서 보관과 사용을 갈랐어요. 등록은 넉넉하게, 지금 쓰는 건 «활성 슬롯»만큼만(무료 10개·Pro 50개). 팩도 조직당 3개까지만 켜져요. 창고는 넓게 두되 책상 위는 정돈하는 방식이에요. 안 쓰는 걸 내리면 자리가 다시 생기니까 잃는 것도 없고요.

점보모지는 아주 작은 기능인데 좋아하는 사람이 많아요. 규칙은 단순해요 — 이모지만 담고 10개 이하면 크게 보여요. 글자가 한 자라도 섞이면 평소 크기로 돌아옵니다. "네 👍" 는 평소 크기, "👍" 는 크게. 이 경계를 어디에 둘지가 은근히 취향 싸움이었는데, 결국 다른 메신저들과 같은 결로 맞췄어요. 여기서만 다르게 굴 이유가 없더라고요.

이름을 누르면 열리는 카드, 그리고 정색하는 자리

프로필 카드는 이번에 통째로 다시 만들었어요. 전에는 어디를 누르느냐에 따라 다른 카드가 열렸어요. 아바타를 누를 때, 멘션 태그를 누를 때, 참여자 목록에서 누를 때 — 각각 다른 화면이 나왔죠. 만든 사람 입장에선 "그때그때 필요한 걸 만들었을 뿐"인데, 쓰는 사람 입장에선 그냥 일관성이 없는 거예요.

그래서 카드를 세 종류로 정리하고, 어디서 누르든 같은 판정을 거치게 했어요. 팀 대화에서는 프로필, 협업 대화에서는 고객 정보가 나란히, 상대가 비즈니스 프로필로 대화 중이면 회사 소개 카드.

여기부터는 정색하고 씁니다. 카드를 여는 입구가 여러 개라는 건, «누구에게 무엇을 보여줄지» 판정하는 자리도 여러 개라는 뜻이에요. 그중 하나라도 빠뜨리면 비즈니스 프로필로 가려 둔 개인 정보가 그 입구에서만 새어 나가요. 실제로 이번에 태그를 눌러 여는 경로에서 그 판정이 빠져 있는 걸 발견했고 — 그래서 카드를 여는 모든 입구를 한 함수로 모았어요. 판정은 한 군데에만 있어야 새지 않습니다. 이건 편의를 위한 리팩터링이 아니라 안전을 위한 구조예요.

카드 배경과 영업시간처럼 «꾸미는» 기능은 그 위에 올렸어요. 영업 중/종료 배지는 보는 사람의 시각으로 계산해요. 서울에서 만든 배지를 다른 시간대의 고객이 볼 수도 있으니까요.

방 183개를 합치던 날

이번에 가장 조심스러웠던 건 이메일 방 정리였어요.

이메일 연동 초기에는 «메일 대화 한 건 = 방 하나»로 만들었어요. 처음엔 깔끔해 보였는데, 같은 고객과 메일을 다섯 번 주고받으면 방이 다섯 개가 되더라고요. 목록에 같은 이름이 다섯 줄. 어느 방에 답장해야 하는지도 헷갈리고요. 게다가 «30일이 지나면 만료»라는 규칙까지 있어서, 이어서 이야기하려면 새 방이 또 생겼어요.

그래서 한 주소 = 한 방으로 바꿨어요. 문제는 이미 흩어져 있던 방들이었죠. 새 규칙만 적용하면 과거는 흩어진 채로 남으니까요.

합치는 코드는 어렵지 않았어요. 어려운 건 메시지를 한 통도 잃지 않는 것이었어요. 그래서 세 가지를 지켰어요.

1. 먼저 옮기고, 나중에 지운다. 메시지를 살아남을 방으로 전부 옮긴 뒤에야 빈 방을 정리해요. 순서가 반대면 사고예요.
2. 전부 아니면 전무. 전체를 하나의 트랜잭션으로 묶었어요. 중간에 무엇이 잘못되면 아무것도 바뀌지 않은 상태로 되돌아와요.
3. 하기 전에 똑같이 해 본다. 실제 데이터로 «전부 다 실행하고 마지막에 되돌리는» 예행을 먼저 돌렸어요. 읽기 전용 계산기를 따로 만들지 않은 건 의도예요 — 계획을 세우는 코드와 실행하는 코드가 다르면, 계획이 맞았다는 보장이 없거든요.

예행에서 나온 숫자와 실제 숫자가 같은 걸 확인하고 나서야 마음을 놓았어요. 방 183개가 33명의 대화로 접혔고, 메시지 수는 정확히 맞았어요. 줄어든 건 «세션이 만료되었습니다»라고 적혀 있던 안내 메시지 12개뿐이었고요 — 그건 이제 존재하지 않는 개념이라 지우는 게 맞았어요.

혹시 목록에서 이메일 방이 줄어든 것처럼 보이더라도 걱정하지 마세요. 합쳐진 것이지 사라진 게 아닙니다.

그리고, 티 안 나는 것들

• 목록의 섹션을 끌어서 정렬하고 접을 수 있게 했어요. 이건 «나에게만» 적용돼요 — 내 화면을 정리했다고 동료 화면이 바뀌면 곤란하니까요.
• 보고 있는 스레드에 답글이 오면 바로 읽음 처리돼요. 눈앞에 두고 «새 글» 표시가 뜨는 건 알림의 신뢰를 깎는 일이에요.
• 귓속말이 마지막 메시지인 방에서 목록 미리보기가 비어 보이던 문제를 고쳤어요. 원인은 «내가 그 방에서 어느 워크스페이스로 참여했는가»를 한 갈래만 보고 있었던 거였어요.
• 지운 메시지는 이제 본문까지 실제로 지워져요. 화면에 안 보인다고 지워진 게 아니라는 걸, 뒤늦게 확인하고 바로 고쳤습니다.
• 본문 길이 상한을 2,500자로 넓혔어요. 다만 고객에게 나가는 이메일 답장은 메일 규격에 맞춰 1,000자 그대로예요. 우리 화면에서 되는 게 상대 메일함에서 잘리면 그건 «되는 게 아니»니까요.

마치며

이번 두 버전에서 새로 배운 게 하나 있어요. 사용자가 "편해졌다"고 느끼는 순간은 대개 새 버튼을 발견했을 때가 아니라, 원래 하던 걸 한 번 덜 했을 때더라고요. 메시지를 네 번 나눠 보내지 않아도 될 때, 같은 이름의 방 다섯 개 중 하나를 고르지 않아도 될 때요.

다음에도 그 방향으로 갈게요. 언제나처럼, 불편한 게 있으면 알려 주세요.