マガジンのカバー画像

ガイドライン

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

記事一覧

みんなの銀行デザインシステム、始めました。

みんなの銀行デザインシステム、始めました。

みんなの銀行 プロダクトデザイナーの中野です。今回はプロダクトデザインチームとフロントエンドエンジニアチームで一緒に取り組んでいる、みんなの銀行のデザインシステム作りについてご紹介します。

まだまだ開発途中の取組みですが、どんなふうに進めてきているのかをお届けできればと思います!

デザインシステムとはデザインシステムとは「プロダクトデザイナーとフロントエンドエンジニアが共通認識を持つための仕組

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

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

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

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

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

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

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

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

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

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

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

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

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

もっとみる
クラシルのWebチームでデザインシステムを少しずつ構築していっている話

クラシルのWebチームでデザインシステムを少しずつ構築していっている話

delyのWebチームでプロダクトデザイナーをやってるkassyです。

現在、Webチームではデザインシステムを少しずつ導入しています。今日はその取り組みについてご紹介したいと思います。

今回の作業を行ったチームのメンバー構成
デザイナー × 1
フロントエンドエンジニア × 2
フロント兼サーバーサイドエンジニア × 1

デザインシステムとはなにか
とはいえデザインシステムと言われてもなん

もっとみる
その会社「らしさ」があるWEBのつくり方  【コーポレートサイト制作の教科書2】

その会社「らしさ」があるWEBのつくり方 【コーポレートサイト制作の教科書2】

㍿ブルーパドルでは、PR企画、商品企画、こどもコンテンツ以外に、コーポレートサイトや、WEBもいろいろ作っています。

このシリーズでは、WEBやコーポレートサイトについて書きます。シリーズ2つ目は「その会社らしいWEB」の作り方の話です。

サイトを作る人にも、サイトを依頼する担当者にも役立つ話なので、良かったら読んでみてください。

あと、1つ目の記事「ページ数が多いWEBは、作る人も見る人も

もっとみる
モバイルアプリ日本語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

もっとみる
ブランドコンサル会社が使う「ブランドの人格を視覚化するブランドアーキタイプ」とは

ブランドコンサル会社が使う「ブランドの人格を視覚化するブランドアーキタイプ」とは

こんにちは。B&H Inc.でストラテジックプランナーとディレクター・プロジェクトマネージャーをやっております金山です。第2回目の投稿です。

前回は、こちら記事で弊社のビジュアルがアウトプットされるまでのフローを記事にしてみました。まだの方はこちらもぜひ。

今回は弊社がブランドデザインを行うにおいて、とても大切にしている「12種類のアーキタイプ」という人格分析(ブランドパーソナリティ分析)とし

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

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

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

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

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

もっとみる
みんなで使えるデザインガイドライン「SmartHR Design」ができました|SmartHRオープン社内報

みんなで使えるデザインガイドライン「SmartHR Design」ができました|SmartHRオープン社内報

※ 2020年 9月 3日 追記
デザインシステム「SmartHR Design」がお引越し&アップデートしたため、最新情報はこちらからご覧ください。

おつかれさまです。コミュニケーションデザイングループのさめまる(@samemaru_saxo)です。

このたび、だれでも!効率よく!SmartHRらしく!表現できるのを目標とした、デザインガイドラインができました!

▶️ SmartHR De

もっとみる