web-dev-qa-db-ja.com

仮想ナビゲーションバーを備えた電話とハードウェアナビゲーションボタンを備えたその他の電話など、Nexus 5のアプリのワイヤーフレームの設計の違い

ご存じのとおり、Nexus 5やMoto Gのような電話には、在庫のような仮想ナビゲーションナビゲーションバーが付属していますAndroid背面、ホーム、マルチタスクボタンがあり、新しいAsus Zenphoneなどの電話があります。ハードウェア/容量ボタンがあります。

Moto GとZenphoneのような電話の両方の解像度は720x1280です。

同じ目的でゼロピクセルが割り当てられている他の電話と比較して、約144ピクセルがMoto G仮想ナビゲーションバーに移動します。ワイヤーフレームを設計するとき、どうすればこれを克服できますか?

Moto G with Virtual navigation bar

Other phones without the virtual navigation bar

両方の種類の電話でワイヤフレームがまったく同じに見えるようにする必要があります。通常、psdにナビゲーションバーを追加し、その背後のスペースを使用しませんが、ハードウェアナビゲーションボタンを備えた電話では、このスペースは空のままです。私は開発者に尋ねました、そして彼はこれについての手がかりがありませんか?私は明確であることを望みます。

3
Dheeraj Shetty

まず、ワイヤーフレームは高忠実度の画面ではないため、ピクセルの完全性を追求することは主な目的ではありません。

とはいえ、Android画面はdensityと同様にサイズに依存します。Googleの 画面のサポート ページは明確にするのに役立ちます。

Androidの前に開発しましたが、完全な完成度を達成するよりも、基本的なレイアウトを作成することが重要です。視聴者に最も人気のある電話(GalaxyまたはNexusライン)から始めます。画面を作成します。各仮想ボタンとハードウェアボタンについて、時間がある場合は1つまたは2つのデバイスに移動します。

Hi-Fiの場合は、電話を選択するだけです。テクスチャがないため、Galaxy Sシリーズよりも見た目がきれいなNexus 5を好みます。その後、その中に作業を置きます。

PS。エクスポートするときは、開発者を助け、xhdpi、hdpiなどを保存するようにしてください。

3
mrchaarlie

1)ワイヤーフレームは、完全なピクセルであってはなりません。

2)複数の画面に対応するアプリを設計するときは、画面サイズのわずかな違いがデザインに影響を与えないように、「遊び」の余地があるように設計します。したがって、いいえ-短期的な目標が庇護に住むことでない限り、要素の正確なピクセル配置はありません。

3)より一般的な3つのAndroid=解像度を選択します。テストのためにその作業を想定します。

4)開発者との関係を深める。個々の開発者が小さな個々の問題を解決できる標準を設定することにより、一緒に作業することが基本です。

弾丸ポイントで偉そうに聞こえるつもりはないが、彼らは仕事を成し遂げる:)

乾杯!

1
Luis