こんにちは、デザイナーの小林です。
最近スマホデザインで、アプリデザインや、機能性を持たせたUIのデザインが求められることが多くなってきました。
Photoshopで幅640pxで作成後、実機で確認をするのですが、どうも文字サイズを決めるのに毎回迷ってしまいます。
「小さすぎるんじゃないか？」
「見出しと本文の違いがパッと見で分かるだろうか？」などなど…
そこで普段見慣れているだろう、スマホのデフォルトの純正アプリや有名アプリの文字サイズを調べてみました。
検証方法
- iPhone4S（古くてスイマセン）でキャプチャーとる
- Photoshopで上からテキストをトレース。（このときの文字設定の数値を記載しています。）
ホーム画面
通話履歴
メール
リマインダー
メモ帳
ミュージック
Google Chrome
Youtube
はてなブックマーク
evernote
以上が調べた結果です。
自分が思っていたよりも、やはり見出しは全体的に大きめでした。
本文は大体24～28ｐｘ、見出しは26～34pxが平均的かと感じます。
また、余談ですが、リスト上のデザインは上下30pxずつ余白をとっているものが多かったです。
左右の余白は30pxのものが多く、情報を詰めたいものは20pxといった印象です。
要素の前後関係や、全体のトンマナ、そのアプリ、サイトの目的などから、一概にこのサイズにしておけば良いと言えるものではありませんが、ひとつの指標になるのではないでしょうか。
それにしてもiPhone4S、iOSアップロードしてからしょっちゅう落ちます…いい加減、機種変更したいと思います。それではまた。
