B(ridge)LOG가 세상 밖에 나오는, 그 첫걸음 👣🚀

 
유닛 코드 : PXE-103, 필수형
[실무 기획]디테일의 확충 : 이 기획은 어떻게 현실화 되는가? 

 

안녕하세요!
 
벌써 유닛3 디테일의 확충 단계에 진입했어요..
사실 주차를 거듭할수록 이 기획안을 현실 가능한 레벨로 끌어올리기 위해 고민은 계속해서 깊어지는 것 같은데요.
그때마다 크루분들이 주시는 피드백이 정말 크나큰 도움이 된답니다 :)
 
지난주 받은 피드백은 크게
1️⃣ 부업 이용자와 일반 이용자의 유저 플로우를 나눠서 생각해보고, 본 기획이 UX 향상 측면에서 두 집단에 어떤 기여를 할 수 있을지 생각해볼 것
2️⃣ 체류시간을 높이는 취지에서의 본 기획이 고객사인 네이버 블로그에게 어떤 효용이 있을지 구체적으로 생각해볼 것
3️⃣ AI 주제 분류가 수동 주제 지정보다 더 좋은 대안이 되기 위해 로직 설계가 보충되어야 한다는 것
이었습니다.
 
세 개 모두 기획안의 완성도와 논리를 확보하기 위해 꼭 짚고 넘어가야 할 부분이라는 생각이 듭니다. 그만큼 하나하나의 비중이 꽤 클 것 같은데요!
 
그래서 이번 유닛은 총 두 차례✌️에 나눠서 진행을 하려고 합니다. 우선 이번주에는 추천탭 재구성이라는 제 기획의 근간이 되는 로직 설계에 대한 부분과 이를 화면에 표현한 화면 설계를 위주로 다룰 예정입니다. 그리고 다음 기획안에서 이 기획의 홍보 방안을 비롯하여 그동안의 내용을 총망라하고 요약하는 시간을 가지려고 합니다.

---

 
그럼 저번주에 다뤘던 기획 Block Tree를 먼저 살펴볼까요?

 
 
Block Tree는 크게 기획의 근간이 되는 로직을 설계(TB01)하는 부분, 로직을 화면에 직접 구현(TB02)하는 부분, 그리고 본 기획을 대외적으로 홍보(TB03)하는 부분으로 나뉩니다.
 
이번 기획안에서는 TB01과 TB02의 A/B테스트까지 다뤄 보려고 합니다. 두 블록은 줄글로 제시했던 솔루션이 구체화되는 것이므로 기획안의 핵심이라고 할 수 있습니다 :)
 
 

STEP 01 .   내 기획 내용을 디테일하게 설정하자 ! : 블록트리 세부 '전술' 채우기 (Towarding)

 

TB01. 추천 로직 설계

UB1.1: AI주제 자동지정

 

(좌) 블로그 주제 목록 (우) AI 주제 분류 로직 도식화

 
 

① 기능 도입의 취지

AI 주제 자동 분류 기능은 관심사 기반 글 추천(=관심사로 설정한 주제의 글 추천)의 정확도와 신뢰도를 높이기 위해 발행되는 글 주제 분류 기준을 통일하는 것을 목표로 하며 정교한 추천 알고리즘 구축에 선제적으로 필요한 기능이라 전제한다.

 
② 활용 모델

AI 주제 자동 분류를 위해 키워드 기반 필터링과 LLM이 결합된 모델이 활용된다.
이는 키워드로 중분류를 신속히 결정하여 LLM의 계산 리소스를 효율적으로 사용하고, 초기 필터링과 LLM의 문맥 이해 능력을 조합하여 주제 분류의 정확도를 높이기 위함이다. 

 
③ 로직

사용자가 글 발행을 마치면, 모델은 우선적으로 중분류에 해당하는 키워드를 감지한다.
글 전체 분량 대비 5~10%의 비중으로 중분류 키워드가 감지되면 모델은 LLM에 중분류 정보들을 보낸다.
이후 그 중분류 하위에 있는 세부주제를 LLM이 글의 맥락을 고려하여 추가분석하고 주제 분류 결과를 출력한다. 이때의 주제 분류 결과는 세부주제명과 동일하다.

 
④ 제한사항

글의 내용과 어울리지 않는 주제 지정은 이 기능의 취지를 저해하는 요소라고 판단, 출력되는 주제의 정확도에 제한을 둔다. 분류 결과 정확도가 60%이상인 주제에 한해 주제 태그를 출력하고 이 경우에도 정확도가 75%이상인 것과 60~75% 이내인 것을 UI상에 차이를 두어 표현한다.

 
⑤ 유저 플로우

주제 분류 이후 사용자가 확인하여 직접 선택·수정 가능하도록 하며, 정확도가 60% 미만일 경우 사용자에게 주제 지정을 권유하는 토스트메시지를 별도로 출력하여 주제 지정을 유도할 수 있도록 한다. 

 

UB1.2~3: 관심사 기반 추천 + 이웃의 이웃글 추천

 

UB1.2와 UB1.3은 로직의 목표에서는 차이가 있지만, 결국 추천탭 글 구성의 알고리즘을 구축하는 로직이라는 점에서 여기에서 함께 다룰 예정입니다. 다만, 추천 이웃을 판단하는 과정에서 나와 가까울 수록 가중치를 두어 강한 연결성을 띈 이웃을 추천하기 위해 구체화된 부분이 있어 추천 이웃 판단 로직을 간단하게 살펴보고 토워딩으로 넘어가보도록 합시다 🔥
 

📌 추천 이웃 판단 로직

1️⃣
사용자의 이웃 중 소통 빈도 및 수준(예: 이웃의 글에 좋아요, 또는 남긴 댓글의 수를 카운트)을 토대로 상위 5명을 추립니다.
이때 소통의 종류는 댓글, 좋아요, 글의 공유이며 그 전체 수가 "최근 6개월 이내 10회 이상인 이웃들"에 한해 상위 5명을 추립니다.
한편 5명 간의 순위는 소통 종류에 따라 가중치를 부여하고, 가장 최근의 소통이 이뤄진 시점별로 시간 가중치를 두어 정교하게 매깁니다. 

 
[소통 행동에 따른 가중치]

• 좋아요: 1점
• 댓글 작성 : 3점
• 공유 : 5점
  → 공유는 게시자와 게시글에 대해 보다 강력한 신호이며 행동에 시간과 노력이 더 수반된다는 점에서 가장 높은 가중치를 부여함

🔜 소통 점수 = (좋아요 횟수 × 1) + (댓글 수 × 3) + (공유 횟수 × 5)

 

[시간 가중치]

• 1주 이내: 100% 점수 반영
• 1개월 이내: 50% 점수 반영
• 3개월 이내: 25% 점수 반영
  → 시간이 지남에 따라 소통의 영향력이 감소하도록 설정하여, 최신 소통 관계를 우선시함

그리고 시간 가중치를 반영하여 최종 점수를 산출합니다.

🔜 최종 소통 점수 = 소통 점수 × 시간 가중치

 

2️⃣
그리고 상위 5명은 사용자와 가까운 이웃이라고 판단하여, 가까운 이웃들에 한해 그들의 가까운 이웃 판단을 진행합니다.
이때 나의 가까운 이웃의 가까운 이웃 산출은 1번 로직과 동일하지만 나의 가까운 이웃 판별시 최종 소통 점수가 높은 순으로 가중치를 다르게 하여 최종적으로 이웃의 이웃을 산정합니다.
예를 들어, 나의 가까운 이웃으로 판별된 사람이 A,B,C 순으로 최종 점수가 높다고 했을 때 A의 가까운 이웃의 경우에는 100% 가중치를, B의 가까운 이웃은 60%, C의 가까운 이웃은 40%의 가중치를 두는 식입니다. 

 

---

 
충분히 이해하셨을 것이라 짐작하고, 다시 토워딩으로 넘어가보도록 할게요!
(이해되지 않는 사항은 언제든 질문 환영입니다 ㅎ_ㅎ)
 

(좌) 추천 알고리즘 구성 요소 (우) 추천 알고리즘 도식화

 
① 기능 정의

관심사 기반 추천(UB1.2)과 이웃의 이웃글 추천(UB1.3)은 각각 관심사 추천과 연결망 확장이 주된 목표라는 점에서 분리되나 두 개의 로직 모두 추천탭에 글을 노출시키는 순서를 정의하는 알고리즘이기 때문에 여기서 함께 논의한다.

 
② 추천 알고리즘의 핵심과 구성요소

추천탭 글 추천 알고리즘의 핵심은 사용자가 읽을 만한 글을 노출시키는 것으로 사용자의 활동 내역과 다른 사용자(=이웃)과의 관계에 따라 개인화된 글을 추천해주는 것이다.
로직 구축에 필요한 요소는 게시자, 게시물 정보 / 소비자(=사용자) 활동 / 소비자 반응 내역이다. 즉, 사용자가 블로그 앱을 사용하며 누구와 자주 소통했으며, 또 누구의 어떤 글에 반응했는지에 주목한다.

 
③ 추천 이웃 로직

이웃의 이웃의 경우, 사용자와 소통 빈도가 높은 순으로 5명을 추리고 다시 그 이웃들과 소통 빈도가 높은 이웃 5명을 추려 최대 25명의 추천이웃의 공개글을 추천탭에 노출시킨다.
그리고 추천이웃의 글을 노출시킬 때에는 최종 소통 점수가 높은 순으로 출력하며, 이때 한 명의 추천 이웃의 글로만 추천탭이 구성되는 것을 막기 위하여 추천 이웃이 발행한 최근 1달 이내의 공개글을 최신순으로 노출한다. 만약 1달 이내의 공개글이 없다면, 차순위 추천 이웃의 공개글로 넘어간다.

 
④ 관심사 기반 추천 로직 

한편 이웃의 이웃 추천글 노출 여부는 선택 사항이며, 추천 이웃의 수가 최대 25명으로 제한이 있고 추천 이웃의 “전체공개”글을 노출시키기 때문에 경우에 따라서는 추천 이웃 또는 추천 이웃이 발행한 글이 존재하지 않을 수 있다.
이에 관심사 기반의 글을 추가로 노출시키며 이는 사용자가 신규가입시 지정한 관심사에 기반한 것으로, 모든 사용자에게 공통적으로 해당하는 사항이다.
관심사 기반 글 추천은 협업 필터링에 따르며, 동일 관심사를 가진 집단에서 반응도(좋아요,댓글,공유)가 높은 글을 차례로 노출시킨다. 

 
⑤ 추천탭 갱신

추천 이웃의 글의 경우, 추천 이웃 정보 및 업로드한 게시글 업데이트 여하에 따라 갱신될 수 있다.
관심사 기반 글 추천의 경우, 사용자의 반응에 따라 갱신된다. 즉, 사용자가 추천된 글을 지속적으로 조회하고 반응할수록 그 게시자의 글을 선호한다고 판단하여 지속적으로 노출시키는 것이다.
또한 그 게시글을 선호하는 집단에서 반응도가 높은 다른 게시자의 글도 노출하여 계속해서 추천탭을 개인화할 수 있도록 한다. 

 

TB02. 화면 설계

UB2.1: 화면설계

(1) 추천탭 화면

 
 
① 화면 설계의 핵심

추천탭 화면 설계는 UB1.2~3이 실제로 화면에 구현되는 것으로서, 추천탭에 추가되는 기능을 위주로 다룬다.

 
② 추천탭 기능 및 출력 방식

추천탭은 기본적으로 상단의 태그를 통해 필터링하여, 관심 주제 태그를 클릭하여 주제별로 추천된 글을 만날 수 있다.
디폴트인 블로그 추천 태그 활성화 상태에서 추천탭은 추천이웃의 글과 관심사 기반의 글이 혼합되어 노출되며, 이때 추천이웃의 글과 관심사 기반의 글은 간격을 두고 번갈아 노출된다.

 
③ 추천탭 화면 UI

관심사 기반의 글과 추천 이웃의 글은 태그로서 사용자가 직관적으로 확인할 수 있도록 하며, 관심사 기반의 경우 사용자가 설정한 관심사(=주제)가 태그에 출력되어 표현된다.

 
④ 사용성 증진

관심사는 기본적으로 사용자가 회원가입시 지정한 것이 추천탭에 반영되며, 업데이트된 추천탭에 최초 진입하였을 때 툴팁을 통해 관심사의 수정 및 추가 가능 여부를 안내하도록 한다.

 
⑤ 추천탭 필터링

관심사 지정 이후, 상단의 관심사 태그를 선택하면 해당 관심사의 글들만 모아볼 수 있다. 

 
 

(2) AI 주제 분류 화면 

AI주제 분류 성공시

AI주제 분류의 정확도가 60% 미만일 경우

 
 

① 화면 정의

AI 주제 분류 화면의 설계는 AI 모델이 사용자가 발행한 글을 사전에 마련된 분류 기준에 따라 분류하고, 그 결과를 사용자에게 알리는 방법을 중점적으로 다룬다.

 

② 기본값(Defalut)

현재 블로그 앱에서 주제 설정은 사용자 선택사항이지만, 본 기획에서는 AI 주제 분류 기능 활성화를 디폴트로 두어 주제 분류의 통일성을 높인다. 하지만 주제 분류 기능은 사용자가 on/off할 수 있으며, off한 경우에도 사용자가 수동으로 주제 지정을 할 수 있도록 한다. 

 

③ 정확도에 따른 태그구분

UB1.1의 로직에 따라 AI 분류 결과 정확도가 60% 이상인 경우에 한해 주제를 출력하며, 분류 정확도가 75% 이상일 경우 진한 색상으로 60~75% 정확도의 경우 회색조로 차등을 두어 시각적으로 정확도를 확인할 수 있도록 한다.

 

④ 분류 이후 사용자 메시지

주제 분류 결과는 기본적으로 글을 업로드한 게시자에게만 보이도록 하며, 업로드 이후 발행한 글을 클릭하면 주제 태그를 선택하여 수정할 수 있다는 스낵바를 확인할 수 있다.

 
⑤ 예외사항

한편, 주제 분류의 정확도가 60% 미만일 경우 발행 직후 사용자 블로그 화면에서, 토스트 메시지로 주제 분류를 실패했다는 것을 알리며 발행한 글 클릭시 사용자가 직접 주제를 지정할 것을 유도하는 스낵바를 출력한다.

 
 

UB2.2 :  A/B 테스트

 

🅰️ 이웃의 글 하단이 끝나는 영역에 추천탭 배너를 두어, 추천탭으로 전환 유도하기

 

🅱️ 이웃의 글 하단에 {추천탭에서 보기} 버튼을 두어, 클릭 시 추천탭으로 전환하기

 
 
① A/B 테스트 목적

본 기획을 통해 사용자에게 유도해야 하는 행동은 추천탭 클릭이다. 그렇기 때문에, 사용자 플로우 상에서 추천탭 전환을 유도할만한 UI를 구축하는 것은 매우 중요하다. 이에 A/B테스트를 진행하여 블로그 메인홈 > 이웃 글 조회 > 추천탭 전환의 플로우로 유도하기 위해 더 효과적인 UI는 무엇일지 확인하려고 한다.

 
② 현재 블로그 앱

현재 블로그 앱에서 이웃의 글이 끝나는 하단 영역에는 게시자 블로그의 인기글과 그 글의 카테고리에 발행되어 있는 다른 글들을 확인할 수 있다. 그리고 그 이후에 스크롤을 통해 추천글을 만나볼 수 있으나, 사용자의 관심사와는 무관한 글들이 랜덤으로 추천되어 사실상 유명무실하다 할 수 있다.

 
③ 추천 로직의 이웃 글 하단 영역에의 적용

따라서 UB1.2~3의 로직이 하단 영역에도 적용될 수 있도록 하며, 추천 이웃의 글과 관심사로 지정한 글들을 차례로 노출시킨다. 다만, 하단 영역에 노출되는 글의 수에는 제한이 있으므로 추천탭으로 전환하여 더 많은 글들을 확인할 수 있음을 알리려고 한다.

 
④ A/B테스트 항목

이에 2개의 UI를 통해 무엇이 그 전환에 더 효과적인지 실험하려고 하는데,

🅰️ 별도의 표지 없이 하단 영역을 UB1.2~3에 따른 로직의 글들을 노출시키고 하단 영역의 끝에 다다랐을 때 배너를 통해 추천탭 전환 버튼을 클릭하는 것을 유도한다.
🅱️ 추천 이웃의 글 섹션이 나오자마자 {추천탭에서 보기}버튼을 두어 버튼 클릭을 적극적으로 유도한다.

위 두 개가 그것이다.

 
⑤ 실행 계획

스크롤까지 포함된 프로토타입을 구현하여, 잠재 유저를 포함한 사용자 대상 A/B테스트를 진행하고 무엇이 추천탭으로의 전환에 더 효과적인지 판단할 수 있도록 한다.

 

STEP 02 .   내 기획 내용 중 무엇이 '더' 중요한가? : 블록트리 우선순위 정하기 (Prioritizing)

 

📍 [고객 제안용]

[1순위] TB02 화면설계: 사용자에게 즉각적으로 보여줄 수 있는 시각적 결과물이 중요하므로 화면설계가 최우선
[2순위] TB01 로직설계: 설계의 핵심 로직은 중요하지만, 사용자에게는 화면이 더 직관적이기 때문
[3순위] TB03 블로그 앱 재포지셔닝: 전략적인 논의가 필요하지만, 사용자 제안 시에는 상대적으로 긴급도가 낮음

 

📍 [실제 진행용]

[1순위] TB01 로직설계: 실제 구현 단계에서는 로직이 핵심 기반이므로 가장 먼저 설계해야 함
[2순위] TB02 화면설계 : 로직설계 완료 후 화면 구조를 빠르게 정리하여 구현을 병행할 준비를 하기 위해서
[3순위] TB03 블로그 앱 재포지셔닝: 로직과 화면설계가 완료된 후 전략적 방향성을 구체화하고 적용해도 프로젝트 진행에 큰 지장이 없기 때문
 

 
사용성 평가를 위한 두 메인 집단 사용자의 유저플로우 설계와
기획을 갈무리하는 STEP3는 다음 기획안에서 이어서 다뤄보도록 하겠습니다🎯

 

---

 
 
기획자로서 줄글로 적혀있던 로직과 화면을 실제로 도식화하고 UI를 구현한 이번 기획안이 본 기획을 한 단계 현실적이고 구체적으로 만들어주었다고 평가한다.
 
 

B(ridge)LOG가 세상 밖에 나오는, 그 첫걸음 👣🚀_끝.