- Website
- / Branding
- / System
- / AI Product
伝えたい価値を、
体験できるWebへ。
私はデザイナーでもエンジニアでもなく、その間にいる「クリエイティブデベロッパー」です。
デザインとコードを行き来する中で、 まだ形になっていないアイデアを、体験できる形へ変えていく。
実装できるからこそ、デザインの可能性を広げる。 デザインできるからこそ、技術の可能性を引き出す。
その往復の中から、最初には見えなかった表現へたどり着くこと。 それが、私のつくり方です。
HOW I DO
「らしさ」を磨き、選ばれる体験をつくる。言語化できていない価値・魅力を、体験できる形へ。
戦略から設計、デザイン、実装まで。境界を越えて行き来することで、まだ言葉になっていない価値をデジタル体験へ変換します。
- ブランドサイト制作
- プロダクト開発
- クリエイティブパートナー
RESULTS
- CSS Design Award受賞
- 4記事で年間1万PVのSEO運用
- Page Speed Insight 99
- 行政データサイト制作
FLOW
ご相談から公開後の改善まで、この流れで進めます。工程ごとの部分参加も可能です。
- 01 ヒアリング
- 02 価値・魅力の言語化
- 03 コンセプト設計
- 04 アクセス戦略設計
- 05 UX/UI設計
- 06 デザイン
- 07 構築
- 08 SEO/GEO対策
- 09 分析改善
WORKS
つくってきたもの。
クライアントワーク、自社プロダクト、技術実験。
おうちの買い方相談室 広島店
担当領域：ヒアリング・アクセス解析・企画・デザイン・構築
技術：WordPress
既存サイトの改修を、現状分析からプレゼン・実装まで一貫して担当。
&さんかく
担当領域：ヒアリング・ワイヤー・デザイン・構築 / アーティスト協業
技術：Web
アーティストと協業し、ビジュアルの調整から実装まで。世界観のあるサイトをゼロから形に。
創作料理 菜 レポート
担当領域：UI設計・実装・モーション
技術：Web / GSAP
「食卓は大きい方がいい。」というコンセプトを表現したレポートページ。
風土
担当領域：企画・UI設計・フロントエンド実装
技術：Astro
日本各地の絶景を北から南へ辿る旅企画ページのデザインと実装。
UNPAQ
担当領域：企画・体験設計・UI・フロントエンド・AI連携
技術：Next.js / TypeScript / OpenAI API
AIキャリア診断を企画から実装まで自社開発。
ReTadoru
担当領域：企画・体験設計・UI・フロントエンド・AI連携
技術：Next.js 15 / React 19 / Supabase / OpenAI
"しっくりくる自分"を見つける自己分析ツール。
じぇしー＆えりー
担当領域：企画・UI設計・フロントエンド実装
技術：Astro / MicroCMS
旅メディアの企画から実装、執筆まで全て。SEOを狙った4記事のみで1万PV/年を達成。
No.44 PROJECT
担当領域：UI設計・フロントエンド実装
技術：Nuxt2
日本酒×アートプロジェクトサイトのディレクション・デザイン・実装。
365
担当領域：企画・UI設計・実装
技術：Nuxt2
クラウドファンディングイベント企画のサイト。
AonC
担当領域：企画・ブランディング・UI・実装
技術：Astro
(閉鎖済み)ブランディングからサイト構築まで。
Neroli ロゴ
担当領域：企画・ロゴデザイン
ベビーブランドロゴのデザイン。
Neroli ショップカード
担当領域：企画・ツールデザイン
ベビーブランドのショップカードデザイン。
日本の人口 2020→2070
担当領域：企画・データ設計・可視化・UI・フロントエンド
技術：Astro / React / TypeScript / SVG
国が公表する将来推計人口を、眺めるだけでなく動かせる計器盤に。社人研の令和5年推計がもともと持つ「条件付推計」をそのままレバーにして、出生率を変えると2070年までの人口と高齢化率の軌道が動く。
FLEET VISION
担当領域：企画・UI・データ可視化・フロントエンド・モーション
技術：Astro / three.js / WebGL / GSAP
架空のトラック運送会社の運行をSF映画のFUI風にリアルタイム可視化。WebGLの管制マップでドライバー・積荷・労働時間・納期を追跡する運輸ダッシュボード。
Earth Quake
担当領域：企画・3D・データ可視化・フロントエンド
技術：Astro / three.js / USGS Earthquake API
USGSのリアルタイム地震データを、黒背景にネオンのドットで表現した3Dグローブで可視化。国別ランキングや長期推移も確認できるダッシュボード。
平清盛に見る栄枯盛衰の理
担当領域：企画・AI素材生成・UI・フロントエンド・モーション
技術：Astro / GSAP / Canvas / nano banana
色褪せた和紙に水墨で描く、平清盛の生涯と平家の栄枯盛衰。章ごとに画面が開き、絵巻が奥へ横へと進む没入型パララックスLP。
Secret Forest
担当領域：企画・AI素材生成・3D・UI・フロントエンド・モーション
技術：Astro / three.js / GSAP / Canvas
スクロールで森の奥へ分け入り、3Dフィギュアを回転表示する没入型パララックスLP。
ÉCLAT
担当領域：企画・AI素材生成・UI・フロントエンド・モーション
技術：Astro / GSAP / Canvas / nano banana / Veo
AI生成映像をフレーム分解し、スクロール連動で回転・収納・分解する没入型プロダクトLP。
Work Style
ご一緒の仕方
まずはお気軽に、なんでもご相談ください。要件整理やデザイン、実装から入ることもできます。フルリモートで全国対応。初回のご相談には通常1〜2営業日以内に返信します。
ウェブ制作のご依頼
何を作るべきかから、企画・デザイン・実装まで一貫してお引き受けします。
スポット支援
LP・特設サイト・UI実装・AI機能など、必要な範囲だけ対応します。
継続パートナー
制作会社の外部メンバーとして、複数案件を継続的に支援します。
チーム参加
ディレクター・デザイナー・エンジニアと連携しながら進行します。
ABOUT
Yuki Matsuda
企画・マーケティング・デザイン・開発を一気通貫で行うクリエイティブデベロッパー。クリエイティブと開発の両輪を回すからこそたどり着ける、世界観や体験をつくります。
ウェブ制作、ウェブアプリ開発、AIアプリ開発、ブランディングなど幅広く対応。個人での受託制作のほか、企業プロジェクトへのジョインや支援も行っています。
CSSDA Special Kudos 受賞
Best UI / Best UX / Best Innovation
FAQ
-
+ 制作会社の外部パートナーとして依頼できますか？
はい。スポット支援、継続パートナー、プロジェクト単位のチーム参加に対応しています。Figmaからの実装だけでなく、要件整理やUIの詰めから入ることもできます。
-
+ どの段階から相談できますか？
企画前、デザイン中、実装前、既存サイトの改善など、どの段階でも相談可能です。まだ仕様が固まっていない場合も、必要な整理から対応します。
-
+ デザイナーやエンジニアがいるチームにも入れますか？
入れます。既存の進行や役割分担に合わせて、UI設計・フロントエンド・インタラクション・AI連携など、必要な範囲を担当します。
-
+ AI連携だけの相談もできますか？
可能です。OpenAI APIなどを使った機能設計・プロトタイプ・既存プロダクトへの組み込みまで対応します。無理にAI化する提案はしません。
-
+ 稼働や連絡方法は？
フルリモートで全国対応しています。初回のご相談には通常1〜2営業日以内に返信します。
CONTACT
まずはお気軽にお話しましょう
事業会社・個人からの直接のご依頼、制作会社の外部パートナー、どちらも承ります。まだ固まりきっていない段階でも構いません。内容に合わせて、どう進めるかを一緒に検討しましょう。下のボタンを選ぶと、内容欄に書き出します。