최소 요구 사항 및 최상의 실천 방법

저장소의 캐릭터 시트의 일관된 품질을 보장하기 위해, 모든 제출은 아래의 최소 요구 사항을 충족해야 합니다. 

1. 행동 규칙

• 캐릭터 시트에는 Roll20의 행동 규정이 적용되며 준수해야 합니다.

• 지적 재산권 침해하지 마세요. 커뮤니티 시트에는 저작권 제한 사항으로 인해 캐릭터 생성 또는 진급이 포함되어서는 안 됩니다. 게임 제작자와의 파트너십 덕분에 'By Roll20' 시트에 이 콘텐츠가 포함될 수 있습니다. 'By Roll20' 시트의 코드에서 개발된 시트는 캐릭터 생성 또는 승급 옵션 코드가 제거되었는지 확인해야 합니다. 다른 속성(현재 레벨 포함)을 기반으로 자동 계산되는 속성을 사용해도 괜찮습니다. 제출한 시트가 이 규칙을 위반하는 경우 알려드립니다.

• 캐릭터 시트에 대한 한 가지 구체적인 요구 사항이 있습니다. “성별”에 대한 영역이 있는 모든 캐릭터 시트에 대한 새로운 풀 요청의 제출은 해당 영역을 미리 정의된 옵션 목록이 아닌 열린 텍스트 입력으로 만들어야 합니다. 이 가이드라인은 우리가 게임을 즐길 수 있는 최대한 많은 사람들에게 가능한 한 포용적인 방식으로 게임을 도와주기 위한 지속적인 노력을 반영한 것입니다. 이 경우, 이 작은 프로그래밍 변경에 시간을 할애하는 것은 우리 커뮤니티에 큰 차이를 만들어줍니다.

2. 좋은 코드

• 최소한의 스타일링. 모든 캐릭터 시트는 적은 양의 CSS & HTML 스타일링을 가져야 하며, 이는 시각적으로 매력적이고 사용하기 쉽게 만들어야 합니다. 예를 들어, 창 크기를 조정할 때 요소들이 의도치 않게 겹치지 않아야 합니다. 그 시트는 종이 버전을 보는 것에 익숙한 플레이어들에게 익숙해야 합니다. 종이 버전과 완전히 동일할 필요는 없으며, 저작권을 침해하지 않도록 해야 하지만, 플레이어들이 사용 방법을 이해하는 데 어려움을 겪지 않도록 너무 어렵게 배치되지 않아야 합니다. 먼저 사용하기 쉽도록 디자인하세요.

• 올바른 HTML 구문. 접근성을 높이고 커뮤니티 기여를 위해 코드를 유지보수할 수 있도록 올바른 HTML 구문을 사용하는 것이 권장됩니다. 모든 새로운 시트는 <⁠div> 및 <⁠span> 요소와 같은 올바른 컨테이너 요소를 사용해야 합니다. HTML 파일에<머리>또는<본문>태그를 사용하지 않아야 하며, 그렇지 않으면 가상 테이블톱에서 캐릭터 시트가 로드되지 않을 수 있습니다.

• 아니오 <⁠테이블> 레이아웃에 사용되지 않습니다. 일반적인 표준으로서 <⁠테이블> 요소는 표 데이터에만 사용해야 합니다. <표>는레이아웃에 사용할 수 없습니다. 대안으로 캐릭터 시트 레이아웃 설계을 참조하십시오.

• Unix 서버 호환성이 필요합니다.모든 CSS, HTML 및 JSON 파일은 Unix 줄 끝(LF)을 사용하여 제출해야 합니다. Google 검색을 통해 좋아하는 텍스트 편집기에서 이를 설정하는 방법을 알 수 있습니다. 또한, 모든 제출은 유효한 sheet.json 파일과 미리보기 이미지를 포함해야 합니다. 적절한 sheet.json을 만드는 방법은 GitHub README에서 찾을 수 있습니다.

• Chrome & Firefox 호환 가능. Roll20의 공식 지원 브라우저는 Chrome & Firefox입니다. 모든 캐릭터 시트는 이 두 브라우저에서 기능과 스타일을 테스트해야 합니다.

3. 0 쾌적한 경험

• 캐릭터 시트는 기본적으로 독립적이어야 합니다. All basic sheet functionality must be usable without external requirements such as images or fonts hosted outside Roll20, and Mod (API) companion scripts. Mod (API) companions are a welcome supplement for character sheets, but to ensure accessibility & functionality to community members at all of subscription levels, the sheet must be usable by default without outside requirements.

• 기능적인 주사위 버튼. 최고의 시트는 캐릭터 스탯을 추적하는 것뿐만 아니라 게임 시스템의 가장 일반적인 주사위 굴림을 내장하고 있습니다. 이로써 새로운 플레이어들이 직관적인 기능을 추가함으로써 게임을 플레이하기가 훨씬 쉬워집니다. 전체 시스템의 모든 굴림을 포함할 필요는 없지만, 적절한 곳에 자주 사용되는 굴림을 포함시킴으로써 시트를 더욱 높은 수준으로 끌어올릴 수 있습니다. 게임에서 굴리지 않는 경우, 예를 들어Amber Diceless Roleplaying Game와 같은 게임은 이 표준을 충족할 필요가 없습니다. 이 요구 사항이 적용되지 않는 시스템에 대한 시트를 디자인하는 경우, 풀 리퀘스트에 주석을 포함하십시오.

• 데이터 추적을 위한 & 텍스트 필드 입력. 속성과 통계가 있는 게임 시스템을 위한 캐릭터 시트에는 사용자가 데이터를 추적할 수 있는<input> 요소가 포함되어야 합니다. 가능한 경우, 속성에 대해 표준 이름을 사용하십시오. 예를 들어, "지능", "힘", "지혜"와 같이 말이죠. 이는 캐릭터가 다른 시트로 가져올 경우 대부분의 값이 전환될 수 있도록 하는 데 중요합니다. 모든 속성 이름이 다른 경우, 아무 것도 가져올 수 없습니다. 가능한 경우, 해당 시스템의 기존 시트를 참조하고 이미 사용 중인 속성 이름을 사용하십시오. 마찬가지로, 사용자가 노트나 설명을 추가할 수 있는<textarea> 태그를 포함해야 합니다. 이 요구사항은 시스템에 따라 매우 다양하며, 게임 시스템에 해당하지 않는 경우에는 풀 리퀘스트에 코멘트를 포함해주세요.

• 규칙은 즉시 이용 가능해야 합니다. 독립 게임 및 홈브루 시스템에 대한 시트를 제출할 수 있습니다. 홈브루 게임은 해당 게임 시스템의 저작권을 위반하지 않아야 합니다. 두 경우 모두 규칙은 인터넷에서 대중에게 즉시 이용 가능해야 합니다.

최소한의 요구사항을 넘어서

저장소에 추가하려는 새로운 캐릭터 시트에는 아래의 제안사항이 필요하지 않습니다. 프론트엔드 개발에 익숙하지 않은 새로운 시트 제작자는 버전 1을 위한 최소 요구사항을 충족시키는 데 초점을 맞추어야 합니다. 그러나 기본 사항에 익숙해지면 아래의 제안사항을 통해 시트를 한 단계 더 발전시킬 수 있습니다.

• CSS 마법사. 시트 제작자 커뮤니티는 매우 똑똑하고 창의적입니다. 그들은 여기에 캐릭터 시트 시스템을 활용하는 방법의 예를 제시합니다.

• 맞춤형 주사위 템플릿. 롤 템플릿은 문자 시트의 색 구성표 & 스타일에 맞게 사용자 지정할 수 있습니다. 또한, 그들은 사용자가 게임 시스템의 특정 기계 구조에 일치하는 롤 출력을 달성하는 데 도움이 될 수 있습니다.

• 시트 워커는 강력한 도구입니다!. 이러한 스크립트는 문자 시트 시스템의 고급 기능으로, 시트 작성자가입력의 값이 수정될 때마다와 같은 특정 이벤트 중에 실행할 JavaScript를 지정할 수 있습니다.

• 번역 키. 캐릭터 시트의 국제화(i18n) 기능을 사용하면, 시트 작성자가 시트를 다른 언어로 번역할 수 있도록 해줍니다. 이를 통해 Roll20의 사용자들이 해당 언어로 시트를 사용할 수 있습니다. 2016년 9월 이후로는, 이미 존재하는 캐릭터 시트의 번역본을 단순히 대체하는 새로운 캐릭터 시트를 받지 않습니다.

• 기본 시트 설정. 선택 가능한 옵션은 사용자 정의 캐릭터 시트와 함께 제공되는 sheet.json 파일에서 지정할 수 있습니다. 이 옵션은 캐릭터 시트가 사용 중일 때 모든 캐릭터에 기본 설정을 제공합니다.

• 컴펜디움 통합. 시트가 도감과 호환되도록 지정하면 플레이어는 게임 플레이 중 오른쪽 사이드바에서 해당 도감에 바로 액세스할 수 있습니다. 컴펜디움은 여전히 Roll20의 성장 중인 기능이며, 대부분의 게임 시스템에서 통합이 아직 이루어지지 않았습니다.

• 제목에 속성 이름 포함. title=@{attribute_name}을 추가하면 매크로 작성자가 속성 이름을 더 쉽게 찾을 수 있습니다. 제목은 때로는 다른 목적으로 사용되므로 판단에 따라 사용하십시오.

• 위키 페이지 링크시트에 대한 위키 페이지를 생성한 경우sheet.json의지침섹션에 링크할 수 있습니다.

최적의 방법

이는 시트 작성자들 간의 일관성을 높이고 커뮤니티를 위한 유지 가능한 코드 저장소를 제공하기 위한 최적의 방법 지침입니다.

속성/입력

• 속성 이름은 소문자여야 합니다. 일관성을 위해, 이를 수행하는 모든 사람들은 프로그래밍을 조금 더 쉽게 만듭니다.

• RPG에는 이상한 단어들이 있습니다. 브라우저에서 맞춤법 오류를 표시하지 않도록, 텍스트 입력 및 텍스트 영역에는 spellcheck="false" 을 사용하세요.

• 더 적은 수의 속성 사용 & 입력. 속성과 입력이 많을수록 시트가 느려집니다. 일반 시트는 문제가 되지 않지만D&D 5E 시트 바이롤또는Pathfinder(커뮤니티)초과 속성 & 입력과 같은 강력한 시트는 관리하지 않으면 성능 문제가 발생할 수 있습니다.

• 비활성화된 입력에 걸쳐. 속성 지원 스팬()은 비활성화된 입력보다 더 효율적입니다.

Sheetworkers & 롤 템플릿

• 비동기식 캐스케이드 피하기. 시트 작업자에 대해서는 가능한 경우 비동기적인 연속을 피하세요. 예를 들면 다음과 같습니다. getAttrs -> 계산 -> setAttrs -> getAttrs -> 계산 -> setAttrs…. 이를 더 잘 처리하는 방법은 필요한 모든 것에 대해 getAttrs를 사용하고, 모든 필요한 계산을 한 후에 마지막으로 단일 setAttrs를 사용하는 것입니다.

• 시트 워커는 자동 계산된 속성보다는 캐릭터 시트의 성능을 향상시키기 위해 이벤트가 발생할 때 트리거됩니다.. 시트 워커는 이벤트가 발생할 때 트리거되어 자동 계산된 속성보다 캐릭터 시트의 성능을 향상시킵니다. 이러한 이벤트는 덜 자주 발생하기 때문입니다.

• 롤 템플릿과 시트 워커를 HTML 페이지 하단에 배치합니다.페이지 끝에 JavaScript를 배치하는 것이모범 사례로 간주됩니다().

다크 모드 스타일링 세부 정보

• 테마 변경
  사용자가 다크 모드로 전환하면 가상 테이블탑은 특정 CSS 클래스 .sheet-darkmode 를 <body> 요소에 추가합니다. 스위치를 다시 조명으로 전환하면 해당 클래스가 제거됩니다.
• 테마 변경
  시트의 CSS 끝에 색상 선택을 추가하면 사용자가 스위치를 뒤집을 때 변경 사항이 표시됩니다. 이때 body.sheet-darkmode { } 를 감싸야 합니다.

기타 Roll20 특정

• !important를 피하세요.. CSS에서 가능한 경우,!important을 사용하지 않는 것이 좋습니다. 그렇게 하면 더 많은 !important 효과가 발생할 수 있습니다.

• HTML의 CSS 클래스 이름에는 시트- 을 포함하지 마십시오. HTML의 CSS 클래스에는 자동으로 시트-이 추가되므로 중복해서 사용할 필요가 없습니다. 많은 클래스가 사용되는 경우, 생략함으로써 가독성을 높일 수도 있습니다.
  • 예를 들어, HTML에서는 class="sheet-strRow"대신에 class="strRow"을 사용하십시오. 경고: 위의 내용은 <rolltemplate> 요소의 클래스에 대해서는 사실이 아닙니다. 이러한 경우 전체 클래스 이름(예:시트-로 시작)을 지정해야 하며, 그렇지 않으면 롤템플릿이 작동을 멈춥니다.