brunch

[5분 UI/UX]
작성일은 어떻게 표시하나요?

by 서점직원

우리가 그동안 커뮤니티 서비스를 이용하며 무심코 지나쳤던 작성일 표시.

작성일 표시방법은 과거부터 현재까지 크게 변하지 않은 것 같지만 실은 UI/UX 발전에 따라, 시대에 맞춰 작성일 표시 방법도 함께 변화되는 양상을 보여왔다.


이번글은 작성일 표시 방법의 역사와 UI/UX 발전에 따라 작성일 표시방법이 어떻게 변해왔는지 되짚어 보는 작성일 표시방법의 역사와 변천사이다.




작성일 표시는 언제부터 시작된 걸까?


초창기 인터넷 유저들은 BBS(Bulletin Board System)라 불리는 사설 통신망을 개설하고 그 안에서 정보를 교환했다. 이것이 발전하여 하이텔, 천리안, 나우누리 같은 PC통신이 되었고 WWW 발전에 따라 PC 통신이 디씨 인사이드와 같은 게시판 형태의 커뮤니티로 진화했다.


자료출처 : https://namu.wiki/w/PC%ED%86%B5%EC%8B%A0

PC 통신 시절의 UI를 살펴보면 모습은 투박하지만 기본적인 프레임은 현재 커뮤니티 게시판 형태와 유사한 모습을 보인다. 게시판은 List-View 구조이고 글번호, 작성자, 작성일, 조회수, 글제목을 하단부터 내림차순으로 표시한다. 작성일이라는 개념이 처음 등장한 것도 이 시기인데 이때는 MM-DD로 작성일을 표시했다. PC 통신은 요즘 커뮤니티와 달리 이용자도 적었고 소수 마니아들을 위한 놀이터 같은 성격이었다. 이용자도 적고 통신요금도 비싸 하루에 올라오는 글 개수가 많지 않다 보니 년월일만 표시해도 게시글을 구분하는데 큰 문제가 없었던 것이다.



WWW 시대가 도래하며 각종 커뮤니티 서비스들이 등장했고 (대표적인 것이 디씨인사이드) 이용자가 폭발적으로 증가하며 커뮤니티 서비스가 대중화되었지만 작성일 표시방법은 크게 달라지지 않았다. 게시판 UI가 BBS UI를 계승한 형태였고 게시판 목록 페이지에 MM-DD만 표시해도 사용자들이 게시글을 구분하는데 큰 문제가 없었기 때문이다. 서비스별로 목록페이지에서 작성일을 YY-MM-DD로 표시하냐 MM-DD로 표시하냐 정도의 차이만 있었을 뿐 작성글 표시방식은 큰 변화 없이 MM-DD 형식을 유지해 왔다.


PC와 모바일 화면의 리스트 페이지 UI 비교


작성일 표시방식에 변화의 바람이 불기 시작한 건 모바일과 SNS 등장 이후부터다. 데스크톱이 주류이던 시절에는 해상도가 크고 가로폭이 넓어 글번호, 제목, 작성자, 작성일, 조회수를 한 줄에 모두 표시해도 문제가 없었다. 그런데 모바일 시대가 도래하며 가로폭 360px에 PC에서 노출하던 정보를 모두 노출하려다 보니 공간의 제약이 발생하기 시작했다. 변화된 디바이스 환경에 맞춰 게시판 목록 UI와 작성일 표시 방식에도 변화가 필요한 시점이 도래한 것이다.




모바일의 등장과 작성일 표시방식의 변화


PC보다 가로폭이 좁은 모바일 디바이스에서 게시물 정보를 표시하기 위해 다양한 아이디어가 등장하기 시작한 것이 이때쯤이다. 처음에는 PC처럼 한 줄에 모든 정보를 표시하기 위해 폰트 크기를 줄이고 꼭 필요한 정보(번호, 제목, 작성자, 등록일)를 한 줄에 노출하는 형태의 UI가 시도되었으나 대중화에는 실패했다. 한 줄 표시 방식이 공간의 협소함과 낮은 가독성으로 한계를 보이자 몇몇 디자이너들이 두줄 표시 방식 UI를 선보이기 시작했는데 상대적으로 여유로운 공간, 적당한 가독성을 가진 두줄 표시 UI는 기존 문제점을 해결할 수 있는 유력한 대안으로 급부상하기 시작했다. 많은 서비스들이 두줄 UI를 적용하기 시작했고 지금까지 두줄 UI는 게시판 목록 페이지의 바이블이자 교과서처럼 많은 서비스에서 사용되고 있다.


ui_ux_41.png 한 줄 표시방식과 두줄 표시방식의 UI 비교

그런데 두줄로 정보를 표시하면 목록 페이지를 탐색하는 방식이 달라질 수밖에 없다. 한 줄 표시 방식은 수직적 비교가 가능해 정보를 탐색할 때 위에서 아래로 게시물 제목이나 작성일을 보면서 원하는 게시물을 찾는 것이 가능하다.


1) 관심 있는 글을 찾을 때

- 게시물 제목을 위에서 아래로 훑어보며 글을 탐색

2) 오늘 올라온 글을 찾을 때

- 등록일을 위에서 아래로 훑으며 오늘 등록된 글을 확인 후 게시물 제목을



반면 두줄 UI는 정보를 왼쪽에서 오른쪽으로 탐색한다. 한 줄 UI가 수직적 탐색 구조라면 두줄 UI는 수평 탐색 구조사용자가 정보를 탐색하는 방식이 달라지는 것이다.


두줄과 한 줄 UI의 글 탐색 방식 비교


여기까지 글을 읽은 분 중 이런 생각을 하시는 분이 있을 거다.


그래 모바일이 등장하며 한 줄 UI에서 두줄 UI로 바뀐 것은 알겠어.
근데 그게 작성일과 무슨 연관이 있는 건데?

놀랍게도 아주 큰 연관이 있다. 다시 두줄 UI로 돌아가보자.


한 줄 UI에서 두줄 UI로 레이아웃이 바뀌며 생긴 가장 큰 변화는 테이블 구조의 탈피다.

기존 한 줄 UI는 테이블 구조였지만 두줄 UI는 카드뷰 형태로 UI가 구성된다. 카드뷰 UI에서는 상단 구분값을 사용하지 않는다.


원래 상단 구분값은 데이터가 어떤 항목인지 설명하고 인지를 돕기 위한 목적으로 사용된다. 상단 구분 값을 없애려면 사용자가 구분값 없이도 어떤 항목인지 충분히 인지할 수 있도록 데이터 형식이 달라야 한다.


ui_ux_42.png 통계 데이터와 게시판의 데이터 형식 비교

숫자만으로 이루어진 통계 데이터라고 가정해 보자. 통계 데이터는 구분값이 없으면 어떤 값인지 명확히 인지하기 어렵다. 게시판은 데이터 유형이 다르기 때문에 구분값 없이도 사용자 인지가 용이한 형태다.


한 줄 테이블 구조에서 두줄 카드뷰로 UI가 변경됨에 따라 작성일 표시 방법에도 두 가지 변화가 생겼는데


1) 구분값이 없어지고 수직 비교가 어려워지며 작성일을 연속된 데이터가 아닌 개별 데이터로 인식
2) 작성일을 표시할 수 있는 영역이 넓어지며 다양한 형태로 작성일 표시가 가능 (년월일)


d1.png 이미지 출처 : 디씨인사이드 허언증 갤러리

두줄 UI가 대중화되고 많은 서비스들이 YYYY.MM.DD 형태로 작성일을 표시하기 시작했다. 그리고 또 한 번 작성일 표시방식의 변화를 가져올 새로운 서비스가 등장했는데 그것이 바로...




개인화 알고리즘과 SNS 서비스의 등장


사실 커뮤니티 서비스에는 커뮤니티를 관리하고 운영하는 사람이라면 한 번쯤 고민해 본 문제가 하나 있었다. 커뮤니티는 게시글이 작성된 순서, 그러니까 작성일 최신순으로 게시물을 표시하는데 이런 정렬 방식은 같은 글이라도 글이 등록된 시간에 따라 반응과 조회수가 갈리는 경우가 있다. 글이 많이 등록되는 시간에 글을 올리면 게시판 첫 페이지에 노출되는 시간이 짧아지니 아무리 좋은 글이라도 게시글의 홍수 속에서 묻히는 경우가 생기는 것이다. 좋은 글의 노출 빈도를 늘려 높은 조회수와 반응을 이끌어 낼 수 있는 방법은 없을까? 이게 커뮤니티 서비스를 운영하는 사람들의 오랜 고민 중 하나였다.


개인화와 큐레이션은 이런 고민의 좋은 해결책 중 하나였다. 나의 활동 기반으로 내가 관심 있을만한 게시물을 노출하니 좋은 글이라면 등록 시기와 관계없이 노출 빈도가 높아질 수 있는 환경이 조성된 것이다. 개인화 알고리즘이 등장하며 작성일 표시 방식에도 변화가 생겼다. 첫 페이지 노출 기준이 작성일에서 정확도로 바뀌며 작성일의 중요도가 떨어지다 보니 작성일을 표시할 때 년월일 시분을 모두 표시할 필요가 없어진 것이다. 사람들에게 중요한 것은 언제 작성되었느냐가 아니라 글의 내용이니까.


이때쯤 서비스를 만드는 사람들은 이런 생각을 했던 것 같다.

'어차피 작성일이 중요하지 않은데 꼭 시분을 명확하게 표시할 필요가 있나? 러프하게 시간대 정도만 표시해 줘도 되지 않을까?'


d2.png 현재 기준으로 작성시점을 표시하는 작성일 표시 방식 (이미지 출처 : 블라인드)

이때부터 날자나 시간 대신 현재 기준으로 러프하게 작성시점을 표시하는 서비스가 등장하기 시작했다. [방금] [1분전] [1시간전] [1일전] [1주전] [1개월전] [1년전] 같이 현재 기준으로 얼마나 경과된 게시물인지를 표시하는 것이다. SNS 처음 시작된 작성시점 표시 방식은 이후 커뮤니티 서비스로 확산되며 이제는 많은 서비스에서 흔히 찾아볼 수 있는 보편적인 작성일 표시 방식으로 자리 잡았다.




커뮤니티 성격에 따라 작성일 표시방법은 어떻게 달라질까?


커뮤니티 서비스에서 작성일을 표시하는 방법은 크게 두 가지로 구분된다.


1) 오늘 작성한 글은 작성 시간을 표시 (24시간제) / 이전 글은 작성 일자를 표시

2) 1분전 / 1시간전 / 1일전 등으로 글 작성 일자를 특정 단위로 쪼개서 표시


많은 커뮤니티 서비스들이 2번과 같이 현재 기준으로 작성시점을 표시하는 작성일 표시 방식을 사용하지만 여전히 작성일과 시:분을 표시하는 커뮤니티 서비스들도 존재한다. 왜? 어떤 차이가 있길래 어디는 작성 시점을 표시하고 어디는 작성일을 표시할까?


작성일 표시방법의 차이를 결정하는 것은 바로 서비스가 다루는 콘텐츠의 성격이다.

서비스 특성상 콘텐츠를 올린 시점이 중요하고 등록일 최신순으로 콘텐츠를 표시하는 서비스는 작성일을 표시하지만 시점보다는 글의 내용이 중요하고 정확도순으로 콘텐츠를 표시하는 서비스는 작성시점을 표시한다.


d3.png


네이버 카페나 디시인사이드처럼 많은 글들이 올라오고 작성 순서대로 글이 표시되는 커뮤니티 서비스는 글의 작성 시간을 명시적으로 표현하고 작성 순서대로 리스트페이지에서 표시하는 것이 일반적이다. 커뮤니티 특성상 최신 이슈와 같은 시의성 있는 소재를 다루는 경우가 많고 글의 리스폰율이 높기 때문에 글이 등록된 정확한 시간을 알려주는 게 중요할 수 있기 때문이다.


반대로 많은 콘텐츠가 올라오지 않고 리스트 페이지 노출 순서가 콘텐츠 작성순서가 아닌 알고리즘에 의한 추천 순인 피드방식 콘텐츠는 글 작성 시간을 특정 단위로 쪼개서 표시한다. 알고리즘에 따라 작성순서와 관계없이 추천/적합도에 따라 콘텐츠를 노출하니 콘텐츠 작성일, 시간보다 글의 내용이 중요하기 때문에 글 작성 시간을 대략적으로 뭉뚱그려서 표현하는 것이다.


d5.png


한 서비스 내에서 두 가지 방식을 병행해서 사용하기도 한다. 네이버 카페의 경우 글이 최신순으로 노출되는 카페 내 게시글은 시간과 작성일을 표시하지만 알고리즘에 의해 HOT 게시글을 표시하는 카페 메인페이지에서는 작성시점을 표시한다. 동일한 콘텐츠라도 어디에 노출되냐 어떤 방식으로 노출되냐에 따라 작성일 표시방법은 달라질 수 있는 것이다.





✔️ 핵심 3줄 요약


1️⃣ 작성일 표시 방식은 BBS 시절의 MM-DD 형식에서 시작되어 모바일 시대를 거치며 두줄 UI와 카드뷰 도입으로 YYYY.MM.DD 등 다양한 형태로 발전했다.

2️⃣ 개인화 알고리즘과 SNS의 등장으로 콘텐츠 노출 기준이 최신순에서 정확도순으로 바뀌며 '몇 분 전', '몇 일 전'처럼 상대적인 시간 표시가 대중화됐다.

3️⃣ 작성일 표시 방식은 콘텐츠 특성과 노출 방식에 따라 달라지며, 최신순 리스트는 명확한 시간 표기를, 추천순 피드는 상대적 시간 표기를 선호한다.


keyword
월요일 연재
이전 15화이커머스의 탑(Top) 버튼은 어떻게 다를까?