Storybook 10 の歩き方 - コンポーネントカタログからテスト基盤へ、Figma 連携まで
Storybook 10 を、いまの立ち位置から整理します。コンポーネントを分離して開発する「カタログ」から、インタラクション・アクセシビリティ・ビジュアルを含むテスト基盤へと役割が広がりました。あわせて addon-designs や Storybook Connect、Figma Code Connect によるデザインとの往復を、実務の導入目線でまとめます。
Figma4 件の記事
Figma の記事
AI時代のデザインツール「Pencil」徹底解説 - Cursor上でワイヤーフレームをAIに描かせる新常識
CursorやVS Codeの拡張として動く、AIネイティブなデザインツール「Pencil」の特徴・MCP連携・Figmaとの違いを解説。実案件として、企業向けWordPressテンプレートのワイヤーフレーム3パターンをAIで一気に構築した作業例も紹介します。
Figma MCP × Cursor でデザインからHTMLを自動生成 - 実践ガイド
Figma公式のMCPサーバーを使って、CursorでデザインからHTMLを自動生成する方法を解説。設定手順から実践、再現度を高めるためのベストプラクティスまで紹介します。
Liquid Glass デザイン完全ガイド - CSS実装からFigma制作まで
Apple発の新UIスタイル「Liquid Glass」の考え方、CSSでの実装方法、Figmaでの作り方を解説します。Glassmorphismの進化系とも言えるこのデザインを、自分のプロジェクトに取り入れてみませんか。