loader image

[2026年4月第4週] Web業界ウィークリー:Figma大型アップデートとClaude Code品質修正

当ページのリンクには広告が含まれています。
Web業界ウィークリー 2026年4月第4週

今週(4/20〜4/26)はAIツールとデザインツールの動きが重なった週でした。FigmaがUI・AI・連携の各面で大型アップデートをリリースし、しばらく話題になっていたClaude Codeの品質低下問題も正式に解決。WordPress 7.0のリリース日も確定し、5月に向けた準備を始めるタイミングが来ています。

目次

WordPress 7.0、5月20日リリース確定

4月22日、WordPress公式チームがバージョン7.0の正式リリース日を5月20日と発表しました。

出典: WordPress Core ブログ

7.0のハイライトはGutenbergブロックエディターのパターンライブラリ強化とFull Site Editing(FSE)の安定化です。テーマビルダー周りの機能が整理され、WordPressをCMSとして使い込んでいるサイトほど恩恵が大きくなりそうです。

注意が必要なのはカスタムブロックやサードパーティプラグインを多用しているサイトです。メジャーバージョンアップのため、既存の拡張機能が7.0で正常動作するかどうかの確認が必要になります。クライアントサイトを複数持っているなら、今から互換性チェックのスケジュールを組んでおくのが安全です。5月中旬にステージング環境でテストする時間を確保しておきたいところです。

💡 今すぐ試せる: 担当するWordPressサイトのプラグイン・テーマ一覧を確認し、7.0対応の公式アナウンスが出ているかチェックする

Figma、4つの大型アップデートを一斉リリース

今週最も現場への影響が大きいと感じたのが、Figmaの一斉アップデートです。

出典: Figma Blog

Figmaの4つの大型アップデート(2026年4月第4週)
Figmaの4大アップデート

主な更新内容は4点:

  • ベクター編集が最大10倍速に: ペンツールのアンカー追加・削除、パス結合などの処理が大幅高速化。複雑なアイコンやイラストを触る作業でのストレスが減ります
  • ChatGPT Images 2.0を統合: Figmaのキャンバス上からより精度の高い画像生成が可能に。プロトタイプ用の仮画像をすぐ用意できるようになりました
  • MCP双方向連携: 従来はFigmaのデータをMCP経由でAIに読み込ませる一方向でしたが、今回からAIエージェント側がFigmaのレイヤーを直接操作できるように
  • 動画コントロールの追加: プロトタイプ内の動画に再生・停止・シークのUIが付けられるようになりました

中でも注目しているのがMCP双方向連携です。「AIにデザイン指示をしたらFigmaが自動で動く」というワークフローが現実に近づいてきました。今すぐ業務に組み込むかどうかはともかく、この方向に流れていくのは間違いなさそうなので、MCP連携の使い方は早めに試しておきたいと思っています。

💡 今すぐ試せる: Figmaをアップデートしてベクターツールを開き、複雑なパス作業をひとつ試して速度の違いを体感する

Claude Code v2.1.116、品質問題の原因特定と修正完了

先週から一部ユーザーで報告されていた「Claude Codeの回答の質が下がった」問題について、4月20日にAnthropicが公式ポストモーテムを発表しました。

出典: Anthropic Blog

Claude Code品質修正ポストモーテム(2026年4月)
Claude Code品質修正の3原因と対応策

原因として挙げられたのは3点です:

  • 推論努力の低下: コード生成時の思考ステップが意図せず削減されていた
  • セッション管理バグ: 長いセッションで文脈の引き継ぎが失敗するケースがあった
  • システムプロンプトの変更: デフォルト指示の一部変更が動作に影響していた

これらはすべてv2.1.116で修正済みです。自分の環境でも数日前から応答が安定してきた実感があります。

一時的な品質低下を経験して「使えない」と判断した方は、今週以降に改めて試してみる価値があります。ちょうどよい機会なので、以前不満だった部分を具体的にテストしてみると、修正の効果がわかりやすいと思います。

💡 今すぐ試せる: ターミナルで claude --version を実行。v2.1.116より古い場合は npm install -g @anthropic-ai/claude-code でアップデートする

Anthropic、Managed Agents発表 — 長時間エージェントの基盤が整う

AnthropicがManaged Agentsと呼ばれる新しいサービスを発表しました。

出典: Anthropic Blog

一言で言うと「長時間・複数ステップのAIエージェントタスクをAnthropicのインフラ上でホストするサービス」です。

従来のAPIでエージェントを動かす場合、処理が長引くとタイムアウトや途中の状態管理が問題になります。Managed Agentsはその部分をマネージドサービスとして提供することで、エージェントを組む開発者が信頼性の高い長時間処理を実装しやすくなります。

直接使う対象は今のところAPIでエージェントを組んでいる開発者・企業向けです。ただ、これが普及すると「AIに30分かかる複雑なタスクを丸投げして、完了したら結果だけ受け取る」という運用が当たり前になってきます。そのとき、自分の業務の中でどの部分をエージェントに任せるか、今から考えておいても損はないと思っています。

💡 今すぐ試せる: Anthropicの公式ドキュメントでManaged Agentsの概要ページを読み、自分の業務で活用できそうなユースケースをメモする

Google I/O 2026、セッション詳細が公開 — Web系の注目は

5月19日〜20日開催のGoogle I/O 2026について、セッション一覧の詳細が公開されました。

出典: Google I/O 2026

Web・Chrome関連で注目しているセッションをいくつか挙げます:

  • What’s new in Web: 毎年恒例のWebプラットフォーム全体まとめ。ここで何が発表されるかがその年のWeb技術の方向性を示します
  • CSS新機能: Interop 2026の進捗報告と新しいCSS仕様の実装状況。先週取り上げたif()関数の進展にも期待
  • Performance APIs: Core Web Vitalsの計測に関わる新API。INP(Interaction to Next Paint)改善に使えるツールが増えそう
  • AI in the browser: Chrome Built-in AI(Gemini Nano)の最新状況。オフラインでAI処理できるブラウザ機能はWeb制作にもじわじわ影響してきそう

I/OはYouTubeでライブ配信されるので、気になるセッションだけ日本語字幕で追うことができます。5月20日の夜(日本時間)はWebセッションを中心に見る予定です。

💡 今すぐ試せる: Google I/O 2026のセッションページをブックマークして、チェックしたいセッションにメモをつけておく

SVGでつくるsquash-and-stretchアニメーション

フロントエンド開発者のJosh W. Comerが4月21日に公開した記事が今週のX(旧Twitter)でシェアを集めました。テーマはsquash-and-stretch(潰れと伸び)をWebのUIアニメーションに応用する方法です。

出典: Josh W. Comeau’s Blog

See the Pen SVG Squash & Stretch マイクロインタラクション by BaseKENT (@basekent) on CodePen.

squash-and-stretchはウォルト・ディズニーのアニメーターが体系化した「アニメーション12原則」のひとつ。物体が重さ・弾性・速さを持っているように見せる手法で、ゲームやアニメーションの分野で長く使われてきました。

CSSのみでtransform: scale(0.9)と書くだけでは「縮んだだけ」という印象になりますが、squash-and-stretchを加えると見え方が大きく変わります。実装の核心は3点:

  • squash(潰れ): scaleXを大きく・scaleYを小さく → 接触の重さを表現
  • stretch(伸び): scaleXを小さく・scaleYを大きく → 弾性・スピード感を表現
  • transform-origin: center bottom: 底面を固定することで「地面から浮かない」リアリティが出る

@keyframesの組み方はこの順番です:

0%(通常)→ 20%(squash: 横に広がる)→ 50%(stretch: 縦に伸びる)→ 75%(落ち着く)→ 100%(元に戻る)

ボタンやアイコンのクリック時に少し加えるだけで、UIが「生きている」感覚になります。デモを触ってみるとその違いが直感的にわかると思うので、ぜひ試してみてください。

💡 今すぐ試せる: 既存プロジェクトのボタンに:activeでアニメーションを追加し、scaleX(1.06) scaleY(0.9)scaleX(0.97) scaleY(1.04)の2ステップで違いを確かめる

今週のひとこと

Figma・Claude Code・Managed Agentsと、今週はAIとツールの境界線が溶けていく動きが続きました。「AIでコードを書く」から「AIがツールを直接操作する」という段階に入ってきた感覚があります。自分たちの仕事に何が残るのかは答えが出ていませんが、変化を楽しめるうちは楽しんでいきたいと思います。来週もよろしくお願いします。

A created this document

BASE KENT合同会社 代表 / クリエイティブディレクター

「空白をデザインする」をテーマに、Webコンテンツ制作とデジタルマーケティングを展開。
デジタルとリアルの境界線で、感性を刺激するクリエイティブを。
シンプルで機能的、そして「黒」の流儀を貫く。

目次