[뒤끝팁] 인 게임 채팅 더 잘 구현하는 법 : 유저 데이터를 활용하자!

?‍♀️?‍♂️ : 안녕하세요.. 뉴비인데요.. 이 아이템 좋은가요? 어떤 거 써야 돼요?

게임에 있어서 ‘채팅’은 빠질 수 없는 요소가 되었죠. 신규 유저는 채팅으로 질문을 하면서 게임을 더 즐길 수 있게 되고, 기존 유저는 대화를 하면서 게임에 더 빠져들게 됩니다.

오늘은 인 게임 채팅을 더 풍부하게 만들어주는 ✌두 가지 팁을 공유드립니다.

현재 뒤끝챗은 닉네임과 메시지 두 가지 기능을 지원하고 있어요.

그리고 지금부터 이어지는 방법들을 활용하면 ①랭킹 추가②길드명 추가, ③프로필 사진 추가까지
구현할 수 있답니다.

그럼, 바로 알아볼까요?


첫 번째 Tip. 닉네임 옆에 랭킹을 붙여보자! – [1위] 김뒤끝

냥밴드키우기 게임의 인게임 채팅
랭킹이 있는 〈냥밴드 키우기〉 인 게임 채팅

방법은 아주 간단합니다. 유저가 채팅을 입력할 때, 해당 유저의 정보도 함께 내보내 주면 되는 거죠.

로직은 다음과 같습니다.

① 게임 시작 시, 유저 랭킹 불러오기
② 위 랭킹을 변수에 저장하기
③ 채팅을 내보낼 때 붙여서, 메시지와 함께 내보내기

string myRank = "-";

void Start()
{
  var bro = Backend.URank.User.GetMyRank("rankUUID");
  if(bro.IsSuccess())
  {
    myRank = bro.FlattenRows()[0]["rank"].ToString();
  }
}

//채팅을 보내는 함수
void SendChat(string msg)
{
   string sendMessage = string.Format("[{0}위] {1}", myRank,msg);
   Backend.Chat.ChatToChannel(ChannelType.Public, sendMessage);
}

어떤가요? 정말 간단합니다?

랭킹 이외에, 아래와 같이 길드 이름이나 게임 데이터의 칭호 등도 얼마든지 함께 붙일 수 있습니다. 소개드린 로직을 활용하여, 아래 예시와 같이 개발자님이 원하시는 형태로 응용해 주세요?

포레스트 캠프의 인게임 채팅 화면
(예시1) 칭호가 보이는 〈포레스트 캠프〉 인 게임 채팅
아테네 키우기의 인게임 채팅 화면
(예시2) 길드명이 보이는 〈아테네 키우기〉 인 게임 채팅

두 번째 Tip. 닉네임 옆에 유저 정보 버튼을 붙여보자!

?? : 저는 채팅에 랭킹, 길드, 칭호, 프로필까지 전부 다 나오면 좋겠는데. 안되나요?

채팅창에 이 정보를 모두 넣는 것은 쉽지 않습니다.

대신에 아래 이미지 처럼, 유저의 이름이나 프로필 이미지 혹은 특정 버튼을 클릭하면 해당 유저의 데이터가 보이는 방식을 활용할 수 있습니다.

크아M의 인게임 채팅 - 상세 프로필
프로필을 클릭하면 상세 정보가 나오는 〈크아M〉 인 게임 채팅

위 기능을 구현하는 가장 직관적인 방법은 해당 유저의 데이터를 검색하여 데이터를 불러오는 것이에요.

먼저 채팅의 닉네임을 이용해 유저 정보를 조회하고, inDate를 얻습니다. 그리고 게임 정보 관리 검색을 통해 데이터를 찾아 불러오는 작업이 필요합니다.

그렇지만 이렇게 되면, 유저가 메시지를 보낼 때마다 유저의 닉네임을 검색하는 함수를 호출해야
합니다. 지나치게 번거롭다는 단점이 있죠.

?
그래서 이번에는 메시지에 유저의 owner_inDate를 붙여서, 유저 정보를 조회하지 않고 
바로 게임 정보를 불러올 수 있게끔 구현해 보겠습니다. 

다만 랭킹 정보(ex. [1위] 김뒤끝)와 달리, owner_inDate는 채팅 상에 노출되지 않아야 하기 
때문에 숨겨서 보내도록 해야 합니다.
인게임 채팅 화면의 구성
인 게임 채팅 화면 구성 (예시)

위 이미지는 인 게임 채팅의 화면 구성을 재현한 이미지인데요.

이미지 상에 붉은 글씨로 제시된 네 가지 변수(InfoButton, nickname, msg, ChatItem)와 아래 로직
들을 매치해 보시면 이해하시기 좋습니다.

아래 로직을 참고하여 개발자님의 게임에 맞는 로직을 작성해 보세요!

◼ 채팅 한 줄을 구현하는 ChatItem 객체

// 채팅 한 줄
public class ChatItem
{
  public string nickname;
  public string userInDate;
  public string msg;
  public Button InfoButton;
	
  //생성자
	public ChatItem(string _nickname, string _userInDate, string _msg)
  {
     nickname = _nickname;
		 userInDate = _userInDate;
     msg = _msg;
     //버튼 등록
     InfoButton.onClick.AddListener(() => {ClickUserInfoButton()});
  }

  // 클릭시 해당 유저의 정보를 찾음
  void ClickUserInfoButton()
  {
    Where where = new Where();
    where.Equal("owner_inDate", userInDate);
    SendQueue.Enqueue(Backend.GameData.Get, "tableName(profile)" where, callback => {
			 OpenUserInfoPanel(callback);
	     });
  }
}

◼ 버튼을 클릭했을 때, 프로필을 보여주는 함수


void OpenUserInfoPanel(BackendReturnObject callback)
{
  if(callback.IsSuccess())
  {
			if(callback.FlattenRows().Count > 0)
      {
         // 프로필에 등록된 이름, 레벨, 소개내용등 불러오기
         string name = callback.FlattenRows()[0]["nickName"].ToString();
         string level = callback.FlattenRows()[0]["level"].ToString();
         string introduction = callback.FlattenRows()[0]["introduction"].ToString();
				 
         //유저 정보를 가진 프로필 UI를 만들어주는 함수
         //해당 예제에서는 구현되지 않았습니다.
         SetActiveUserInfoPanel(name, level, introduction);
      }
  }
}

◼ 채팅 보내는 함수 & 채팅 받는 핸들러


//채팅을 보내는 함수
void SendChat(string msg)
{
   string owner_inDate = Backend.UserInDate;
   //사이에 ||이라는 분별값을 더해줌
   string sendMessage = owner_inDate + "||" + msg;
   Backend.Chat.ChatToChannel(ChannelType.Public, sendMessage);
}

void SetHandler()
{
  //채팅을 받는 함수
  Backend.Chat.OnChat = (ChatEventArgs args) =>
  {
     string messsage = args.Message;
     //분별값 ||로 메세지를 나눔
     string[] tempMessage = message.Split("||");
     string userIndate = tempMessage[0];
     string msg = tempMessage[1];
     
     ChatItem chat = new ChatItem(args.From.NickName, userIndate, msg);
  }
}

여기까지, 클릭하면 해당 유저의 정보를 볼 수 있는 함수를 만들어 보았습니다.

위 이미지 상의 [프로필] 버튼은 ①프로필 사진이나 ②닉네임으로 대체할 수 있으니, 개발자님의 게임에 맞는 형태의 채팅을 구현해 보세요!

그리고 궁금한 점은 언제든지 댓글로 남겨 주시기 바랍니다?

1

댓글