--- title: "アプリのUIデザインにおける新機能" date: "2016-04-13" categories: - "applications" - "development" - "mobile" tags: - "app-development" - "apps" - "mobiletogether" - "ui-design" description: MobileTogetherでは、アプリのUIデザインに関する最新情報を確認できます。新しいコントロールや、プラットフォームを問わずシームレスなモバイル開発を可能にする機能強化が実現されています。 --- Status: #blog Tags: #app-development #apps #mobiletogether #ui-design Categories: [low-code+no-code](/blog/ja/category/low-codeno-code.md) | [mobile-development](/blog/ja/category/mobile-development.md) # アプリのUIデザインにおける新機能 「最初の印象は一度きり」という言葉があるように、この昔からの教訓は、今でも様々な場面で当てはまります。モバイルアプリについても同様です。優れたアプリは、ユーザーにとって使いやすく、美しい、そして機能的なユーザーインターフェース（UI）が、その繋がりをスムーズにするのです。 [MobileTogether](https://www.altova.com/ja/mobiletogether.html)は、複雑なプログラミングロジックを基盤とした、洗練されたUIを構築することをこれまで以上に容易にします。最新版では、iOS、Android、Windowsのネイティブアプリ向けの、直感的なインターフェースを開発するための、さらに多くのオプションを追加しました。 ![モバイルアプリケーション](/blog/images/shutterstock_107715224.jpg) ### アプリケーションのユーザーインターフェースデザイン MobileTogetherにおけるUIデザインは非常にユニークです。単一のレイアウトが、すべてのプラットフォームに同時に適用され、ネイティブのiOS、Android、Windows Phone、およびWindows 8/10アプリのコードを生成できます。すべては、その単一のデザインに基づいて行われます。デザインをOSごとにカスタマイズすることも、そうしないことも可能です。いずれの場合でも、MobileTogetherは自動的に、各OSおよびデバイスのサイズに合わせてデザイン要素をレンダリングします。作業中に、組み込みのシミュレーターを使用することで、UIが各プラットフォームの見た目や、デバイスレベルでの表示を確認できます   ![アプリケーション開発シミュレーター](/blog/images/app-simulator.png)   UIデザインは、多くの組み込みコントロールの中から必要なものをデザイン領域にドラッグして配置し、その後、バックエンドデータとの接続を行い、バックエンドデータの処理を定義することで開始できます。   ![モバイルアプリの操作方法](/blog/images/mobiletogether-controls.png)   ### 新しいユーザーインターフェースのコントロール 新しい製品バージョンがリリースされるたびに、開発者からの要望に基づいて、さまざまな機能を追加しています [MobileTogetherの最新版](https://www.altova.com/ja/whatsnew_mobiletogether.html) 30種類以上の新機能が導入されました。その中には、いくつかの新しいユーザーインターフェースのコントロールも含まれています #### **垂直線** この新しい縦線コントロールは、既存の水平線コントロールと組み合わせて使用でき、表の中で列の区切りや配置を強調するのに役立ちます。以下にその例を示します。これは、今回追加された数多くの新機能の一つです [モバイルアプリ内で、テーブルを作成し、表示すること](https://www.altova.com/blog/scrolling-tables-data-driven-mobile-apps/) 最近、新たに導入しました。   ![可動式テーブル ](/blog/images/landscape-50.png)   UI上で、垂直線を配置したい場所にコントロールをドラッグするだけで、簡単に垂直線を定義できます。 #### **スライダーコントロール** 通常、水平方向にスライドさせるタイプのコントロールは、ユーザーが事前に設定された最小値と最大値の間の特定の値を選択するために使用されます。 ポインタの位置は、値の目盛りがなくても、ユーザーが入力した値の目安を示します。 例えば、以下に示す荷物配送アプリで使用されている、損害レベルを示すスライダーなどが挙げられます。   ![水平スライダー](/blog/images/slider-1.png)   #### **メール送信ボタンと共有ボタン** MobileTogether 2.1で導入された新しい共有機能に合わせて、開発者は、ユーザーがすぐに認識できるメールと共有のアイコンを備えたボタンを定義できるようになりました。以下に、同じアプリをiOSとAndroidで表示した画面を示します。ご覧のとおり、各プラットフォームで、それぞれのネイティブな共有アイコンとメールアイコンが自動的に使用されています。   ![メール共有ボタンとアプリ共有ボタン](/blog/images/share-button.png)   これらの新しい機能は、[MobileTogether](https://www.altova.com/ja/mobiletogether.html)において、データ中心のモバイルアプリケーション向けの美しいユーザーインターフェースを構築するための既存の機能に加わるものです。このフレームワークが提供する高度なバックエンドプログラミングと組み合わせることで、あなたのモバイルアプリケーションは、エンドユーザーに間違いなく高い評価をもたらすでしょう。   MobileTogether Designerは無料でご利用いただけます [今すぐお試しください](https://www.altova.com/ja/download/mobiletogether.html)!