マガジンのカバー画像

マネーフォワード・デザイン

410
マネーフォワード所属デザイナーの共同マガジンです。各プロダクトのデザインプロセスや、全社横断のデザイン組織の取り組みについて発信します。デザイナー募集中! ▶応募はこちらから:…
運営しているクリエイター

#UIデザイン

デザイナーの職種、どう選ぶ? 就活生が見つけた「好き」から「できる」を広げる働き方

1. はじめに自己紹介 はじめまして!マネーフォワード25新卒インターンに参加している吉松ももと申します。 現在大学院の修士1年生で、学部ではプロダクト、ビジュアル、空間、キュレーション、ビジネスなど幅広くデザインを学び、大学院ではインダストリアル寄りのプロダクトデザインを中心に学んでいます。 そんな私がなぜ、ITプロダクトのマネーフォワードのインターンに参加したかというと、興味のある分野が幅広く、就活時の業界や職種が絞り込めずにいるからです…🫠 この記事では、そんな

新卒がマネーフォワード MEのFigmaを整理してみた①

この記事で書くこと💡マネーフォワード MEのFigmaを整理したプロジェクトのプロセスを紹介します。デザイナーが増えてきてFigmaの運用に困っている方に特に読んでいただきたいです! Figma整理のプロジェクト内容としては、"デザインフローの明文化"、"デザイントークンの共通化"と、フェーズを2つに分けて行いました。この記事では、フェーズ1の"デザインフローの明文化"について書いています。 Figmaの運用方法などは、開発体制やデザイナーの人数・スキルで違ってくると思うので

マネーフォワード ビジネスカンパニー 基盤デザイン部を大解剖!

マネーフォワード クラウドでは多くのユーザーの課題を解決すべく、次々と新たなプロダクトが生まれています。プロダクトの数に合わせてデザイナーの人数も増えています。 プロダクトやデザイナーが増えたことは嬉しい反面、一貫性のあるデザインを提供する難易度も徐々に増しています。 そこで『マネーフォワード クラウド』のベースとなるデザインの仕組みづくりを担う役割として、近年「基盤デザイン部」が立ち上がりました。本記事では、この「基盤デザイン部」に焦点を当て、所属するデザイナーの活動に

UIは閲覧画面からつくろう。

ユーザー体験的なものをストーリーで整理し次にUIを作成するとき、閲覧・参照系より先に新規作成のUIから考える、というケースをときどき見かけます。 これ、すごい違和感あります。 ストーリーにおいてユーザーはまず新規作成するので、そのまま新規作成から着手してしまう、といったところでしょうか。 その場合、新規作成の目当てたるオブジェクトの姿が曖昧になりがちです。 そうすると、新規作成画面にしか存在しない特殊なレイアウトやコンポーネントや、特に意図がない冗長なモーダルができあが

UIデザインを成功させるために、失敗を恐れずサイクルを回す

自動家計簿・資産管理サービス「マネーフォワード ME」のUIデザイナーの池内です。この記事は、UIデザインを成功させるには、失敗を恐れず繰り返し改善サイクルをまわしたほうが良いという内容です。主にインハウスのUIデザイナーの方の参考になればと思います。 世界は複雑だから、失敗は必ず起きるこれまで様々なUIをデザインをしてきました。しかし、長い期間をかけてデザインした機能がユーザーから不評だったことは一度や二度ではありません。多大なリサーチコストを割き、多くの同僚にフィードバ

UIデザインでのグラフの用法と注意点

自動家計簿・資産管理サービスのマネーフォワード MEのデザイナー池内です。この記事ではUIデザインにおけるグラフの用い方や注意点を、マネーフォワード MEの実際のUIで説明します。Webサイトやアプリでグラフを使っている方は参考になればと思います。 お手元でマネーフォワード MEのアプリを見ながら読んでいただけるとわかりやすいです。ただし、マネーフォワード MEでのグラフの見せ方も完璧ではないので、その点はご留意ください。 円グラフ用法 割合を比較するときに用います。

PdMとデザイナーの期待値のズレを解消!プロジェクト成功に向けた役割可視化の工夫とは?

こんにちは。マネーフォワードの福岡拠点でデザイナーをしている大川です。 今回は、プロダクト開発における各プロジェクトを進行していく中でデザイナーとPdMの間で曖昧になっていたそれぞれの役割決めについて、どう対応したのかについて説明します。 マネーフォワードの開発チームでは様々なプロジェクトが進行しており、デザイナーやPdMが複数のプロジェクトを同時並行して進行していくケースがあります。 そんな中、それぞれのプロダクト開発において、お互いの「できること」と「相手に頼っていいこ

BtoB紙業務をリアルに体験〜ユーザー行動の解像度を上げるデザイナー向け社内イベント大公開

マネーフォワード クラウドでは、企業の様々なバックオフィス業務を効率化するためのサービスを提供しています。プロダクトデザイナーはこのバックオフィス業務の課題に寄り添い日々デザインをしています。 そんなプロダクトデザイナーにとって「ユーザーを理解する」ことはもっとも重要な仕事のひとつですが、デザイナー自身が実際に日々のバックオフィス業務をしているわけではありません。BtoBプロダクトは、BtoCとは異なり、気軽に自分ごととしてサービスを体験しにくいため、その他の手段でユーザー

複数拠点でチームワークを高めるためにデザイナーができる仕事術、すべて話します。

「最近のインドの状況はどうですか?」「福岡にも今度行きますね」。マネーフォワード東京オフィスのデザイナー席では、よくこんな会話が聞こえてきます。 マネーフォワードではサービス拡大に伴い、組織の拡大も急ピッチで進んでおり、グローバル化にも拍車がかかっています。2019年にベトナム・ホーチミンに初の海外拠点をつくり、2021年にハノイにも拠点を設立。さらに2022年はインドにも拠点を設立しました。 日本国内においても、プロダクト開発を担当する拠点は東京以外に、京都・大阪・福岡

Figmaのローカルコンポーネントをライブラリに移動する方法(2023年1月版)

Figmaのヘルプ「公開済みコンポーネントの移動」ではタイトルの通り、あるライブラリのコンポーネントを別のライブラリへ移動する方法が説明されています。 この記事の内容をすこし応用するとライブラリではないファイルのローカルコンポーネントをライブラリへ移動して再リンクすることができます。 (この記事は2023年1月時点の情報です。Figmaはアップデートが頻繁なので試す前に最新のヘルプを確認することをお勧めします。) 大雑把な手順移動元ファイルを一度ライブラリとして公開する

マネフォインターンを通して払拭した、デザイナーとして働く上での3つの不安

こんにちは。マネーフォワードの23年新卒内定者としてインターンをしている中村です。 今回の記事では、約4ヶ月のマネーフォワードでのインターンを通じて解消できた、就活の時に感じていた不安について書いていきます。就活生の皆さんの不安解消を、マネフォ内定者の私目線でできたらなと思います。 この記事を読んで、就活生の皆さんが肩の力を少しでも抜いて本当の自分を魅せられるようにできたら嬉しいです! 不安1:実務経験ないけどプロダクトのデザイナーに本当になれるの?地方の大学に通ってい

定性的ユーザビリティテストの進め方

こんにちは!マネーフォワードでデザイナーをしている三上です。 今回は、私がUI/UXデザインを担当している「マネーフォワード クラウド勤怠」で実施したユーザビリティテストについて、まとめてみました。 何のユーザビリティテストを実施したのか 今回は打刻画面の改修の中で、テストを実施しました。 ユーザーのアンケートから「間違った打刻をしてしまう」といった声が多くあったからです。 打刻の操作は多くのユーザーが毎日行うため、影響も大きいです。そこでリリース前にデザインプロトタイ

入社〜リリースまで駆けぬけたUI/UXデザイナーの6ヶ月

これはマネフォデザイナーAdvent Calendar2022🎄⛄️ の10日目の記事です。本日は、マネーフォワード クラウドUI/UXデザイナーのyuiがお届けします🙋‍♀️ 2022年6月に入社してあっという間に半年が経ち、担当しているプロダクトがついにリリースされました!🎉 入社からリリースまでの6ヶ月間どんなことをやったか、成功や失敗を振り返りたいと思います。 やったこと1. 『議事録』でMTGを前に進める 私が入社した時点では、プロダクト開発チームの日々のMT

つくりかたをつくるための構造理解と抽象化

普段、ソフトウェアのGUIをつくるため、文字を書いたり、テキストフィールドを置いたり、ボタンを置いたり、それらに色を割り当てたりします。これは、実際には何をデザインし、何を表現していることなのかということを最近よく考えます。 そのような視点で考えてみると、すべてのデザインされる要素にはかならずそのようにする理由がある、ということに気づくことができます。 デザインの理由と構造を知り、抽象化して考える事は、デザインをどのようにつくるのかということを考えるために重要なことです。