# Hanaの3D投影とノイズエフェクト - Spline blog (https://spline.design/ja/blog/hana-3d-projections-noise)

> Hanaの新機能：3D Projections、Layer Noise、Noise Glass

[ブログ](https://spline.design/ja/blog)

2025年8月12日

# Hanaの3D投影とノイズエフェクト

Hanaの新機能：3D Projections、Layer Noise、Noise Glass

[Hanaを開く](https://app.spline.design)

Spline Hanaで創造性をさらに解き放つための取り組みの一環として、3D Projections、Layer Noise、Noise Glassといった機能を加えた新しいアップデートを発表します。

## 3D Projections

2Dのコンポジションを3Dに投影することは、デザインにおいて長年の技術的な課題でした。従来は、2Dツールでコンポジションをつくり、画像や動画として書き出し、それをテクスチャとして3Dツールに読み込んでいました。元のデザインを調整するたびに全工程を繰り返す必要があり、非常に非効率なワークフローです。

Hanaでは、**どんな2Dレイヤーでも、ワンステップで3次元のサーフェスに変換**できるようになりました。ベースを球と円柱から選び、半径と高さ（円柱の場合）を調整して3Dのエフェクトをコントロールできます。

巻きつけたレイヤーは3Dサーフェス上のどこにでも配置でき、遠近感を微調整して奥行きの歪みを強めたり弱めたりできます。

ホバーまたはタッチで操作できます（Hanaでつくった体験）

内部では、Hanaが奥行き、遠近感、ライティングを処理するので、レイヤーは完全に編集もアニメーションも可能なままです。曲率や光を自由に試せます。慣れ親しんだ2Dのワークフローを離れることなく、タイムラインを円柱に投影したり、ギャラリーを球状に曲げたりする様子を想像してみてください。

これらすべてを、シームレスで非破壊的なワークフローの中で、リアルタイムに行えるのはこれがはじめてです。

このワークフローによって、アニメーションもインタラクションもできる3Dエフェクトを、ずっと簡単かつシンプルにつくれるようになると考えています。

Hanaで3D Projectionを使ってつくった体験

## Layer Noise

ノイズは、コンピューターサイエンスにおける最も重要な発見のひとつと言えるでしょう。制御可能なランダムパターンを数学的に表現したもので、炎、水、雲、地形など、自然界で起こるさまざまな現象をシミュレートできます。

平坦な部分に変化をつけたい、さりげない動きを加えたい。そんなときは、新しいLayer Noiseエフェクトで、あらゆるサーフェスにプロシージャルな変化と動きを加えられます。

Simplex、FBM、Voronoi、Sineなどのノイズの種類から選んで、さりげない粒子感から渦巻くパターンまで、さまざまな見た目を実現できます。

ノイズは均一に適用することも、オブジェクト全体にわたって徐々に強めることもできるので、旗や流体のようなエフェクトも可能になります。ノイズのパラメーターはアニメーションもインタラクションもできるので、脈打つグラデーション、流れる布、ユーザーの操作に反応してきらめくサーフェスなどをつくれます。

HanaでLayer Noiseを使ってつくった体験

## Noise Glass

数週間前に導入したLiquid Glassエフェクトでは、なめらかな屈折と奥行きをシミュレートできます。新しいNoise Glassは、その土台にテクスチャと動きを加えます。

完璧に磨かれたガラス板だけでなく、すりガラスのような見た目、水のような波紋、陽炎による歪みなども表現できるようになりました。シンプルなノイズパターンが屈折を歪ませ、プログレッシブモードを使えば、サーフェス全体で歪みを徐々にフェードさせられます。

窓の結露、ホログラムカードのきらめき、シンプルなすりガラスなども簡単に再現できます。コンセプトに合ったノイズパターンを選んでアニメーションさせ、ガラスに命を吹き込みましょう。

Noise Glassエフェクトを使ったすりガラスのデザイン

## 新しい創造の可能性

今回のリリースで届けた新機能を楽しんで、わくわくする新しいデザインをつくりはじめてもらえたらうれしいです！

— Splineチーム

## ブログのほかの記事

[2026年11月3日Spline Arenaのご紹介](https://spline.design/ja/blog/introducing-spline-arena)[2026年10月21日Spline for ChatGPTのご紹介](https://spline.design/ja/blog/introducing-spline-for-chatgpt)[2026年8月27日Hana V2のご紹介](https://spline.design/ja/blog/hana-v2)

[Spline](https://spline.design/ja)

チームとそのエージェントのための3D・2Dエディター。Web、iOS、Androidに公開できます。

#### SplineについてAIに聞く

#### 製品

- [3Dデザイン](https://spline.design/ja/3d-design)
- [Hana](https://spline.design/ja/hana)
- [Omma](https://omma.build)
- [AI 3D生成](https://spline.design/ja/ai-generate)
- [Spline MCP](https://spline.design/ja/mcp)
- [Spline Arena](https://spline.design/ja/arena)
- [料金](https://spline.design/ja/pricing)
- [Enterprise](https://spline.design/ja/enterprise)

#### ランタイム

- [Web](https://spline.design/ja/web)
- [iOS](https://spline.design/ja/ios)
- [Android](https://spline.design/ja/android)

#### アプリ

- [ダウンロード](https://spline.design/ja/download)
- [Spline Mirror](https://spline.design/spline-mirror)
- [Spline Mirrorをダウンロード](https://spline.design/download-mirror)

#### 学ぶ

- [Docs](https://docs.spline.design/)
- [Academy](https://spline.design/ja/academy)
- [Spline API](https://www.npmjs.com/package/@splinetool/runtime)
- [ソリューション](https://spline.design/solutions)

#### コミュニティ

- [Splineコミュニティ](https://community.spline.design)
- [Blog](https://spline.design/ja/blog)
- [更新履歴](https://spline.design/ja/changelog)
- [教育](https://spline.design/ja/education)
- [Contra](https://spline.design/contra)
- [アフィリエイト](https://spline.design/ja/affiliate)

#### 会社

- [導入事例](https://spline.design/ja/customers)
- [採用情報](https://www.ycombinator.com/companies/spline/jobs)
- [セキュリティ](https://spline.design/ja/security)

#### 法的情報

- [利用規約](https://spline.design/terms)
- [プライバシー](https://spline.design/privacy)

#### お問い合わせ

- [help@spline.design](mailto:help@spline.design)
- [jobs@spline.design](mailto:jobs@spline.design)

© 2026 - Spline, Inc.
