# 시메지 관리

<h3 align="center"><img src="/files/bpDgdSzSTY6JJ3PWqDsF" alt="" data-size="line"></h3>

<h3 align="center"><strong>시메지 관리</strong></h3>

<p align="center">내 홈페이지를 돌아다니는 귀여운 캐릭터 만들기!</p>

<p align="center"><sub><em>+</em></sub> <em> </em><sub><em><mark style="color:purple;">20,000₩</mark></em></sub></p>

<p align="center"><br></p>

![](https://firebasestorage.googleapis.com/v0/b/ts-boilerplate-b2b14.appspot.com/o/posting%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202024-08-25%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%207.37.40.png_5871ec46-f889-4997-878f-d15b4bb1142d?alt=media\&token=5e1fa8c3-a3cc-47d1-9b9c-cd05a2cd76bc)

{% hint style="success" %}
**‘시메지**’란 바탕화면 등을 자유롭게 부유하며 움직이는 캐릭터 애니메이션입니다.

보통은 운영체제를 기반으로 작동하는 프로그램 명칭이지만

&#x20;**해당 시메지는 무공 갠홈 에서만 작동합니다.**
{% endhint %}

{% hint style="danger" %}

* 파츠를 세트로 만드셔서 배포하시는 행위 자유롭게 가능하십니다. \
  해당 시메지 바디 데포르메는 무공 자체 제작이나, \
  직접 제작하시는 파츠에는 무공의 저작권이 없으므로 자유롭게 명시하셔도 좋습니다.
* 해당 홈페이지 시메지 기능을 참고하여 타 커미션에 개발을 맡기시는 행위는 지양합니다.
  {% endhint %}

\ <mark style="color:blue;">**\[1]**</mark> [#undefined-2](#undefined-2 "mention")

<mark style="color:blue;">**\[2]**</mark> [#undefined-4](#undefined-4 "mention")

<mark style="color:blue;">**\[3]**</mark> [#undefined-5](#undefined-5 "mention")

<mark style="color:blue;">**\[4]**</mark> [#undefined-7](#undefined-7 "mention")

<h2 align="center">#1</h2>

<h3 align="center"><strong>캐릭터 추가/수정/삭제</strong></h3>

시메지 관리 기능은 **\[내 프로필] - \[메인 홈 설정] - \[시메지 관리]**&#xC5D0; 있습니다.

**\[+추가]** 버튼을 누를 시 기본 시메지가 추가됩니다.

![](https://firebasestorage.googleapis.com/v0/b/ts-boilerplate-b2b14.appspot.com/o/posting%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202024-08-25%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%207.38.43.png_54fc4ab5-0333-4fe0-bc65-21d67f406d58?alt=media\&token=4e6b8c52-5bbd-4995-886a-585ac6d3467b)

> ### **시메지 캐릭터 상태**
>
> <sup>**각 상태는 랜덤시간, 랜덤으로 출력되며 표정 및 애니메이션이 다르게 작동합니다.**</sup>
>
> * 기본
> * 걷기
> * 꾸벅꾸벅
> * 이동
> * 클릭
> * 냠냠

<h2 align="center">#2</h2>

<h3 align="center"><strong>얼굴 커스텀</strong></h3>

컬러 파레트를 통해 피부색, 눈색 등을 설정할 수 있습니다.

![](https://firebasestorage.googleapis.com/v0/b/ts-boilerplate-b2b14.appspot.com/o/posting%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202024-08-25%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%207.45.51.png_5f22e796-bd80-4ba2-93e9-577d159c9645?alt=media\&token=8468a65e-8459-45f3-83d8-b4be707c744e)

눈은 굵기 지정이 가능하며, 각 벡터 수치를 통해 섬세하게 커스텀 할 수 있습니다.\
입모양 등은 지정이 가능합니다.

<div align="left"><img src="https://firebasestorage.googleapis.com/v0/b/ts-boilerplate-b2b14.appspot.com/o/posting%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202024-08-25%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%207.46.36.png_930edd0d-24fb-4e0d-ae23-8056818d4742?alt=media&#x26;token=1eac5702-2a72-40ec-84db-c22564dd838e" alt=""></div>

<h2 align="center">#3</h2>

<h3 align="center"><strong>헤어/의상 커스텀</strong></h3>

헤어, 의상, 악세사리는 모두 '직접 등록'하여 커스텀 하는 형태입니다.

아래에 이미지를 만드는 상세한 가이드를 따로 만들어 두었습니다. 참고 해주세요.

> ### **주요내용**
>
> * 이미지 크기는 100px \* 120px 고정입니다.
> * 해당 이미지 안쪽의 적절한 바디 위치에 파츠를 그려주시면 됩니다.
> * 가장 선명한 노출을 위해 추천하는 이미지 형식은 ‘벡터’ 입니다. 확장자는 .svg입니다.\
>   **페이지 가장 하단에 SVG파츠 제작방법이 첨부되어 있습니다.**
> * 복잡도가 있는 의상은 벡터 이미지 보다, png를 권장합니다.

1. **바디 가이드**

아래의 바디 이미지를 다운받아, 투명도를 낮추고 그 위에 파츠를 그려주세요.\
모든 파츠는 레이어 분리해 추출해 주세요.

{% file src="/files/mHehXR1QBpKaLQEaqE0h" %}

{% file src="/files/WkVtfuRt1F7aJ0A9VfDp" %}

![](/files/FXdtqmUDjHHQZ9OwFSmE)![](/files/O57PyQGbrXOgJ57usKot)

2. **헤어 가이드**

\[정면] 이미지와 \[옆면] 이미지를 제작해 주세요.\
\[뒷머리]도 옵션에 따라 제작 가능합니다.\ <img src="/files/aOc9FmKnpNvLVlqaM1lN" alt="" data-size="original">

<figure><img src="/files/HFTFAzfwBAWiQH4RLbx6" alt=""><figcaption></figcaption></figure>

3. **의상 가이드**

{% hint style="info" %}
필요한 의상 가이드 목록 :  **왼팔  |  오른팔  |  왼다리  |  오른다리  |  옷(몸통)**&#x20;
{% endhint %}

<div align="left"><figure><img src="/files/ewrOLFR2AoXFUUgsmZ5Z" alt=""><figcaption></figcaption></figure></div>

<figure><img src="/files/33jlqmZFRcSvBqvFkTxL" alt=""><figcaption></figcaption></figure>

4. 악세사리 가이드&#x20;

악세사리는 기호도에 따라 추가하시면 됩니다.\
**왼쪽 악세사리는 \[걷기]모드로 측면이 노출될 시 보이지 않는 귀 쪽입니다.**

<div align="left"><figure><img src="/files/juY1AIMzKFG9EN7F3ZcS" alt=""><figcaption></figcaption></figure></div>

<figure><img src="/files/rhgyNS6pWpiHLK1BimgT" alt=""><figcaption></figcaption></figure>

> 🌸  **SVG제작 가이드**\
> 이미지를 벡터로 작업하고 싶으신 경우 아래 툴을 추천드립니다.\
> \
> [**Figma**](https://www.figma.com/community/file/1425293606912256927/moogong-simeji)<br>
>
> 위의 figma  툴은 무료이며, 레디메이드 파츠를 제공합니다.<br>
>
> `open in figma` 버튼을 눌러 파일을 다운받고 수정할 수 있습니다.
>
> 상세 가이드 또한 파일 안쪽에 첨부하였습니다.

<h2 align="center">#4</h2>

<h3 align="center"><strong>음식, 스크립트 커스텀</strong></h3>

**\[음식]** 은 **\[냠냠]** 모션일때만 노출되며, 등록한 갯수만큼 랜덤으로 출력됩니다.

<div align="left"><img src="https://firebasestorage.googleapis.com/v0/b/ts-boilerplate-b2b14.appspot.com/o/posting%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202024-08-25%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%207.45.03.png_1f56ebf2-56b5-41f6-8ea3-84bd015dc8c1?alt=media&#x26;token=db64b0d8-b980-4c99-92a3-c63884a7433c" alt=""></div>

**\[스크립트]**&#xB294; 여러개를 등록할 수 있으며, 랜덤 출력됩니다.\
저장 당시 설정된 눈매, 눈썹 값을 **\[표정]**&#xC73C;로 지정해 쌍으로 저장할 수 있습니다.

<div align="left"><img src="https://firebasestorage.googleapis.com/v0/b/ts-boilerplate-b2b14.appspot.com/o/posting%2FFrame%2031033.png_9f3e365c-30e4-459a-94e1-073a679e9a22?alt=media&#x26;token=cd5675de-403d-4608-ba46-7ca0ee87e61d" alt=""></div>

![](https://firebasestorage.googleapis.com/v0/b/ts-boilerplate-b2b14.appspot.com/o/posting%2F%E1%84%89%E1%85%B3%E1%84%8F%E1%85%B3%E1%84%85%E1%85%B5%E1%86%AB%E1%84%89%E1%85%A3%E1%86%BA%202024-08-25%20%E1%84%8B%E1%85%A9%E1%84%92%E1%85%AE%207.44.34.png_5da0721f-c8bd-44fb-acb3-76ce1d3fc3f3?alt=media\&token=78ffb25b-f6ec-4fbe-8975-d35b3ff605a8)

<br>

<br>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://moogong-guide.gitbook.io/guide/undefined-6/undefined.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.