Daily UI #027 Dropdown

こんばんは、お疲れ様です。

今回のお題はドロップダウンということで、
言語選択のドロップダウンリストを考えてみました。

言語選択のUIについては、エンジニアとしてサービスに言語切り替えドロップダウンリストを追加した経験があります。
その時に調べて理解したのは以下の２点です。

• 国旗は使わない

• ラベルは各言語で表記する

国旗は使わない

一番わかりやすいのが「英語」ですね。
アメリカ、イギリス、オーストラリア、カナダ…
１つの言語に対して、どの国旗を表示するの？ってなります。
ちなみに、Pinterestで調べていたときに、
「国旗があった方が良い」という意見を見ました。
理由としては、

• 国旗の方が文字より見つけやすい

• 同じ言語でも国によって違いがある

ということでした。
確かに、文字を読んで求める言語を探すより、パッと見てカラーの国旗のイラストを見た方が直感的にわかりやすいのはわかる気がします。
とはいえ、上記の問題があるし…ということで国旗を使わないように、という意見が多数派です。
また、同じ言語でも国によって違いがあるので、例えばこのように表示したらいいのでは？という意見がありました。
　ブラジルの国旗＋「ポルトガル語」
　ポルトガルの国旗＋「ポルトガル語」

これについては、「ポルトガル語（ブラジル）」、「ポルトガル語（ポルトガル）」と表記すれば解消できそうです。

ラベルは各言語で表記する

もともと日本語になっていたとして、日本語があまりわからないベトナム人がベトナム語に切り替えたい場合、「ベトナム語」と日本語で書かれていても切り替えるのは困難です。
それぞれの言語で「○○語」を表記することが、各言語話者にとって優しいデザインです。

これらのことを考慮して作成したドロップダウンです。
（実際にクリック可能です。）

ということで、今日はこの辺で。次もがんばります！