Aseprite: 테마를 만드는 방법

당신이 원하는 방식으로 aseprite의 미학을 사용자 정의하기 위해 자신의 테마를 만드는 방법.

 

시작 가이드

시작 가이드

안녕하세요. aseprite에서 테마를 조정하는 방법에 대한 가이드에 오신 것을 환영합니다. Aseprite 테마에서 이 튜토리얼을 사용하여 프로그램의 모양을 결정하면 스타일에 맞게 aseprite를 개인화할 수 있습니다. 테마는 투명 배경을 나타내는 바둑판 및 기본 설정 메뉴의 자체 섹션에서 조정할 수 있는 그리드와 같이 캔버스에 사용된 색상에 영향을 주지 않습니다. Zip 파일을 만들려면 Winrar와 같은 프로그램이 필요합니다. 나는 모든 종류의 코딩에 있어서 더미이므로 이것은 대부분 "이 효과를 위해 이 숫자를 다른 숫자로 교체"하는 일종의 튜토리얼입니다.
------------------------

어쨌든, 먼저 당신만의 테마를 만들기 위해 우리는 단순히 기본 aseprite 테마의 복사본을 만들 것입니다. 가장 쉬운 방법은 테마 메뉴(편집->기본 설정->테마)로 이동한 다음 "기본값"을 선택하고 폴더 열기를 클릭하는 것입니다.
------------------------

모든 파일을 복사한 다음 문서/다운로드/사진과 같이 액세스 가능한 위치로 이동합니다. 거기에서 aseprite가 가지고 있는 것처럼 보이는 명명 체계("nameoftheme-theme")를 준수하는 것이 좋습니다.
------------------------

파일은 다음과 같습니다. "LICENSE" 파일은 테마를 배포/판매할 계획이 아닌 한 실제로 엉망으로 만들 필요가 없는 텍스트 파일입니다. "패키지" 파일은 테마에 대한 프로젝트 정보와 같습니다. "sheet.aseprite-data" 파일은 aseprite가 생성하는 파일이므로 이 파일을 엉망으로 만들 필요가 없습니다. "시트" 파일은 모든 아이콘/UI 요소의 이미지입니다. 여기에 있는 모든 것은 원하는 대로 색칠하거나 완전히 다시 그릴 수 있습니다! 그런 다음 마지막으로 "테마" 파일은 색상, 크기, 글꼴, 아이콘/UI 요소의 크기, "시트" 파일의 아이콘/UI 요소 위치 및 이름을 조정하는 데 사용하는 파일입니다. 더. 먼저 "패키지" 파일에 초점을 맞춰 시작해야 합니다. 그것을 선택한 다음 마우스 오른쪽 버튼을 클릭하고 메모장 또는 이에 상응하는 것으로 열기를 클릭합니다. (특별 팁, 메모장에서 Ctrl 키를 누른 상태로 스크롤하여 텍스트 크기를 조정할 수 있습니다)
------------------------

몇 가지 코드를 만나게 되지만 운이 좋게도 그렇게 많지는 않습니다. 텍스트를 변경할 때 쉼표와 따옴표를 삭제하지 마십시오. 운 좋게도 우리는 기본값의 복사본을 변경하여 실제 기본 파일이 항상 폴백할 수 있도록 해야 합니다. 어쨌든 먼저 "aseprite-theme"의 이름을 이러한 파일이 있는 폴더의 이름으로 바꾸고 싶을 것입니다. 그런 다음 "Aseprite Default Theme"를 테마의 이름으로 바꿉니다. 나머지 항목도 조정할 수 있지만 테마를 다른 사람과 배포하거나 공유하는 경우에만 대부분 중요합니다. 마지막으로 "id" 및 "path"라는 단어 옆에 "기본값"이 표시됩니다. 이것은 실제로 이름을 바꿔야 하는 항목이며 테마 이름으로 변경해야 합니다. 그런 다음 파일을 저장하고 종료합니다.
------------------------

Aseprite에 만든 테마를 추가하는 방법


이제 언제든지 winrar를 사용하여 사용자가 만든 테마의 폴더를 zip으로 압축하고 aseprite에 새 확장/테마로 추가할 수 있습니다. 고통스러울 수 있는 테마를 만들 때 매우 자주 테스트하는 것이 좋습니다. 그러나 잘못된 것을 조정하고 그것이 무엇인지 모르는 것보다 낫습니다. 따라서 테마를 시각적으로 조정하는 방법을 보여주기 전에 나중에 테마를 만들 때 어떻게 보이는지 확인할 수 있도록 aseprite에 테마를 추가하는 방법을 보여 드리겠습니다. 먼저 ZIP으로 변환해야 합니다. 압축하려면 winrar가 설치된 폴더를 마우스 오른쪽 버튼으로 클릭하고 "아카이브에 추가..."를 클릭하기만 하면 됩니다. 아카이브 형식에서 ZIP을 선택하기만 하면 됩니다. 이렇게 하면 프로젝트의 ZIP 복사본이 만들어집니다. ZIP 이름에 대해 걱정할 필요가 없으므로 이름이 mytheme(19645)인 경우에도 "패키지" 파일에서 조정한 내용 때문에 괜찮을 것입니다.
------------------------

그런 다음 aseprite에 테마를 설치하려면 확장 메뉴(편집->기본 설정-> 확장)로 이동하고 확장 추가를 클릭합니다. 그런 다음 zip/project 폴더를 배치한 찾기 쉬운 폴더로 이동하고 ZIP을 두 번 클릭하여 확장자로 추가합니다. 그런 다음 테마를 적용하려면 "테마" 메뉴로 전환하고 목록에서 두 번 클릭합니다(테마를 선택하고 확인을 누르거나 적용하면 테마가 변경되지 않는 경우 두 번 클릭하는 것이 매우 중요합니다. 한 시간 동안 내 자신의 테마를 올바르게 만들지 않았다고 생각합니다). 그런 다음 확장 메뉴로 돌아가 테마가 준비되지 않은 경우 제거하는 것을 잊지 마십시오.
------------------------

기본 테마 템플릿 편집

이제 테마에 대한 항목을 실제로 변경할 준비가 모두 완료되어야 합니다. 압축을 푼 프로젝트 버전으로 돌아갑니다. 먼저 "시트" 파일은 MS 페인트가 투명도를 지원하지 않으므로 MS 페인트에서 이 파일을 열지 마십시오. 물론 이 파일을 aseprite로 조정하고 싶을 것입니다! 먼저 슬라이스를 나타내는 라인이 많이 있음을 알 수 있습니다(보고 싶지 않은 경우 보기->표시->슬라이스로 이동). aseprite 제작자는 우리를 위해 이것을 포함했으며 각 아이콘/9splice/ect에 대한 스프라이트의 크기를 보여주고 있습니다. 간단한 색상 변경 테마에 대해 표시된 상자 안에 머물도록 하십시오. 또한 자신만의 스프라이트 시트를 만들 수 있으며 "테마" 파일에 도달하면 대체할 항목의 위치를 ​​이 이미지 대신 해당 이미지로 리디렉션할 수 있습니다. aseprite를 많이 사용했다면 여기에 있는 대부분의 아이콘을 인식할 것입니다. ui에서 모서리가 둥근 모든 것을 찾으십시오. 모서리가 둥근 경우 9 스플라이스일 가능성이 있으며 이 시트에 표시되어 있습니다. 일부 색상에는 투명도가 있어 aseprite의 기본 회색 바둑판에서 잘 표시되지 않을 수 있습니다.
------------------------

다음은 시트의 9개 스플라이스 중 일부가 위치할 수 있는 위치에 대한 아이디어를 얻을 수 있는 일부 포함된 이미지입니다. 누르지 않은 상태, 마우스오버한 상태 및 누른 상태의 버튼에는 9번 스플라이스가 있으므로 이를 염두에 두십시오. 스크롤 막대, 드롭다운 메뉴의 선택 항목 및 입력 상자에도 고유한 색상이 있습니다. 더 프로그래머 스타일 방향에서 색상을 조정하려는 경우 각 스플라이스가 정확히 사용되는 것은 "테마" 파일에 있습니다.
------------------------

 

스프라이트 시트에서 무엇이 어디로 가는지 추측하기 어려울 수 있으므로 눈에 띄는 색상을 만드는 것은 문제 해결에 상당한 도움이 될 수 있습니다. 또한 "테마" 파일의 Parts 섹션에서 각 스프라이트의 왼쪽 상단 모서리의 이름과 x/y 좌표를 찾을 수 있지만 이름이 aseprite에서 어디로 가는지 항상 명확하지는 않습니다.
------------------------

"테마" 파일은 "패키지" 파일과 유사하게 열립니다. 메모장에서 선택하여 엽니다. 이 파일은 다른 모든 조정을 수행하는 곳이며 매우 압도적일 수 있습니다. 최선을 다해 무너뜨리겠습니다. 먼저 테마 이름(조직용)과 화면 크기 조정 및 UI 크기 조정을 조정할 수 있습니다. Screen scaling은 Canvas를 조정하고 UI scaling은 UI 창을 조정합니다. 여기에 입력한 값은 전체 값으로만 ​​저장되고 원래 크기로 곱해집니다... 예: 화면 크기 조정 1은 100% 확대로 변환되고, 화면 크기 조정 1.9는 100% 확대로 변환되고, 화면 크기 조정 2는 200% 확대로 변환됩니다. . 일반 모니터에는 그다지 유용하지 않지만 침대에 누워서 프로젝터를 사용하는 경우에는 유용할 것 같습니다. 다음으로 이 테마를 만든 공로로 귀하의 이름을 입력할 또 다른 장소입니다.
------------------------


그런 다음 aseprite에서 사용되는 글꼴을 변경하는 옵션입니다. 여기에 들어갈 기본 글꼴 옵션은 제한되어 있습니다. 글꼴을 변경하려면 aseprite의 데이터 폴더(Aseprite\data\fonts)에 있는 글꼴 폴더로 이동하세요. 거기에 aseprite의 사용자 정의 기본 글꼴과 파일을 표시하는 2개의 이미지가 표시됩니다. "글꼴"로 명명되었습니다. 메모장으로 "글꼴" 파일을 열면 글꼴을 변경할 수 있는 기본 옵션이 표시됩니다. 이 목록에 없으면 aseprite에서 사용할 수 없습니다. 자신만의 글꼴을 만드는 것이 막막하다면 aseprite의 사용자 정의 글꼴에 대한 스프라이트 시트의 복사본을 만들어 새 글꼴을 만들기 위한 지침으로 사용할 수 있습니다. 죄송하지만 사용자 정의 글꼴을 만드는 방법에 대해 잘 모릅니다. 이 목록에 기존 설치된 글꼴을 추가하려면 Arial 항목을 복사하여 붙여넣고 "Arial"을 운영 체제의 "글꼴" 파일에 설치된 글꼴의 파일 이름으로 바꾼 다음 "테마" 파일에 글꼴 이름을 작성합니다. aseprite가 열린 상태에서 글꼴을 설치한 경우 aseprite를 다시 시작해야 합니다.
------------------------


다음은 내가 픽셀이라고 생각하는 ui 요소의 치수입니다. UI 요소는 모두 레이블이 잘 지정되어 있으므로 구분하기가 매우 쉽습니다.
------------------------

그 후, 색상. 솔직히 말해서 무엇이 나를 위해 가는지 말하기가 매우 어렵습니다. 아마도 이것을 조정하는 데 오랜 시간이 걸릴 것입니다. 여기에 보이는 것은 XNUMX진수 색상 코드가 할당된 UI 섹션 목록입니다.
------------------------

운 좋게도 aseprite의 색상에 대한 XNUMX진수 색상 코드를 쉽게 알아내고 거기에서 파일로 XNUMX진수 코드를 복사할 수 있습니다.
------------------------


다음은 교환할 수 있는 색상을 시각화하는 데 도움이 되는 파일의 기본 색상 목록입니다. 내가 찾은 한 가지 유용한 것은 ctrl + F를 눌러 메모장에서 찾기 메뉴를 열고 흰색인 모든 것을 검은색으로 변경하고 검은색인 모든 것을 흰색으로 변경하고 싶은 경우 정확한 XNUMX진수 색상을 검색하는 것입니다. 마지막으로 분명히 명명 체계가 있고 UI의 영역이 함께 그룹화되어 있는 것 같습니다. 얼굴은 UI 섹션의 배경색과 같으며 핫페이스는 클릭 가능한 부분이라고 생각합니까? 핫 텍스트는 클릭할 수 있는 텍스트이고 라디오는 라디오 메뉴를 의미합니다. "선택됨"은 분명히 선택된 UI 요소이고, 마우스를 가져가면 색상이 표시되는 식입니다.
------------------------

파트는 "시트" 파일의 모든 아이콘/UI 요소입니다. 먼저 아이콘이 시작되는 스프라이트시트의 x 및 y 좌표를 제공한 다음 해당 아이콘의 높이와 너비를 픽셀 단위로 제공합니다. 아이콘을 더 크게/작게 만들면 변경됩니다. 여러 너비와 높이가 있는 항목은 접합된 아이콘/요소(예: 9개의 접합)로 각 섹션의 식별 길이입니다.
------------------------

마지막으로 스타일 섹션입니다. 이것은 다른 모든 섹션에서 정의한 것에서 어떤 요소가 어디로 갈 것인지 결정하는 것입니다. 색상이나 부품이 어디로 가는지 파악하는 데 유용할 수 있습니다. 여기에서 패딩, 여백 길이 및 텍스트 정렬을 조정할 수도 있습니다.

코멘트 남김

ArabicEnglishFrenchGermanItalianJapaneseKoreanPortugueseSpanish