> For the complete documentation index, see [llms.txt](https://tech.x2bee.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://tech.x2bee.com/dev-guide/pjt-prepare/ui-ux/undefined/undefined-1.md).

# 버튼 생성 가이드

## 버튼명 표기 방법 <a href="#undefined" id="undefined"></a>

1. 모든 버튼 명 표기는 명사로 표기 합니다.
   * \[저장], \[확인], \[다음], \[이전] 등
   * 동사 또는 형용사의 명사형 표기는 사용을 제한 합니다.\
     ex) \[저장하기]
2. 버튼명 작성시 기능 타이틀 대신 사용자의 동작을 표현하는 버튼명을 사용합니다.
   * 업무 및 기능의 표현은 작업공간 화면에 정보가 포함되어있어 사용자의 동작을 나타내는 명칭을 사용합니다.
   * 사용자의 동작으로 표현 시 버튼 기능에 대한 해석의 혼선을 방지하기 위한 경우는 예외로 작업/기능 명을 앞에 붙일 수 있습니다.
     * 동일 화면에서 서로 다른 2가지 이상의 작업을 처리해야하는 경우 버튼이 필요한 작업 명 + 동작 ex) \[품절상품 목록]
3. 유니크한 작업은 버튼 명으로 사용이 필요한 경우 ex) \[번역요청]. \[초기화] 등
4. 버튼 클릭 시 팝업을 띄워 작업을 처리하는 경우는 ‘↗︎’ 아이콘을 사용하여, 팝업이 뜨는 시각적 표현으로 정보를 제공합니다.
5. 팝업, 연관 화면 버튼의 경우, 대상화면명을 버튼명으로 지정이 가능합니다.
6. 실행 버튼의 순서는 화면 기능에 따라 선택 나열 합니다.

## 버튼 화면 표시 사이즈 <a href="#undefined" id="undefined"></a>

* Text 버튼 최소 사이즈 : 60\*36
* 아이콘 버튼 : 20\*20

<figure><img src="https://tech.x2bee.com/download/attachments/14517138/UIUX%20-%20Button.png" alt=""><figcaption></figcaption></figure>
