マガジンのカバー画像

ガイドライン

11
運営しているクリエイター

#UIデザイン

デザインシステム【アイコンデザインルール設計】〜プロセス大解剖〜

デザインシステム【アイコンデザインルール設計】〜プロセス大解剖〜

エクサウィザーズでAIプロダクトのUI/UXデザイナーを担当している吉田です。前回はデザインシステムのアルゴリズムを活用したカラーパレット開発についてご紹介しました。今回はアイコンのデザインをどのように定義していったかのプロセスをご紹介します。

デザインシステムを開発する前の状態エクサウィザーズは 2016年に AI スタートアップ会社として起業してから、「AIを用いた社会課題解決を通じて幸せな

もっとみる
検索結果の絞り込み・並び替えUIの観察

検索結果の絞り込み・並び替えUIの観察

先日、検索結果の絞り込みUIの検討をするために事例を調べたところ、意外にもアプリによって様々な違いがありました。面白いテーマなため観点ごとに違いを整理し、メリット・デメリットや設計意図を考察しました。注目した観点は以下の7つの点です。

これらの観点をもとに以下の条件で12のアプリを調査しました。

1. 絞り込み・並び替えボタンの配置
まずは、絞り込み・並び替えボタンの配置場所について。ボタンの

もっとみる
大量の機能により複雑化したUIをシンプルにするために行っていること【マネーフォワード ME】

大量の機能により複雑化したUIをシンプルにするために行っていること【マネーフォワード ME】

マネーフォワードのデザイナーの池内(@KD6JOE)です。私の携わっているマネーフォワード MEというアプリは、サービス開始から7年が経過し、たくさんの機能が追加されてきました。機能の追加はサービスの成長に貢献した一方、UIは複雑化し、新規ユーザーがとっつきにくい要因にもなっています。

この記事では、機能が増え、UIが複雑化したことでどのような問題が起こっているか、どのように対処しようとしている

もっとみる
モバイルアプリ日本語UIキットの公開

モバイルアプリ日本語UIキットの公開

この記事では、三菱UFJフィナンシャル・グループの戦略子会社であるJapan Digital Design(JDD)において、体験デザインを担うExperience Design Team(デザインチーム)の研究活動で作成したFigma用日本語UIキットについて紹介します。

JP + UI Kit とは?JP + UI Kitは、iOSとAndroidのモバイルアプリに対応したFigma用日本語

もっとみる
エンジニア以外にも知ってほしい Android の UI Components

エンジニア以外にも知ってほしい Android の UI Components

Android で使用する基本的な UI Components の紹介をしていこうと思います。

エンジニアが実装する時の Class 名と Material Design の名称が違うものもあるのですが、デザイナーは Material Design のガイドラインを参考にすることが多いと思うので、基本はガイドラインの名称を使っています。

# NavigationDrawer、BottomNav

もっとみる
UIデザインで迷ったら、まず要素を分解してみよう

UIデザインで迷ったら、まず要素を分解してみよう

自動家計簿・資産管理サービス「マネーフォワード ME」のデザイナー池内です。この記事では、「要素の分解」を使ったUIデザインの進め方を紹介します。

UIデザイン時に考えることが多すぎてどこから手を付けたらいいかわからない、なかなかチームの議論がまとまらない時などの参考になさってください。

参考例:マネーフォワード MEのホーム画面予算表示「要素の分解」の例として、先日マネーフォワード MEのA

もっとみる