티어리스트 메이커

티어리스트 메이커 소개

이미지나 글자 항목을 S·A·B·C·D·F 같은 등급 줄에 끌어다 놓아 순위표를 만들고, PNG 이미지나 링크로 공유하는 도구입니다. 이미지는 파일 선택, 끌어다 놓기, 붙여넣기(Ctrl+V)로 넣을 수 있고, 이름만 있는 글자 항목도 만들 수 있습니다.

티어표는 1등부터 꼴찌까지 줄 세우는 순위표와 다릅니다. 같은 줄 안에서는 순서가 크게 중요하지 않고, 「이 정도 급」이라는 묶음을 먼저 정하는 방식이라 항목이 30개, 50개로 늘어나도 결정을 내리기 쉽습니다. 대신 「A와 B 경계에 있는 것」을 어디에 둘지가 늘 논쟁거리가 됩니다.

티어표는 격투 게임 커뮤니티에서 왔다

캐릭터를 등급으로 묶는 문화는 1991년 스트리트 파이터 2 이후 대전 격투 게임 대회 문화와 함께 자랐다는 설명이 일반적입니다. 게임 매체 Inverse는 오늘날 흔히 보는 형식의 티어 리스트가 인터넷에 퍼진 계기로 철권 4 커뮤니티를 들고, 2005년 한 포럼 글이 「God Tier」 같은 등급 이름을 굳혔다고 소개합니다. 이후 대난투 스매시브라더스 커뮤니티를 거쳐 리그 오브 레전드 같은 다른 장르, 그리고 음식·영화까지 무엇이든 등급을 매기는 유튜브 형식으로 번졌습니다.

원래 목적은 「대회에서 이길 확률」이라는 비교적 객관적인 기준이었습니다. 요즘 티어표는 취향표인 경우가 많으니, 만들기 전에 기준을 하나 정해 제목에 적어 두면 보는 사람과의 쓸데없는 논쟁이 줄어듭니다. 이 도구의 프리셋에 S~F 외에 「인생작~망작」, 「최애~싫어」, 「필수~비추천」, 「매우 어려움~매우 쉬움」이 따로 있는 이유입니다.

등급 줄 색과 글자색

기본 팔레트는 빨강에서 보라로 내려가는 9색이고, 줄이 더 많으면 마지막 색을 12%씩 어둡게 이어 붙여 회색으로 떨어지지 않게 합니다. 파스텔·네온·바다·노을·흑백 팔레트도 있습니다.

줄 이름의 글자색은 배경색의 상대 휘도(WCAG가 정의한 밝기 계산)로 검은 글자와 흰 글자 각각의 대비율을 구해, 더 큰 쪽을 씁니다. 노란 줄에 흰 글씨가 올라가 안 보이는 일도, 회색(#808080) 같은 중간 밝기 줄에 대비가 더 낮은 흰 글씨가 올라가는 일도 없습니다.

이미지는 어디에 저장되고, 얼마나 줄어드나

넣은 이미지는 긴 변 440픽셀로 줄여 WebP(품질 0.88, 지원하지 않는 브라우저는 PNG)로 바꾼 뒤 이 브라우저의 저장소에 자동 저장됩니다. 작업을 멈추고 0.5초가 지나면 저장되고, 탭을 닫는 순간에도 한 번 더 저장합니다.

브라우저 저장소는 사이트마다 용량 한도가 있어서 이미지가 아주 많으면 저장에 실패할 수 있습니다. 이때는 「저장 공간이 부족하다」는 알림이 뜨고, 화면의 작업은 남아 있지만 새로고침하면 마지막 저장 시점으로 돌아갑니다. 큰 작업은 JSON 파일로 저장해 두면 다른 기기에서도 그대로 불러올 수 있습니다.

되돌리기(실행 취소)는 최근 60단계까지 기억합니다.

공유 링크가 만들어지는 방식

「공유 링크 복사」를 누르면 티어표 전체를 JSON으로 만든 뒤 브라우저의 압축 기능(deflate)으로 줄여 주소의 # 뒤에 넣습니다. # 뒷부분은 서버로 전송되지 않으므로, 링크가 7,000자 이하라면 서버를 전혀 거치지 않습니다.

이미지가 있으면 링크가 금방 길어집니다. 7,000자를 넘으면 먼저 이미지를 긴 변 96픽셀·품질 0.6으로 다시 줄여 보고, 30,000자를 넘으면 이미지를 빼고 글자와 배치만 담습니다. 그래도 넘으면 링크를 만들지 않습니다.

링크에 담기 어려울 때는 서버 보관을 선택할 수 있습니다. 이 사이트에서 사용자가 만든 내용이 서버로 가는 유일한 경로이며, 묻는 창에서 「예」를 골랐을 때만 올라갑니다. 보관 기간은 1시간·하루·1년 중에서 고르고, 누군가 코드를 열 때마다 기한이 다시 채워집니다.

PNG로 저장할 때

PNG는 화면을 캡처하는 것이 아니라 캔버스에 새로 그립니다. 한 줄에 들어가는 칸 수를 표 너비로 계산해 넘치면 줄을 늘리고, 빈 등급 줄도 칸 하나 높이는 유지합니다. 저장 배율은 1×·2×·3×이며 기본은 2×입니다. 칸 크기 84픽셀이면 2×에서 한 칸이 168픽셀로 그려집니다. 브라우저가 지원하면 파일 저장 대신 클립보드로 바로 복사할 수도 있습니다.

예시

사용 방법

1. 프리셋(S~F, 별점, 취향 등)을 고르고 제목을 적습니다.
2. 이미지를 끌어다 놓거나 붙여넣고, 필요하면 글자 항목을 추가합니다.
3. 대기열의 항목을 각 등급 줄로 끌어 옮깁니다.
4. PNG로 저장하거나 공유 링크를 복사합니다.

자주 묻는 질문