Matz | Designer

プロダクトデザイナー / デザインシステム設計・構築。デザイントークン、コンポーネント設計、デザインとコードの接続が専門。AIリーダブルなデザインシステムを実践しています / 個人開発でiOSアプリ4本リリース

[Matz | Designer @Matz_Tak]

匿名投票SNS『whome（フーミー）』をリリース🎉

2022年に米国でTikTok、BeRealを抑えてApp Store1位になった『GAS』を日本向けにリメイク＆機能強化しました。
「クラスで一番優しい人は？」のようにポジティブな質問に友だちを匿名で投票するアプリです。

詳しくはスレッドで👇

[Matz | Designer @Matz_Tak]

@kgsi こちらこそです！ありがとうございます！！！

[Matz | Designer @Matz_Tak]

関心のド真ん中なので臨月を迎える妻に許可を取り、参加します！

[こぎそ @kgsi]

「デザインハーネス」という考え方は、AIエージェントを実務に取り入れていくうえで重要なフレームワークになると思っています。

AIに任せる範囲が広がるほど、人間側の判断基準、制約、文脈、検証方法をどう設計するかが問われる。

そのテーマについて話すイベントを豪華メンバー、会社様と開催できて光栄です✨最高のイベントに仕上げます w/
@enhanced_jp @tsubotax @haruruuun0405 @ry0_kaga @osk_kamui @NishaMe1024 @abf_re

[Matz | Designer @Matz_Tak]

@suna_gaku 渡している中身が何かに寄りますね！自分も何が最良かはまだわかりませんが、デザイントークン（json・CSS）、コンポーネント（React・CSS）でいけましたよ！

[Matz | Designer @Matz_Tak]

@umiremix わかりますw

そのうち「AIが作るとどれも一緒に見えるからAI使わずにデザインできる人がほしい」なんて論調が出てもおかしくないですね。

誰も責任は取ってくれないので、自分が「ここだ！」とBetした領域で突き抜けるのがいいんじゃないかって思ってます。

[Matz | Designer @Matz_Tak]

本当にこれofこれofこれ。

デザインシステムの整備ができてるか否かでAIに生成させるものがプロトタイプ止まりのままか、完成版になるかの明暗を分けている。

[西村和則 / root Inc. @nishimuu]

今までデザイン負債解消のためにデザインシステムを整備する中長期視点の設備投資的な節があったけど、AI化の波によって、デザインシステムが事業を爆速で進めるための武器に昇格しつつあって、自社で整備進んでるか進んでないかが、プロダクト開発の速度に圧倒的な差を生みそう。

[Matz | Designer @Matz_Tak]

Code to Canvasでレイヤー化はされるけど、一部Frameとして組まれたりするので、特にアプリのUIなんかは全部AutoLayoutで組む自分にとっては結局手直し入るから微妙かもと思ってしまった。

[ムーン🌝育児アプリ作ってます @Moon_Lab5]

Claude CodeとFigmaの連携で特に恩恵を受けやすいのは、もともとFigmaでデザインを作っている人かなと思います。

Figmaで作ったデザインをスムーズに実装できるだけでなく、実機で確認しながらコード上で調整したデザインも取り込めるので、Figmaを常に最新の状態に保つことができます。

レイヤー化された状態で取り込まれるため、その後の導線設計や修正、追加対応がしやすくなります。

[Matz | Designer @Matz_Tak]

Rabeeさんのデザインシステム関連の記事はいつもわかりやすく実践的で参考になる！

[akane @akane___UI]

世は大AI時代、とはいえFigmaが必要とされるフェーズもある。いかに地味コツな時間を減らすか？をシステム化しています。

[Matz | Designer @Matz_Tak]

> コンポーネントが揃っている今、差がつくのは「どう使うか」の判断基準を言語化できているかどうかです

これofこれ。

「このUIはどう使うか？」はプロダクト固有の文脈に依るところが多いので、その言語化がされてないと人間はおろかAIすら正しい判断ができないと思う。

[こぎそ @kgsi]

https://t.co/Kzrb82F9Xm

[Matz | Designer @Matz_Tak]

うまい棒川柳公式サイト👇
https://t.co/3DgNGHrZfJ

[Matz | Designer @Matz_Tak]

そういえば先日第6回うまい棒川柳で大賞を受賞しました。

27,700句の中の1位です。

第3回から応募し続け、4年目で悲願の受賞に至りました。詠んだ句は座右の銘として胸に刻みたいと思います。

#うまい棒川柳

[のぶ @taka16_n]

セマンティックトークン設計のもやもやが言語化されている。大事なのはいつだって、目的に合っているかどうかやな〜

[Matz | Designer @Matz_Tak]

note書きました。

今後、プロダクト開発においてAI活用の明暗を分けるのはAI readableなデザインシステムを構築できているかに懸かっていると思います。

その前段としてデザインシステムを構築する際に、多くの人が直面する問題について書きました。

https://t.co/UFYxqMpNIE

[Matz | Designer @Matz_Tak]

アツい👏

[けんじ | UXデザイナー @kenji_clown5]

FigmaのオートレイアウトGridで高さの内包が選べるようになったぞ！！！#figma

[Matz | Designer @Matz_Tak]

> UIデザインの自動化はまだ早い

まじでこれなんだよなぁ。結局Figmaからファイルを操作するAPIが提供されてないので、それを待つかそれに代わる方法が出てこない限り、間に別のツールを挟んでせめて60%ぐらいのクオリティのUIを生成して、デザインが手作業で修正する流れ。

[坪田 朋 / クラシル CPO @tsubotax]

UIデザインの自動化についてよく聞かれるけど、色んなAIツールを使った結果、ソフトウェアにおけるUIデザインの自動化はまだ早そうで、今はAIの進化を待ってる方が良さそう。

Figma MakeやLayer mateでアイディアの幅出しやパーツを作るのは有用だけど、プロンプト修正して待ってる時間の方が長い。

いつか置き換わるのは間違いけど、その進化を待ってる間は、デザイナーがDevinと協業してフロントエンドの修正を行って開発効率を上げたり、社内のオペレーションをAIで自動化する仕組みを作ったり事業のボトルネックを動かす方向へデザインチームのスキルを拡張して行くのが良さそう。

[Matz | Designer @Matz_Tak]

@hiradaty 全力応援

[ひらりー｜暮らしのアプリ作家 @hiradaty]

note記事投稿しました。
良いこと書いてる。

https://t.co/Yxsav3LBWv

[Matz | Designer @Matz_Tak]

完全に同意です！

ほぼ同じ内容ですが実践した者の経験談も載せておきます。

https://t.co/bA8HEmIAy6

[Kaito @tkaito1108]

めっちゃ共感した
https://t.co/2g3w5Kaf34

[Matz | Designer @Matz_Tak]

Light Mode / Dark Mode（WIP）

[Matz | Designer @Matz_Tak]

@shin201007m たまたまTLに流れて目に留まりましたが、コンセプトとUIめっちゃかわいいですね！