Figma Make에 가이드라인 추가하기

Guidelines.md 파일의 내용

시스템 가이드라인

이 파일을 사용하여 AI가 따라야 할 규칙과 가이드라인을 제공하세요.
이 템플릿은 추가할 수 있는 항목의 몇 가지 예를 제시합니다. 본인의 니즈에 맞게 섹션을 추가하고 형식을 지정할 수 있습니다.

팁: 컨텍스트가 많다고 해서 항상 더 좋은 것은 아닙니다. 오히려 LLM을 혼란스럽게 할 수 있습니다. 가장 중요한 규칙을 추가해 보세요

# 일반적 지침

AI가 따라야 할 일반적인 규칙을 입력하세요.
예를 들어:

 * 꼭 필요한 경우에만 절대 위치 지정을 사용해. 기본적으로 플렉스박스와 그리드를 사용하는 반응형 레이아웃을 선택해.
* 코드를 깔끔하게 유지할 수 있게 리팩터링해.
* 파일 크기를 작게 유지하고, 보조 함수와 컴포넌트를 별도의 파일에 넣어.

--------------

# 디자인 시스템 가이드라인
AI가 생성물을 회사의 디자인 시스템처럼 보이게 만드는 규칙

추가로 프롬프트 상자에서 사용할 디자인 시스템을 선택하면 디자인 시스템의 컴포넌트, 토큰, 변수 등을 참조할 수 있습니다.
예를 들면:

* 기본 글꼴 크기로 14px를 사용해* 날짜 형식은 항상 “6월 10일” 형식이어야 해
* 하단 도구 모음에는 최대 4개의 항목만 있어야 해
* 하단 도구 모음과 함께 플로팅 액션 버튼을 절대 사용하지 마
* 칩은 항상 3개 이상의 세트로 구성되어야 해
* 옵션이 2개 이하인 경우 드롭다운을 사용하지 마

하위 섹션을 만들고 더 구체적인 세부 정보를 추가할 수 있습니다.
예를 들면:


## Button
The Button component is a fundamental interactive element in our design system, designed to trigger actions or navigate
users through the application. It provides visual feedback and clear affordances to enhance user experience.

### 사용법
버튼은 양식 제출, 선택 사항 확인 또는 프로세스 시작과 같은 사용자가 취해야 하는 중요한 작업에 사용되어야 해. 상호작용성을 전달하고 명확하며 액션 지향적인 라벨을 가져야 해.

### 변형
* 기본 버튼
  * 목적 : 섹션이나 페이지에서 주요 작업에 사용
  * 시각적 스타일 : 굵고, 주요 브랜드 색상으로 채워짐
  * 사용법 : 섹션당 하나의 기본 버튼을 사용하여 사용자를 가장 중요한 작업으로 안내
* 보조 버튼
  * 목적 : 대체 또는 보조 작업에 사용
  * 시각적 스타일 : 기본 색상으로 윤곽이 그려지고, 배경은 투명함
  * 사용법 : 덜 중요한 작업을 위해 기본 버튼 옆에 나타날 수 있음
* 3차 버튼
  * 목적 : 가장 중요하지 않은 작업에 사용
  * 시각적 스타일 : 테두리 없는 텍스트만 사용, 기본 색상 사용
  * 사용법 : 사용 가능해야 하지만 강조되지 않아야 하는 작업에 사용