Hara Kazunari 🟢

Software Engineer, Tech Lead of Ameba Design System Spindle, CyberAgent Developer Experts,📕@wdpress 109(CDN), GitHubの教科書, CSS3逆引きデザインレシピ he/him/his

[Hara Kazunari 🟢 @herablog]

先日リリースされた「Figma Dev Mode MCP Server」を使って、Amebaのデザインシステム「Spindle」との連携を検証してみました🤚

課題だったアウトプットの精度が大きく改善されており、実際のデザイン・開発フローにうまく組み込めそうです🟢

https://t.co/GiCEu9K7T7

[Chrome for Developers @ChromiumDev]

Hunting down elusive runtime errors by hand is a massive time sink → https://t.co/jvCF5MmUp6

@ca_developers resolved this bottleneck for their Ameba blogging platform by replacing manual debugging with Chrome DevTools for agents. By integrating these tools, they built a reliable, fully automated testing flow that eliminates manual overhead entirely.

#GoogleIO

[Hara Kazunari 🟢 @herablog]

AI時代の開発者像。AI活用が前提にあり、ソフトウェアエンジニアリングのスキルを軸に専門領域外やエンジニアリング以外の領域にも広げていく。

#google

[木村賢(Satoshi Kimura) @kimuyan]

Google I/OでAmebaの事例紹介。

[Hara Kazunari 🟢 @herablog]

AmebaブログのWebMCP事例がセッションに登場✨

過去記事の取得、絵文字挿入、ハッシュタグ設定等、ブログ執筆のアシストとして活用できます🙌

#googleio

[Hara Kazunari 🟢 @herablog]

ChromeエリアのBuilt-in AIブースではAmebaブログ執筆の活用例が体験できます💫

#googleio

[Hara Kazunari 🟢 @herablog]

AI時代のCSS IS AWESOME

#googleio

[Microsoft Edge Dev @MSEdgeDev]

Modern Web Guidance is now in early preview 👀

AI coding agents often rely on legacy patterns → bloated JS.
@googlechrome + Edge are teaming up to fix that-helping AI generate cleaner, modern code using the latest web platform additions. Better web apps for the whole web community.

Check out the public repo: https://t.co/NNVCUXilpg

[Hara Kazunari 🟢 @herablog]

Amebaでは、ブログ記事執筆をアシストするためにオンデバイスAI、WebMCPに対応したChrome Extensionを実験的に公開しています💫

ストアページ内の注意事項をご確認のうえ、お試しください🙏

https://t.co/1CpF3nf4Be

#googleio

[Chrome for Developers @ChromiumDev]

The WebMCP API will enter origin trial starting in Chrome 149 → https://t.co/uQdxi2C6FP

It's a proposed web standard that lets you expose structured tools, like JS functions and HTML forms, to browser-based agents, enabling them to know exactly how and where to interact with your site.

#GoogleIO

[Hara Kazunari 🟢 @herablog]

Chrome DevTools for agents (MCP)を @AmebaSpindle で活用した例は以下の記事にまとめられています🙌

https://t.co/VqOrJfvvwd

#GoogleIO

[Chrome for Developers @ChromiumDev]

Ensure your coding agents build apps that are modern, fast, & secure by default → https://t.co/TAdQTHdXRc

We just announced Modern Web Guidance at #GoogleIO. By injecting AI-ready skills and modern features—complete with Baseline Widely Available fallbacks—it ensures your agent keeps up with the latest web features🧵

[Hara Kazunari 🟢 @herablog]

Gemini in Chrome の日本提供開始に合わせて、Amebaブログを利用した例を紹介いただきました🙌

[Google Japan @googlejapan]

行ったり来たりの「タブの切り替え」はもう不要🙅

複数のタブで開いている情報を、Gemini が簡単に要約・比較します。

例えば、旅行先のホテル選びや、買い物のアイテム比較などがよりスムーズに。

[Hara Kazunari 🟢 @herablog]

記事を書きました✋

Amebaデザインシステム「Spindle」における、コードとデザインの間を、AIエージェントを介して自由に行き来する開発フローを、最近の事例とともに紹介しています🟢💫

ぜひご覧ください🙌
https://t.co/FYdG0wSr9C

[Hara Kazunari 🟢 @herablog]

@ishida1897 やりますかっ

[Ameba Accessibility Team @AmebaA11Y]

＼2025年、AmebaLIFEのアクセシビリティ振り返り📝🐍／

🟢 合理的配慮のお問い合わせ窓口を新設
🟢 AIによる画像の代替テキスト自動生成🤖
🟢 Spindleコンポーネントのa11y改善
🟢 交流会・登壇・社内ゼミの開催

https://t.co/i4MI9aBzc1

[Hara Kazunari 🟢 @herablog]

Amebaデザインシステム「Spindle」の今年の開発を振り返りました🧑‍💻🟢

・Spindle MCP
・Design to Code (w/ Figma MCP)
・AI 時代に向けたリポジトリ整備

ぜひご覧ください💫

🗒️: https://t.co/MnizV0qv4R

[CyberAgentDevelopers @ca_developers]

/／
🗓️2026.3.20 - 21
⚡️Web Speed Hackathon
👑0.1秒の壁をぶち破れ! 最速を冠するのは誰だ!?
\＼

📱今年の題材は「架空のSNSアプリ」
⚡️どこまでパフォーマンス改善できるか
💻今回も一般参加者と学生で競技同時開催

👇以下よりエントリーお待ちしています👇
https://t.co/PXV4WecDIZ

[Hara Kazunari 🟢 @herablog]

Chrome DevTools MCP を使って、Ameba のデザインシステム「Spindle」のランタイムエラー修正を自動化したケーススタディが公開されました🧑‍💻🟢✨

https://t.co/dow2gNsDjm

[Hara Kazunari 🟢 @herablog]

いよいよ明日 11/29 (土) 開催です！🎉

MTDDC Meetup TOKYO 2025 にて、Amebaデザインシステム「Spindle」の今年の進化についてお話しさせていただきます🟢

1年間の取り組みや変化を凝縮しました。
参加されるみなさま、どうぞよろしくお願いいたします💫

#MTDDC

https://t.co/HKkMfU8aAv

[Hara Kazunari 🟢 @herablog]

#Offers_DeepDive でお話させていただいたSpindle MCPのスライドを公開しました🙌

MCPで変わるAmebaデザインシステム「Spindle」の開発
https://t.co/3n6EFafItG

[Offers(オファーズ)｜AI時代のエンジニア転職プラットフォーム @Offers_jp]

🎉本日19時より開催🎉

@herablog 氏、 @yukukotani 氏ご登壇🎤

✅AI時代におけるUI/UX実装やデザインシステムのあり方がわかる
✅実際の業務におけるMCP活用事例が具体的に分かる
✅MCPを活用したUI/UX実装の最新事例が学べる
#Offers_DeepDive

⏬お申し込みはこちら⏬
https://t.co/THOOkZT1j4