---
title: 메신저 뷰 예제 — 옵시코 단톡방
view: messenger
tags: [예제, 메신저, 보기모드, 창작, 연출]
---

# 메신저 뷰 예제 — 노트가 단체 채팅방으로?!

> 이 노트는 프론트매터에 `view: messenger`가 들어 있어요. 상단 도구바의 **메신저 💬** 버튼을 눌러 재생해 보세요! 옵시코코·오브리스·김대표 **세 사람이 오가는 단톡방**이랍니다.

![[일상.mp3]]

<<사무실:사무실_낮.png>>

<<옵시코코:옵시코코.png|-->> 안녕하세요! 지금 이 화면이 바로 **메신저 뷰**에요 💬
<<옵시코코:옵시코코.png|-->> 프론트매터에 `view: messenger` 한 줄만 넣으면, 평범한 노트가 통째로 **단체 채팅방**이 된답니다.
<<옵시코코:옵시코코.png|-->> 왼쪽에 있는 저랑 오브리스는 이렇게 **아바타**랑 이름이 뜨죠?

<<오브리스:오브리스.png|-->> [10:13] 옙! 나도 왼쪽! 근데 대표님은 왜 아바타가 없어요?
<<김대표:김대표.png--|>> [10:14] 내가 이 방의 **'나(주인공)'**이니까. `--|`로 오른쪽에 놓인 사람은 아바타 없이 말풍선만 뜨거든.
<<오브리스:오브리스.png!점프|-->> [10:14] 오! 그래서 오른쪽이 대표님이었구나ㅎㅎ

<<옵시코코:옵시코코.png|-->> [10:15] 그리고 대사 앞에 `[10:15]`처럼 시간을 적으면 **보낸 시각**으로 표시돼요. 
<<오브리스:assets/오브리스_세피아.png|-->> 그건 좀 귀찮지 않아?
<<옵시코코:assets/옵시코코.png|-->>괜찮아. 안 적어도 스마트한 옵시코가 대충 만들어주니까!
<<오브리스:assets/오브리스_색반전.png|-->> 헐, 대박박! 역시 스마트 옵시코!
<<김대표:김대표.png--|>> 흠, 벌써 10시가 한참 넘었는데, 회의는 언제 시작해?
<<옵시코코:assets/옵시코코.png|-->> 기다려 주세요! 옵시코의 매력을 전부 보여 줄 시간이라고요!
<<김대표:assets/김대표.png--|>> 앗, 넵.

<<옵시코코:옵시코코.png|-->> [10:16] ![[사무실_낮.png]]
<<옵시코코:옵시코코.png|-->> [10:16] 이렇게 이미지를 대사 자리에 넣으면 **사진 말풍선**이 돼요!📷

<<오브리스:오브리스_색수차.png!흔들|-->> [10:16] 우와, 우리 사무실이네! 실물보다 잘 나왔다ㅋㅋ
<<김대표:김대표.png--|>> [10:17] 청소 좀 하지 그랬어... 뒤에 택배 상자 다 보이잖아.

---

# 음성 메시지와 감정 표현

<<옵시코코:옵시코코.png|-->> [10:20] 이번엔 **음성 메시지**를 보내 볼게요 오디오 파일을 그냥 대사 자리에 놓으면 음성 말풍선이 된답니다.
<<옵시코코:옵시코코.png|-->> [10:20] [[휘익.wav]]

<<오브리스:오브리스.png|-->> [10:21] 오 재생 버튼 뜬다! 눌러볼게… 
<<오브리스:오브리스.png!끄덕|-->> [10:21] 들려들려! `![[..]]`처럼 **임베드**하면 배경음악, 그냥 `[[..]]`로 넣으면 이렇게 음성 메시지야.

<<옵시코코:옵시코코.png|-->> [10:22] 맞아요. 그리고 이미지 뒤에 `!점프` `!흔들` `!끄덕`을 붙이면 말풍선이 콩! 하고 움직여요.
<<오브리스:오브리스.png!점프|-->> [10:22] 나도! 점프!!⤴️
<<김대표:김대표.png!흔들--|>> [10:22] 오른쪽 '나'는 아바타는 없지만 **말풍선 모션**은 똑같이 먹혀. 봐, 방금 흔들렸지?
<<옵시코코:옵시코코_반전.png!점프|-->> [10:23] 표정도 바꿀 수 있어요. 같은 캐릭터라도 등록된 다른 이미지를 쓰면 **아바타가 슥 바뀐답니다**.
<<김대표:assets/김대표.png!흔들--|>> 깜짝이야. 반전이네.
<<옵시코코:옵시코코.png|-->> [10:23] 방금 제 얼굴, 바뀐 거 눈치채셨나요? 😏

---

# 밤이 되면, 장면 전환

<<사무실:사무실_밤.png>>
![[심각.mp3]]

<<옵시코코:옵시코코.png|-->> [21:04] 배경 참조 한 줄이면 이렇게 **채팅방 배경**이 바뀌어요. 낮이었던 사무실이 밤이 됐죠?
<<오브리스:오브리스_세피아.png|-->> [21:05] 오… 배경음악까지 바뀌니까 분위기 완전 다르다. 야근 느낌 물씬 나는데😵
<<김대표:김대표.png--|>> [21:05] 야근 아니야. 자율적인 **열정 근무**라고 불러줘.
<<오브리스:오브리스.png!흔들|-->> [21:06] 그게 야근이잖아요…😭

<<옵시코코:옵시코코.png|-->> [21:06] 자자, 바람 쐬러 나갈까요?
<<옵시코코:옵시코코.png|-->> [21:06] ![[거리.png]]
<<오브리스:오브리스.png!점프|-->> [21:07] 좋아좋아! 나갈래 나갈래!

---

# 거리 산책, 그리고 퇴근

<<거리:거리.png>>
![[일상.mp3]]

<<옵시코코:옵시코코.png|-->> [21:20] 밖으로 나왔어요. 배경을 또 바꾸니 노을 진 거리로 이동했죠? 🌆
<<오브리스:오브리스.png|-->> [21:20] 누나, 이 똑같은 대본을 다른 뷰로도 볼 수 있다며?
<<옵시코코:옵시코코.png!끄덕|-->> [21:21] 맞아! `view` 값만 바꾸면 **비주얼노블 뷰**로는 게임처럼, **웹소설 뷰**로는 소설처럼도 볼 수 있어요. 대본은 하나인데 말이죠.
<<김대표:김대표.png!점프--|>> [21:21] 하나 써서 여러가지 뷰어로 볼 수 있다는 게 옵시코코의 자랑이지.  **가성비**가 아주 좋아.
<<오브리스:오브리스.png|-->> [21:22] 대표님은 그런 걸 좋아하시더라ㅋㅋㅋ
<<김대표:assets/김대표.png—|>> 게으름의 산물이지. 좋게 말하면 효율충? 아니 효율신봉자라고 해두자.

<<옵시코코:옵시코코.png|-->> [21:22] 뭐가 됐든 효율이 좋으면 된거죠. 자, 이제 슬슬 마무리할까요?
<<오브리스:오브리스.png!끄덕|-->> [21:22] 응! 나 먼저 들어갈게. `<<이름:->>` 이렇게 쓰면 채팅방을 나간대. 잘 봐!
<<오브리스:->>

<<옵시코코:옵시코코.png|-->> [21:23] …이렇게 "오브리스님이 나갔습니다"라고 뜨면서 퇴장했어요.
<<김대표:김대표.png--|>> [21:23] 나는 오른쪽이라 나가면 이상하니 계속 있을게.

<<옵시코코:옵시코코.png|-->> [21:24] 제가 오른쪽을 할 걸 그랬나봐요😅
<<김대표:assets/김대표.png—|>> 괜찮아. 야근 정도는 일상이지.
<<옵시코코:assets/옵시코코.png|—>> 고생이 많으시네요.
<<김대표:assets/김대표.png—|>> 고생은 무슨. 그만 마무리나 해.
<<옵시코코:assets/옵시코코.png|-->> 네! **메신저 뷰** 예시는 여기까지에요. 
<<옵시코코:assets/옵시코코.png|—>> 아바타·시간·사진·음성·감정 연출·배경 전환·퇴장까지 다 담아서 너무 길지 않았나요?
<<옵시코코:옵시코코.png!끄덕|-->> [21:24] 자세한 문법은 [[17-3 메신저·비주얼노블 뷰]]에서 확인해 보시길 추천드려요.
<<옵시코코:옵시코코.png|-->> [21:24] 그럼, 즐거운 옵시코타임 되세요! 🎬

---

📚 함께 보기: [[비주얼노블 뷰 예제]] · [[17-3 메신저·비주얼노블 뷰]] · [[17-2 캐릭터 도감과 캐릭터 참조]] · [[17-1 이북·웹소설 뷰어]]
