UI/UX設計

送信ボタンをタップした瞬間、画面が切り替わって「あ、間違えた」——そんな経験はありませんか。Power Appsは一度Patchで保存してしまうと簡単に取り消せません。だからこそ、送信前に確認ダイアログを挟む設計が重要です。 なぜ確認ダイアログが必要なのか スマートフォンで使うアプリであれば、タッチ操作のミスは日常茶飯...

送信してからエラーに気づく。これがユーザーにとって最もストレスの高いUXのひとつです。どの項目が問題なのかを送信前に一目でわかるように、Power Appsでは枠線の色や背景色を動的に変えることができます。入力ミス防止の設計全体についてはPower Apps入力ミス防止ガイドでまとめているので、UX設計の全体像と合わせ...

Power Apps でモダンなUIを作りたいなら、コンテナの設計を避けて通れません。コントロールをばらばらに並べる時代は終わりました。 私が最初にコンテナを触ったときは、正直なところこれ、何が便利なの？と思っていました。座標でコントロールを置いていく旧来のやり方に慣れていたので、コンテナの概念が最初はピンとこなかった...

Power Apps のコンテナを使うと、アプリのレイアウト管理がまるで別物になります。旧来の座標配置との違いを理解しておくだけで、画面サイズ対応やコントロールの並び替えがぐっと楽になるので、ぜひ最後まで読んでください。 旧来の配置方式とは何か X・Y座標でコントロールを固定する仕組み Power Apps の旧来のア...

Power Apps のコンテナには手動レイアウトとオートレイアウトの2種類があります。どちらを選ぶかでアプリの設計の自由度と保守のしやすさが大きく変わるので、最初に整理しておくことをおすすめします。 2種類のコンテナの概要 手動レイアウト（Manual Layout）とは 手動レイアウトは、コンテナの中に追加した子コ...

Power Apps のコンテナでレイアウトを組むとき、子要素の整列とサイズ配分を制御するプロパティを理解しているかどうかで、完成度が大きく変わります。この記事ではオートレイアウトで使う主要プロパティを一通り整理します。 整列を制御する2つのプロパティ LayoutAlignItems：交差軸方向の整列 LayoutA...

Power Apps でコンテナを使ってレイアウトを組むとき、最初につまずくのがどこからコンテナを入れ始めるかです。この記事では、画面をセクションに分割するときの考え方を一つのシンプルな問いに落とし込んで解説します。 設計はコードより先に始まる ワイヤーフレームで分割を決めてから手を動かす コンテナのレイアウト設計で一...

Power Apps でダッシュボードを作るとき、KPIカードは画面の顔になります。今月の件数・前月比・直近7日間の3枚を横並びで並べて、アプリを開いた瞬間に現場の状況が把握できるようにする。コンテナを使えばこのレイアウトを崩れなく、メンテナンスしやすい構造で実装できます。 カード1枚の基本構造 KPIカードは2層のコ...

Power Apps のギャラリーは、そのままでは細かいレイアウト調整が難しいコントロールです。内側にコンテナを組み合わせることで、余白・整列・パディングを自由にコントロールできるようになります。 なぜギャラリー内にコンテナが必要なのか ギャラリーコントロールには TemplatePadding というプロパティがあり...

Power Apps のネイティブグラフコントロールはデザインのカスタマイズに限界があります。SVGコードを Image コントロールで表示すれば、棒グラフもドーナツグラフも自分で設計できます。コードが動くグラフなので、データが変われば見た目も自動で変わります。 なぜ SVG を使うのか Power Apps のネイテ...