International Design
SEED 디자인은 전 세계에서 똑같이 유용하고 가치있는 경험을 제공할 수 있도록 돕습니다.
개요
국제화는 단순한 언어 번역을 넘어서는 복잡한 작업입니다. 어느 언어로 번역하더라도 톤, 용어, 표현이 일관되게 전달되어 브랜드 아이덴티티와 사용자 경험이 보존되어야 합니다. 또한, 각 지역 문화와 언어에 맞게 다가가, 사용자가 신뢰하고 적극적으로 활용할 수 있어야 합니다. 이 가이드는 다양한 언어와 문화에 대응하는 디자인을 위한 지침을 제공합니다.
로케일 요소 대응 (Managing Locale Elements)
국제화의 핵심은 다양한 문화와 언어에 맞춰 UI 요소가 유연하게 변화할 수 있도록 설계하는 것입니다. 아래 항목들을 통해 각 로케일별로 고려해야 할 사항을 정리합니다.
시간 및 날짜 형식 (Time and Date Formats)
영어는 일반적으로 지역명이 한국어보다 길어 공간 제약이 생길 수 있습니다. 따라서, 시간을 한국어보다 짧게 표시합니다.
상대적 시간 표기
사용자에게 경과 시간을 명확하게 전달하기 위해 각 로케일에 맞는 표기 방식을 사용합니다.
| 기준 | ko_KR | en_CA, en_US, en_GB | ja_JP | 비고 |
|---|---|---|---|---|
| 매우 짧은 시간 | 방금 전 | Just now | たった今 | |
| 초, 단수 | 1초 전 | 1s | 1秒前 | |
| 초, 복수 | 2초 전 | 2s | 2秒前 | |
| 분, 단수 | 1분 전 | 1min | 1分前 | m으로 작성 시 mile과 헷갈릴 수 있기 때문에, min을 사용 |
| 분, 복수 | 2분 전 | 2min | 2分前 | |
| 시간, 단수 | 1시간 전 | 1h | 1時間前 | |
| 시간, 복수 | 2시간 전 | 2h | 2時間前 | |
| 일, 단수 | 1일 전 | 1d | 1日前 | |
| 일, 복수 | 2일 전 | 2d | 2日前 | |
| 주, 단수 | 1주 전 | 1w | 1週間前 | |
| 주, 복수 | 2주 전 | 2w | 2週間前 | |
| 월, 단수 | 1달 전 | 1mo | 1か月前 | |
| 월, 복수 | 2달 전 | 2mo | 2か月前 | |
| 년, 단수 | 1년 전 | 1y | 1年前 | |
| 년, 복수 | 2년 전 | 2y | 2年前 |
날짜 표기
| ICU Locale ID | Standard Date | Compact Date |
|---|---|---|
| ko_KR | 2015년 7월 16일 | 7월 16일 |
| en_GB | 16 Jul 2015 | 16 Jul |
| en_CA | Jul 16, 2015 | Jul 16 |
| en_US | Jul 16, 2015 | Jul 16 |
| ja_JP | 2015年7月16日 | 7月16日 |
| ICU Locale ID | Standard Date | Compact Date |
|---|---|---|
| ko_KR | yyyy년 M월 d일 | M월 d일 |
| en_GB | dd MMM yyyy | dd MMM |
| en_CA | MMM dd, yyyy | MMM dd |
| en_US | MMM dd, yyyy | MMM dd |
| ja_JP | yyyy年M月d日 | M月d日 |
요일 및 시간 포함 날짜 표기
| ICU Locale ID | 요일 및 시간 포함 | 요일 포함 |
|---|---|---|
| ko_KR | 7월 16일 (수) 오후 9:41 | 7월 16일 수요일 |
| en_GB | Wed 16 Jul at 9:41 PM | Wed 16 Jul |
| en_CA | Wed, Jul 16 at 9:41 PM | Wed, Jul 16 |
| en_US | Wed, Jul 16 at 9:41 PM | Wed, Jul 16 |
| ja_JP | 7月16日(水) 21:41 | 7月16日(水) |
| ICU Locale ID | 요일 및 시간 포함 | 요일 포함 |
|---|---|---|
| ko_KR | M월 d일 (E) a h:mm | M월 d일 eeee |
| en_GB | E d MMM at h:mm a | E d MMM |
| en_CA | E, MMM d at h:mm a | E, MMM d |
| en_US | E, MMM d at h:mm a | E, MMM d |
| ja_JP | M月d日(E) HH:mm | M月d日(E) |
숫자 및 단위 표기 형식 (Counter and Number Formats)
숫자와 단위의 순서
특정 데이터 또는 이벤트의 개수를 나타내는 단위(예: 조회수, 좋아요 등)는 언어별로 숫자와 단위의 위치가 다를 수 있습니다. 이에 따라, 통일성 있는 표기를 유지하기 위해 아래 예시를 참고합니다.
| ICU Locale ID | 조회수 예시 | 후기 예시 (단수) | 후기 예시 (복수) | 비고 |
|---|---|---|---|---|
| ko_KR | 조회수 3만 | 후기 1개 | 후기 3개 | |
| ja_JP | 閲覧数 3万 | レビュー 1件 | レビュー 3件 | |
| en_CA, en_GB, en_US | 30K views | 1 review | 3 reviews | 복수형 구분 |
큰 수 표기 방식
숫자 표기는 언어별로 사용 방식과 단위에 차이가 있습니다. 따라서, 숫자를 한국어에서 다른 언어로 또는 그 반대로 변환할 때는 이러한 차이를 고려해야 합니다.
- 한국어에서는 만(10,000) 단위로 숫자를 세는 반면, 영어에서는 천(1,000) 단위로 숫자를 셉니다.
- 예를 들어, 100,000은 한국어로 "십만"이지만 영어로는 "one hundred thousand"입니다.
- 한국어에는 억(100,000,000) 단위가 있지만, 영어에서는 이에 해당하는 별도의 단위가 없고 100 million으로 표현합니다.
| Number | ko_KR | en_CA, en_GB, en_US | ja_JP | 비고 |
|---|---|---|---|---|
| 123 | 123 | 123 | 123 | |
| 1,230 | 1.23천 | 1.23K | 1,230 | 일본어에서 '千' 단위를 소수점과 함께 사용하지 않습니다. |
| 12,300 | 1.23만 | 12.3K | 1.23万 | |
| 123,000 | 12.3만 | 123K | 12.3万 | |
| 1,230,000 | 123만 | 1.23M | 123万 | |
| 12,300,000 | 1,230만 | 12.3M | 1,230万 | |
| 123,000,000 | 1.23억 | 123M | 1.23億 |
기타 주요 형식 (Other Important Formats)
거리, 통화, 전화번호 및 강조 표기
| ICU Locale ID | 거리 | 통화 | 전화번호 | 강조 표기 |
|---|---|---|---|---|
| ko_KR | km | 1,234,567원 | 010-XXXX-XXXX | 'abc' |
| en_CA | km | $12,345.67 | (AAA) XXX-XXXX | "abc" |
| en_GB | mi | £12,345.67 | 07XXX XXXXXX | 'abc' |
| en_US | mi | $12,345.67 | (AAA) XXX-XXXX | "abc" |
| ja_JP | km | 1,234,567円 | 0A0-XXXX-XXXX | 「abc」 |
구간 표기
한국어에서는 구간 표기에 물결표(~)를 사용하지만, 영미권에서는 En Dash (–)를 주로 사용합니다. 당근 서비스에서는 지역 및 언어에 관계없이 Hyphen(-)으로 통일하여 사용합니다.
괄호의 사용
언어마다 괄호 사용법에 차이가 있으므로 아래 예시를 참고합니다.
| 언어 | 텍스트 | 비고 |
|---|---|---|
| Korean | 매일 운동을 한다(매일 30분) | |
| English | Exercise every day (30 min per day) | 영어에서는 괄호와 앞 단어 사이에 반드시 띄어쓰기를 포함합니다. |
| Japanese | 毎日運動をする(毎日30分) | ( ) : 한국어에서 사용되는 방식과 동일하게 활용합니다. 「 」 : ( )와 같은 용도로 사용하지 않습니다. 특정 단어를 강조하거나, 인용문을 표시할 때 사용합니다. |
디자인 고려 사항
번역 후 텍스트 길이 변화
텍스트 확장 대비
한국어에서 다른 언어로 번역 시 단어 길이와 문자 수가 달라져 버튼, 레이블 등 고정폭 UI 요소에 영향을 줄 수 있으므로 충분한 여유 공간을 확보해야 합니다.
| 언어 | 텍스트 | 글자수 |
|---|---|---|
| Korean | 저장 | 2자 |
| Japanese | 保存 | 2자 |
| English | Save | 4자 |
| German | Speichern | 9자 |
| French | Sauvegarder | 11자 |
예상 확장 비율
아래 표를 참고하여 한국어 원문이 다른 언어로 번역될 때 예상되는 확장 비율을 확인하세요.
| 한국어 원문 글자수 | 번역 시 확장 공간 |
|---|---|
| 10자 이하 | 150% - 250% |
| 11 - 20자 | 130% - 150% |
| 21 - 30자 | 110% - 130% |
| 31 - 50자 | 90% - 110% |
| 51 - 70자 | 80% - 90% |
| 71자 이상 | 80% |
W3의 국제화 관련 글에 자세한 내용이 있습니다.
디자인 레이아웃 적용
- 버튼, 레이블 등 핵심 UI 요소에 긴 번역문이 삽입될 수 있으므로, 디자인 시 충분한 공간 확보 및 텍스트 줄 바꿈(wrap) 처리에 유의해야 합니다.
- Figma에서 pseudoloc 플러그인을 활용해 다양한 언어에서의 텍스트 길이 변화를 사전에 테스트할 수 있습니다.
- 동네명이나 카테고리 명칭 등 경우에 따라 긴 텍스트가 들어갈 수 있으므로, 해당 영역의 레이아웃 반응성을 반드시 점검하세요.
추가 참고 자료 및 테스트 데이터
동네명 예시
영미권의 동네명은 한국어보다 긴 경우가 많으므로, 해당 영역의 디자인 여유 공간을 꼭 확인하세요.
Canada
일반적 예시
- Bay Street Corridor
- Yonge Eglinton
- Waterfront Communities
긴 동네명 예시
- University Of Saskatchewan Management Area (가장 긴 동네명)
- Edmonton Research And Development Park
United States
일반적 예시
- Tribeca
- Upper West Side
긴 동네명 예시
- John F. Kennedy International Airport (가장 긴 동네명)
- Prince of Wales-Hyder Census Area
United Kingdom
일반적 예시
- Barnsbury
- Angel
- Sutton
긴 동네명 예시
- Laughton-en-le-Morthen
Japan
일반적 예시
- 世田谷(Setagaya)
- 松原(Matsubara)
- 三軒茶屋(Sangenjaya)
긴 동네명 예시
- 大字富士山栗原新田 (Fujiyamakurihara Shinden)