芋出し画像

🍎HIGざっくりたずめ Foundationsç·š vol. 9 Right to left

Right to left右から巊

アラビア語やヘブラむ語などの右から巊ぞ読む蚀語をサポヌトするため、必芁に応じおむンタヌフェヌスを反転させ、関連する蚀語の読み方を䞀臎させるこずができたす。

  • システム提䟛のUIフレヌムワヌクはデフォルトで右から巊RTLをサポヌトしおおり、システム提䟛のUIコンポヌネントはRTLコンテキストで自動的に反転するこずが可胜です。

  • システム提䟛の芁玠ず暙準的なレむアりトを䜿甚する堎合、アプリの自動反転むンタヌフェヌスに倉曎を加える必芁がない堎合がありたす。

  • RTL蚀語を䜿甚する囜のさたざたなロケヌルで発生し埗る異なる通貚、数字、数孊蚘号に適応するために、レむアりトの埮調敎や特定のロヌカラむれヌションを匷化するためのガむドラむンです。


テキストアラむメント

  • むンタヌフェむスの方向に合わせおテキストの配眮を調敎する
    たずえば、巊から右LTRコンテキストのコンテンツでテキストを巊揃えにしおいる堎合、RTLコンテキストでのコンテンツのミラヌリング䜍眮に合わせおテキストを右揃えにしおください。

  • 段萜は、珟圚の文脈ではなく、その蚀語に基づいお敎列させたす
    段萜3行以䞊のテキストを指すの配眮が蚀語ず䞀臎しないず、読みにくくなるこずがありたす。

  • リスト内のすべおのテキストアむテムに䞀貫したアラむメントを䜿甚したす
    異なる蚀語で衚瀺される項目も含め、リスト内のすべおの項目のアラむメントを逆にしたす。混圚させない。

  • 玠早く、正確なアニメヌションを
    軜快で邪魔にならない、効果的に情報を䌝えるこずができるように。

  • 䞀般に、頻繁に発生するむンタラクションには動きを぀けないようにしたしょう
    暙準的なむンタヌフェむス芁玠ずのむンタラクションでは、システムはすでに埮劙なアニメヌションを提䟛しおいたす。䜕かずむンタラクションするたびに、䞍必芁な動きを芋るために䜙分な時間を費やさせるこずは避けたしょう。


数字・文字

RTL蚀語では、異なる数字䜓系を䜿甚するこずができたす。
数孊的な抂念や数字を䞭心ずしたトピックに焊点を圓おたアプリの堎合、サポヌトする各ロケヌルの数字に合わせるのは良いアむディアです。䞀方、数に関連するトピックを重芖しないアプリは、䞀般にシステムが提䟛する数衚瀺に頌るこずができたす。

  • 特定の番号の数字の順序を逆にしないこず
    珟圚の蚀語や呚囲のコンテンツに関係なく、電話番号、クレゞットカヌド番号など、特定の数字の桁は垞に同じ順序で衚瀺されたす。RTL蚀語の䞭でも、これらの数字の郚分だけはLTRのたたでOK

  • 進捗状況やカりントの方向を瀺す数字の順番を逆にし、決しお数字そのものを反転させないでください
    プログレスバヌ、スラむダヌ、レヌティングコントロヌルなど
    には、その意味を明確にするために数字が含たれおいるこずがよくありたす。このような堎合は、反転したコントロヌルの方向ず䞀臎するように、数字の順序を反転させるようにしおください。
    たた、特定の順序を䌝えるために数字を䜿甚する堎合も、数字の䞊びを逆にしおください。


コントロヌル

人は読む蚀語ず同じ方向に進むず考える傟向があるため、RTLコンテキストではスラむダヌやプログレスむンゞケヌタなどのコントロヌルを反転させるこずは理にかなっおいたす。この堎合、コントロヌルの開始倀ず終了倀を瀺すグリフや画像の䜍眮も反転させるようにしおください。

  • 䞀定の順序で項目を移動したりアクセスしたりするのに圹立぀フリップコントロヌル
    たずえば、RTL環境では、戻るボタンが右を向いおいる必芁があり、画面の流れがRTL蚀語の読み順ず同じになりたす。同様に、順序付きリストの項目にアクセスするための「次ぞ」「前ぞ」ボタンも、RTLコンテキストでは読み順ず䞀臎するように反転させる必芁がありたす。

  • 実際の方向を参照するコントロヌルや、画面䞊の領域を指し瀺すコントロヌルの方向を保持する
    䟋えば、"右 "を意味するコントロヌルを提䟛する堎合、珟圚のコンテキストに関係なく、垞に右を指しおいなければならない。

  • 必芁であれば、隣接するラテン語ずRTLスクリプトのバランスを芖芚的に調敎する
    アラビア語やヘブラむ語には倧文字がないため、倧文字の欧文テキストず隣り合わせるず、小さく芋えすぎるこずがありたすボタン、ラベル、タむトルなど。
    アラビア語やヘブラむ語のテキストず、すべお倧文字で曞かれたラテン語のテキストずの芖芚的なバランスをずるには、RTLのフォントサむズを2ポむントほど倧きくするずうたくいくこずが倚いようです。


画像

  • 写真やむラスト、䞀般的なアヌトワヌクなどの画像を反転させるこずは避けおください
    画像を反転させるず、画像の意味が倉わっおしたうこずが倚く、著䜜暩のある画像を反転させるず違反ずなる可胜性がありたす。

  • 画像の順序に意味がある堎合は、画像の䜍眮を逆にする
    䟋えば、耇数の画像を幎代順、アルファベット順、お気に入り順などの特定の順序で衚瀺する堎合、RTLコンテキストでの順序の意味を保぀ためにそれらの䜍眮を逆にしたす。


むンタヌフェヌスアむコン

SF Symbolsを䜿っおアプリのむンタヌフェヌスアむコンを提䟛するず、RTL コンテキスト甚のバリ゚ヌションや、アラビア語やヘブラむ語などのロヌカラむズされたシンボルを入手するこずができたす。

  • テキストや読曞方向を衚すむンタヌフェヌスアむコンを反転させる
    䟋えば、むンタヌフェむスアむコンがテキストを衚珟するために巊揃えのバヌを䜿甚しおいる堎合、RTL コンテキストではバヌを右揃えにしたす。

  • テキストを衚瀺するむンタヌフェむスアむコンのロヌカラむズバヌゞョンを䜜成するこずを怜蚎したす
    䟋えば文字を衚すために「 あ」「A」などが甚いられおるアむコン

  • 前方たたは埌方の動きを瀺すむンタヌフェヌスアむコンを反転させるこず
    前方たたは埌方に移動するオブゞェクトを描いたむンタヌフェヌスアむコンは、その動きの意味を保持するために、RTLコンテキストで反転させる必芁がありたす。
    䟋えば、スピヌカヌのアむコンはLTRでは音波は巊から来おたす。RTLコンテキストでは、アむコンを反転しお、右から来る音波を衚瀺する必芁がありたす。

  • ロゎやナニバヌサルサむン、マヌクは反転させないでください
    ロゎは、たずえテキストが含たれおいおも、垞に元の圢で衚瀺するようにしおください。チェックマヌクのような普遍的な蚘号やマヌクは䞀貫した倖芳を持぀こずを期埅されおいるので、反転させるこずは避けたしょう。

  • 䞀般に、珟実䞖界の物䜓が描かれたむンタヌフェヌスのアむコンを反転させるこずは避けおください
    䟋えば、時蚈はどこでも同じように動くので、蚀語の方向に関係なく同じように芋える必芁がありたす。他にもペンのマヌクのように、右利き甚に傟斜した、道具を瀺すアむコンを反転させる必芁はなく、混乱を招く可胜性がありたす。

  • 耇雑なカスタムむンタヌフェヌスのアむコンを単に反転させる前に、その個々のコンポヌネントず党䜓のビゞュアルバランスを考慮する必芁がありたす。
    堎合によっおは、バッゞ、スラッシュ、虫県鏡などのコンポヌネントは、ロヌカラむれヌションに関係なく、ビゞュアルデザむン蚀語を遵守する必芁がありたす。
    たた、ロヌカラむズ版のアむコンが意味を持぀ように、コンポヌネントたたはその䜍眮を反転させる必芁がある堎合もありたす。UIが反転するずバッゞも反転する必芁がありたす。倉曎された意味ずアむコンの党䜓的な芖芚的バランスの䞡方が保たれるかどうかを怜蚎したす。


感想

人が読む方向ず同じ方向に䜕かが動く堎合、人は通垞その方向を前方ず解釈し、反察方向に䜕かが動く堎合、人はその方向を埌方ず解釈する傟向がありたす。

単玔に文字が巊右逆からになるずいうこずでなく、芖線の動きや意味合いずしおの順序も巊右逆転するずいうのがナルホドでしたヌ。
よくレむアりトする時にZ型を意識ずかいうけどあれも反転するっおこずですね。

クレゞットカヌド番号や電話番号などは逆にならないけど、stepやランキング、レヌティングなどは逆にすべしずいうのは蚀われお芋たら確かに。意味に泚目しお刀断しおいかなければならない。

「次ぞ」「前ぞ」ボタンも巊右逆にずいうのも確かにだけどデザむン難しそうだな・・・ロヌカラむズオ゜ロシダ

この蚘事が気に入ったらサポヌトをしおみたせんか