2GISモバイルバージョンのインターフェイスデザイン

都市版ディレクトリDublGISのモバイルバージョンの設計をどのように行ったかについてお話ししたいと思います。 設計に興味がない場合でも、スクリーンショットでアプリケーションの機能を確認できるので、投稿はまだ有用ではない可能性があります。これは将来実装されます。

画像 2GISプログラムの新しいモバイルバージョンのグラフィックデザインを開発するために、市内地図を使用して組織のディレクトリを作成するDoubleGIS社から連絡がありました。 インターフェイスの主な要件は、開発の容易さと非標準解像度の画面での正しい表示でした。 このプログラムは、Windows Mobile、Symbian、およびAndroidプラットフォームで実行されます。 タッチスクリーンでは、指とスタイラスの両方を制御できる必要があります。 タッチスクリーンのないデバイス-ハードウェアコントロール(ジョイスティック、ボタン)の助けを借りて。


プログラムの主な機能に切り替えることができるメイン画面から始めました。 イコライゼーションは明るい感情的なデザインで行われましたが、DublGISのコーポレートアイデンティティのリーダーシップの要件を考慮に入れました。
画像
モバイルアプリケーションのホーム画面

画像

メイン画面のすべてのステータスアイコン

次に、多種多様な「内部」スクリーンを作成し始めました。 このアプリケーションはモバイルですが、優れた機能を備えています。 その過程で、あらゆる種類のボタン、アイコン、ポインター、その他のグラフィックスを描きました。

画像
ディレクトリと会社のカード

画像
仮想キーボードと組織の地図表示

画像
フラットおよび3Dナビゲーション

画像

ナビゲーション用の方向ピクトグラム

画像
公共交通機関のルーティングと既成ルート

画像
トランスポート、オブジェクトなどのピクトグラム

画像
拡張現実ブラウザ

各画面は2つの画面解像度で描画されたため、どの電話でもグラフィックが美しく鮮明になりました。
画像

Source: https://habr.com/ru/post/J119496/


All Articles