自己紹介

GMOペパボ株式会社でSUZURIのデザインリード及び共通基盤デザインシステム「Inhouse」の設計を担当し、2022年のFigmaのグローバルカンファレンスConfigにて「One design system for multiple brands」を発表。

スマートバンクには「いい年だしズボラにやってたお金のことをちゃんとしないといけない」と思って入社しました。

Twitter：@putchom

YOUTRUST：@putchom

仕事内容

家計簿プリカ「B/43」のプロダクトデザインをしています。また、デザインシステムを構築して、チームでデザインしていける環境を整えています。

あなたのことを一つOpenにしてください！

デザイナーなのですが結構プログラミングも好きで、趣味はちょっとしたWebサービスやゲームを作ることです。毎年年始にお年賀ネタゲームを作っていて、2022年は「餅つきオンライン」という、ボタンを連打して餅つきをして、その回数を競って称号がもらえるものを作りました。実は、1月2日にバズってTwitterのハッシュタグ1位になって、テレビでも紹介されました。

ブログを読む

株式会社スマートバンクに入社しました

はじめましての方ははじめまして。久しぶりの方はお久しぶりです。デザイナーの putchom です。新卒から約 9 年間勤めた GMO ペパボ株式会社を退職し、2022 年 9 月に家計簿プリカ B/43 を運営する株式会社スマートバンクに入社しました。入社して 1 ヶ月経ったので入社エントリというものを初めて書いてみます。これまでの私 2013 年に新卒で paperboy & co.(現 GMO ペパボ株式会社)に入社し、これまでカラーミーショップ、minne、SUZURI と 3 つの EC のサービスに携わってきました。ネットショップ作成サービスカラーミーショップでは主に有料デザインテンプレートの UI デザイン、カラーミーショップ大賞の VI などを担当しました。また、ハンドメイドマーケット minne では iOS、Android アプリの UI デザインを担当しました。そして、オリジナルグッズ作成サービス SUZURI ではリードデザイナーとしてサービスの成長期にプロダクトデザインからコミュニケーションデザインまであらゆることを経験させていただきました。 works SUZURI でやったお仕事さらにサービス以外にもシニアデザイナーとして、新卒説明会などのコーポレート関連の仕事や、全社共通基盤デザインシステム「Inhouse」の構築もさせていただきました。 works2 採用関連のお仕事最後に退職直前には「Config 2022」という Figma が行っているカンファレンス登壇して、これまでペパボで行ってきたデザインシステム構築の知見を共有させていただきました。はじめてのグローバルカンファレンス登壇ということもあり、とても貴重な経験をさせていただきました。 config Figma Config 2022 に登壇しました - Pepabo Tech Portal なぜスマートバンクを選んだのか 1. そろそろ EC ではないことをしてみたかった上記のとおり、これまで主に EC の領域でデザインをしてきたこともあり、今後さらにデザイナーとしての幅を広げるために、EC ではない領域の会社で働いてみたいと考えていました。そこで、まずは転職活動するにあたって、自分の日常生活の問題意識を掘り下げて、「自分ごと化」できそうな会社をピックアップして話を聞きにいきました。その結果、趣味で組み込みの開発をやっているうちに興味が出てきたハードウェアを扱う会社や、これまでズボラにやってきつつ「なんとかしなきゃな」と感じていたお金のことをもっと良くしている会社を中心に選考を受けることにしました。実際にはこれまでのスキルセットが活かせることもあり、EC の会社もいくつか受けましたが、最終的には家計簿プリカ B/43を運営している株式会社スマートバンクを選びました。 b43 B/43（ビーヨンサン）｜家計簿アプリ Visa プリペイドカードでお金の管理を簡単に「B/43（ビーヨンサン）」は、Visa プリペイドカードと家計簿アプリがセットになった新しい家計管理サービスです。毎月の決めた予算をプリペイドカードにチャージして支払いを行うだけで、アプリ上に利用明細が記録され、家計簿を自動作成します。スマートバンクはこの B/43 というプロダクトにおいて『お金を「使う」「貯める」「増やす」を誰もが当たり前にできる未来をつくる』というミッションを掲げています。実際にアプリをインストールして使ってみると、買い物するだけで家計簿がつくなど、非常に優れた体験とインターフェースにより自分でも簡単にお金の管理を行うことができるとわかりました。また、選考中にファウンダーの話をお聞きする中で、自分のようなお金にズボラな人たちでも簡単に資産管理・資産形成できる未来を「本気で作りたい」ということが伝わってきました。これらの点が自分の直近の問題意識と合致したので、「自分ごと化」してプロダクトを一緒に作っていけそうだと感じました。 2. 自分が持つスキルセットを持ったデザイナーがまだ在籍していなかった以下の図を元に、オファー面談時に、「デザインシステムと実装面を専門とするスキルセットを持ったデザイナーがちょうど足りていない。putchom さんが入るとこんな感じになって、今足りていないスキルセットのピースが埋まるので最高のチームになる」といった説明をしていただきました。 after-member スマートバンクのプロダクトデザインチームスマートバンクのプロダクトデザインチームをご紹介します - inSmartBank この面談で、自分が入社した後にどういうアクションを求められているか明確に理解することができましたし、「このチームで活躍できそうかもしれない」と感じることができました。（余談ですがオファー面談を担当した CXO の takejune さんは入社後に「テトリスの長い棒が来たと感じた」とおっしゃっていました。）実際に入社してからこのプロダクトデザインチームで稼働しているのですが、様々な有名スタートアップの CI や BI を手掛ける OH のわりえもんさんや、元 Cookpad デザイン戦略部マネージャーで現在 KRAFTS&Co.を立ち上げられた倉光さんなど、全員がプロフェッショナルなスキルを持って働いているヤバいチームです。自分のスキルセット以外の面でも一線級で活躍しているメンバーが在籍しているので「いるだけで成長できる」環境だと感じています。（そもそも大半の社員がもともと日本で初めてのフリマアプリを作ったフリル（現楽天ラクマ）の創業メンバーなのでビジネス的な観点でも学ぶことが多いです。）また、特にスマートバンクの一番の魅力としてはスタートアップの初期フェーズにも関わらず、専任の UX リサーチャーであるはろかさんが在籍していることです。ゼロからのスタートアップ立ち上げにおけるリサーチ事例 (Research Conference2022 書き起こし) 入社してからほぼ毎日のように自分が担当する新機能に関するユーザーインタビューに同席しているのですが、リサーチに関する書籍を読んで頭の中でしか理解できていなかった手法を、現場で実際のケースに応じて学ぶことができ、目からウロコが落ちっぱなしです。これまで口ではユーザーファーストなどと言いつつ、正直プロダクトづくりにおいて「多分こうだろう」という部分が多いままリリースすることが多々ありました。今でも完全に「多分こうだろう」が払拭しきれたとは言いませんが、なるべく不確定要素が少ない状態で日々のデザイン業務が行えていると感じています。 3. 一緒に働くメンバーと考え方が合いそうだった自分が入社する直前にスマートバンクでは以下の 3 つのバリューが策定されました。 Think N1 - 対話と分析を重ねて、本当に重要な課題を発見しよう - 大きな成功から逆算して、チャレンジを続けよう Super Ownership - 職域を飛び越えて、自らリードしよう - 互いをサポートし合い、チームで成し遂げよう Be Open - 想いや情報を自分から共有しよう - 他者を尊重し、信頼されるよう振る舞おう【Make it Transparent】資金調達特設サイト | 株式会社スマートバンク上記のバリューは在籍するメンバーがワークショップを行い、現状を踏まえて作ったもので、現在のスマートバンクのメンバーの考え方がリアルに反映されています。これらのバリューが自分が働く上で大事にしていることや強みとしていることと合致していたので、一緒に働くメンバーともうまくやっていけそうだと判断できました。今やっていること私が入社してから行っている業務は主に UI デザイン、デザインシステムの設計、Web フロントエンドまわりの実装です。 UI デザイン来年の大きなリリースに向けた新機能の開発プロジェクトにアサインされ、全体の体験設計や、インターフェースのデザイン業務を行っています。前述したとおり、様々なプロフェッショナルなスキルを持ったメンバーと一緒にリサーチを行い、確度の高い仮説を立てて「人々が本当に欲しいもの」をつくれていると思います。リリースをお楽しみに！ new-feature デザインシステムの設計自分が一番得意とする領域や、求められていることはデザインシステムの設計であり、現状の課題をチームにヒアリングしつつ、まずは現状整理を行いました。その現状整理をもとにスマートバンクにおける理想のデザインシステムのアウトラインを提示し、そこに向かって優先順位の高いデザイントークンの定義から実装を始めています。 design-system-architecture スマートバンクの理想のデザインシステムのアウトラインデザインシステムに関しては、モバイルアプリにおけるデザイントークンの効率的な運用や、マルチサブブランド対応のデザインシステムについての知見が溜まっていきそうな気配がしているので、今後も引き続きアウトプットしてきたいと思います。 Web フロントエンドの実装 B/43 は iOS、Android などのスマートフォンアプリのみで提供しているため、現在 Web アプリケーションは存在していません。しかし、サービスサイトでは Nuxt.js などのフレームワークが使われており、ユーザーインタビューページの更新など、サービスのプロモーションを行う業務が定常的に発生します。これらのコンテンツを作成する業務や、その業務自体を効率化するアクションを行っています。具体的には Web コンポーネントを再利用可能な形に再構成したり、コンテンツの雛形を自動生成できる仕組みを整えたりしています。一緒に働くコミュニケーションデザイナーを募集しています現在スマートバンクでは今後のデザイン業務を進める上で、スキルセットでもう一つ足りないピースが見えてきています。それは一緒にブランドを作っていってくれる専任のコミュニケーションデザイナーです。上記のようにスマートバンクのデザインシステムのアウトラインを引き、プロダクトデザインを通じてブランドをつくることに関しては私が進めていますが、今のメンバーだけではコミュケーションデザイン領域まで手が回りそうもありません。そこで、一緒にコミュニケーションデザイン領域で B/43 のブランドづくりを進めてくれる方を募集しています。 recruting コミュニケーションデザイナー - 株式会社スマートバンク | SmartBank, Inc. 会社のフェーズとしてもこれからという感じなので、正直まだ何も決まっていません。「自分でリーダーシップを持ってブランドを作っていきたい！」という方の募集をぜひお待ちしています。

putchom.com

Podcastを聴く

17:デザイナーputchomさんが設計していくB/43のデザインシステム

SmartBank.fm今回のゲストは、デザイナーの福嶋暸 (@putchom)さん。スマートバンク社に入社した理由や、これから取り組んでいくB/43のデザインシステムについて語っていただきました。

smartbank.co.jp