Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
UnityとBlenderハンズオン
静岡Developers勉強会
第8章 UnityとBlenderの学び直し
はじめに
静岡Developers勉強会では、過去に下記の勉強会を行いました。
2010年:「Programming in Haskell」
2011年:「JavaScript: The Good Parts」
2012年:「HTML5&CSS...
自己紹介
 やじゅ@静岡・・・漢字名は「八寿」
平口八寿人(https://www.facebook.com/yasuhito.hiraguchi)
アラフォーエンジニア、元MSMVP(VisualBasic)
静岡県島田市のSL(大井川鉄道...
概要
2015年の静岡Developers勉強会は「スマホアプリの開発」を題材とします。
スマホアプリを開発する上で、汎用的なツールの使い方を学びます。
・Unity
統合開発環境を内蔵し、複数のプラットホームに対応するユニティ・テクノロジーズ...
セッション内容
 Unityの学び直し
今までチュートリアルをこなすことで精一杯になってしまい、理解度が弱かったため、
基礎部分を学び直していく。
 パンダのモデリング
初心者のための!作って学ぶBlenderの基礎:③マテリアル・テクスチ...
Unityの学び直し
 はじめに
前回、ミニゲーム発表会を行ったが、作成する上でまだちゃんと理解できていない部分があった。
今までチュートリアルをこなすことで精一杯になってしまい、理解度が弱かったため、
基礎部分を学び直していく。
資料作成の...
Unityの学び直し
 アジェンダ
・アトラスからの切り出し
・スプライトアニメーションの作成
・プレハブ化
・タグの設定
・Transform
・物理挙動(Rigidbody 2D)
・衝突判定
・フォント
・重ね合わせ
・レイヤーの設定
...
Unity:アトラスからの切り出し
 アトラスとは
スプライトが集まった1つの画像データ。スプライトシートともいう
今回は素材として、「シューティングゲーム用ドット絵フリー素材」の一部を使用します。
http://stg.iaigiri.co...
Unity:アトラスからの切り出し
先にAssets内にUnityの基本ルールに則ったフォルダを作成して置いてください。
Assets/Spritesフォルダにダウンロードした画像を入れます。
Sprite Modeを「Multiple」に変更...
Unity:アトラスからの切り出し
Sprite Editor画面で「Slice」をクリックします。
今までチュートリアルでやってきたのは「Grid」でしたが、今回は「Automatic」を選択します。
「Slice」ボタンをクリックします。そ...
Unity:スプライトアニメーションの作成
小型戦車の3つを選択して、Hierarchyにドラッグ&ドロップします。
アニメーションの保存ダイアログ画面が表示されるので、Assets/Animationsに「Tank.anim」で保存します。
...
Unity:スプライトアニメーションの作成
砲台を選択して、Hierarchyにドラッグ&ドロップします。
Hierarchyにて、「小型戦車_3」から「Battery」に名前を変更します。
「Battery」を「Tank」に配下に移動させます...
Unity:スプライトアニメーションの作成
雑魚中型ヘリをCtrlキーを押しながら離れた2つ選択して、Hierarchyにドラッグ&ドロップします。
アニメーションの保存ダイアログ画面が表示されるので、Assets/Animationsに「He...
Unity:プレハブ化
 プレハブ化とは
プレハブとはオブジェクトの作り置きが出来る仕組みのことです。テンプレートとして使用できる。
Assets/Prefabsに、Hierarchyの「Tank」と「Helicopter」をドラッグ&ドロッ...
Unity:タグの設定
ゲームオブジェクトに付けるタグ名です。
タグは、各ゲームオブジェクトに1つだけ付けることができ、タグ名でゲームオブジェクトを検索すること
が可能になります。タグは1000個くらいからUnityエディタの処理が重くなる。3...
Unity:Transform
 Transformとは
シーン内のすべてのオブジェクトは Transform を持っています。
Transform はオブジェクトの位置、回転、スケールを格納し、操作するために使用されます。
全てのTrans...
Unity:物理挙動(Rigidbody2D)
 Rigidbody2Dとは
物理挙動を担当するコンポーネントです。ドキュメント:リジッドボディ 2D
物理エンジンの恩恵を受けられるようになり、重力を簡単にオブジェクトに掛けられたり、
力をオ...
Unity:物理挙動(Rigidbody2D)
先にMain Cameraのサイズを「3」ぐらいにして、GameタブでPlayボタンを押す。
Rigidbody2Dをデフォルト設定のままだと、オブジェクトは下に向かって落ちていきます。
これは重...
Unity:物理挙動(Rigidbody2D)
 Velocity
Rigidbody2Dが持つ、速度(velocity)を表すプロパティです。
オブジェクトを外側から動かすのではなく、オブジェクト自体に速度を持たせて内部で自動移動
するよう...
Unity:物理挙動(Rigidbody2D)
 AddForce
オブジェクトに力(Force)を加えるためのメソッドで、引数には加える力をセットします。
指定する値の単位はN(ニュートン)です。
rigidbody2D.AddForce(...
Unity:物理挙動(Rigidbody2D)
 AddForce
0km 20km 40km 80km 160km
アクセルを踏む
0km 20km 40km 20km 0km
アクセルを踏む
AddForceで1回だけ力を加えると、車のア...
Unity:物理挙動(Rigidbody2D)
AssetsでC#スクリプトの「Tank」を作成します。次ページにあるC#スクリプトを入力します。
TankにC#スクリプトをドラッグ&ドロップしてアタッチします。
Tankを横向き(Rotaio...
Unity:物理挙動(Rigidbody2D)
 速度制限
public float walkForce = 2f;
public float maxWalkSpeed = 5f;
void FixedUpdate() {
Rigidbody...
Unity:衝突判定(コライダー種類)
Unityでは当たり判定にColliderコライダーという判定機能を持つコンポーネントを使用します。
コライダーはRigidbodyの物理挙動と強く関係しています。
Rigidbodyは物理法則に従って動...
Unity:衝突判定(特殊なコライダー種類)
Unityでは基本のコライダー以外に、バネやヒンジなどを実現できるジョイントコライダーがあります。
ピタゴラスイッチ的なゲームを作るのに使用します。
コライダーの種類 内容
Spring Joint...
Unity:衝突判定(アタッチ)
プレハブ化したTankに「Box Collider 2D」をアタッチします。
Add Component→Physics 2D→Box Collider 2Dで追加します。
プレハブ化したHelicopterに...
Unity:衝突判定(イベント)
 他オブジェクトと衝突した瞬間に呼ばれる
void OnCollisionEnter2D(Collision2D collision)
基本的に一接触につき一回しか呼ばれません。
引数のcollisionに衝...
Unity:衝突判定(トリガー)
通常、コライダー同士はぶつかり反発(物理挙動)します。反発は不要だが当たり判定だけ取りたい場合
コライダーの「Is Trigger」のチェックをオンにします。そうするとコライダー同士はすり抜けます。
 他オブ...
OnCollision系関数やOnTrigger系関数は、コンポーネントの組み合わせによって
は呼ばれないことがある。(なので、衝突する側にRigidbodyを適用しとくべき)
「OnCollision系関数は、少なくともどちらか一方がRigi...
OnCollision系関数やOnTrigger系関数は、コンポーネントの組み合わせによって
は呼ばれないことがある。(なので、衝突する側にRigidbodyを適用しとくべき)
「OnTrigger系関数は、少なくともどちらか一方がRigidb...
Unity:テキスト表示(フォントについて)
Unityでは標準で 「Arial」という欧文用フォントが使用できます。
日本語の含まれていないArial等のフォントで日本語を表示しようとすると、端末の中の日本語フォントを
自動的に読み込んで表示...
Unity:テキスト表示(Notoフォントを使用する)
GoogleとAdobeが共同開発しApache ライセンスで提供されている「Noto Sans CJK」フォントを
使ってみましょう。
ちなみに、NotoはNo Tofu(表示されない漢...
Unity:テキスト表示(設定について)
 テキスト表示機能
【参照】UnityのuGUIのテキスト表示機能について解説してみる、uGUIのTextでリッチテキストを使用する
プロパティ 内容
Font フォント種類
Font Style N...
Unity:テキスト表示(設定について)
 テキスト表示機能
【参照】テキストの表示 - METAL BRAGE
プロパティ 内容
Alignment テキストの水平、垂直方向の配置
Horizontal
Overflow
テキストが広すぎて...
Unity:テキスト表示(エフェクトについて)
 テキストのエフェクト表示
【参照】UnityのuGUIのテキスト表示機能について解説してみる
AddComponentで「UI → Effects → Shadow」で影を追加する
AddCo...
Unity:テキスト表示(グラデーションについて)
 テキストのグラデーション表示
【参照】テキストグラデーション、原文 Unity3D gradient effect
上記サイトのC#スクリプト「Gradient」を作成する。
AddCom...
Unity:テキスト表示(カスタムフォントについて)
 カスタムフォント(ビットマップフォント)
カスタムフォントはスプライトのアトラスのように、文字を並べたテクスチャから任意の文字を切り出して
表示する仕組みのフォントです。文字のグラフィッ...
Unity:テキスト表示(カスタムフォント:BMFont文字)
 カスタムフォント(ビットマップフォント)
【参照】mieki256/ChrRectSet
上記サイトの通りに作成する。「Assets→Create→Custom Font」/「...
Unity:テキスト表示(カスタムフォント:等間隔文字)
 カスタムフォント(ビットマップフォント)
【参照】mieki256/ChrRectSet
上記サイトの通りに作成する。「Assets→Create→Custom Font」/「Ass...
Unity:重ね合わせ
 Z値によるスプライト表示の優先順位
Unityではデフォルトで、カメラが「X:0、Y:0 、Z:-10」に設定されている。
スプライトのZ値を「1」や「2」のようにプラス値方向へ大きくするほど奥に表示される。
 S...
Unity:重ね合わせ
 Order In Layer
ソーティングレイヤー内でスプライト表示をさらに細かく指定したい場合に使用します。
ソーティングレイヤーをたくさん作って優先順位を変えることもできるのですが、管理が大変になるので、
オーダ...
Unity:レイヤーの設定
レイヤーはスプライトのソーティングレイヤーと違い、設定しても表示の前後関係には影響を及ぼしません。
レイヤーは画像編集ツールと同じような概念で使います。レイヤーごとに一時的に編集不可にできます。
例えば、編集する際に...
Unity:レイヤーによる当たり判定の制御
Unity公式チュートリアルのシューティングの「第05回 当たり判定とアニメーションイベントとレイヤー」
では、「Layer Collision Matrix」を使い、レイヤー同士の当たり判定を行うか...
Blender:パンダのモデリング
初心者のための!作って学ぶBlenderの基礎 - 日本VTR実験室
③マテリアル・テクスチャを設定する
④ボーンを設定する ※今回は時間的に間に合わないと思うので次回に持ち越します。
今回の学ぶポイント
・...
Blender:パンダのモデリング
パンダモデリング資料
https://github.com/yaju/ShizuDev_UnityAndBlender/tree/master/Session8
Blender:基本操作
 拡大・縮小
マウスのホイールで3Dモデルの拡大・縮小
 視点の向きの変更
マウスのホイールを押しながらマウス移動
 視点の移動
SHIFTキーとマウスのホイールを押しながらマウス移動
 前後不覚になった場合
...
Blender:マテリアル
 マテリアルとは?
メッシュオブジェクトに対して、色や質感を与えることが出来ます。
 マテリアル追加
プロパティウインドウのヘッダーでマテリアルを選択し、新規ボタンをクリックします。
Blender:マテリアル
 ディフューズ
主に物質の「色」が変えられます。
色を白、強度を「1.000」にします。
 スペキュラー
ハイライト(光で明るくなるところ)に関する設定です。
色を白、種類を「フォン」、強度を「0.700」、硬さ...
Blender:マテリアル
 オブジェクトに設定
3D Viewを見ると、パンダが白くなっています。分かりにくい場合、別の色に一旦変更してみましょう。
Blender:UVテクスチャを作る
 メッシュオブジェクトを展開
モデリングで作った立体物を、平面に展開します。アジの開きのようにしていきますが、これが難しい。
パンダの中央を真っ二つにします。Altキーを押しながら右クリックすると中央がオ...
Blender:UVテクスチャを作る
腕と耳と尻尾にシームを付けていきます。
各部分のShiftキーを押しながら右クリックで、底を囲んでシームを付けてみます。
パンダの向きをいろいろ変えないと線が付けれない。
※Altキーを押しながら右クリック...
Blender:UVテクスチャを作る
腕と耳と尻尾の各底以外にシームを付けていきます。
どうすれば見本のようになるのか経験が必要です。すみませんが、今現在はまだよく分かっていません。
隠面処理オフにして、隠れた面を選択しないようになんとなくシー...
Blender:UVテクスチャを作る
シームを付けたのがどのように展開されるかは、先に「A」キーで全選択します。
「U」キーで出るメニューの「展開」またはシェーディング/UVタブの「展開」ボタンを押します。
ヘッダの「Default」から「UV...
Blender:UVテクスチャを作る
 展開図
右の見本の展開図と全然違いますね。経験が必要です。
Blender:UVテクスチャを作る
 テクスチャを描く
ガイドの書き出しはUV/Image Editorのヘッダーから、UVsををクリック。
一番上のExport UV Layoutを選びます。任意の名前でpngデータが書き出されるので、
...
Blender:UVテクスチャを作る
 テクスチャを描く
ガイドの書き出しはヘッダーの「UV Editing」を選択してから、
真下の「UV」をクリック。一番上の「UV配置をエクスポート」を選びます。
任意の名前でpngデータが書き出されるの...
Blender:UVテクスチャを作る
 テクスチャを描く
パンダの黒色(R:66、G:66、B:66)
Blender:UVテクスチャを作る
 UVテクスチャを読み込む
テクスチャの読み込みは、プロパティパネルのテクスチャタブから行います。
新しいテクスチャを新規で追加します。
Blender:UVテクスチャを作る
 UVテクスチャを読み込む
デフォルトだと内蔵のテクスチャ「cloud」が設定されているので、Image/Movieに変更します。
続いてMappingの項目で、CoordinateをGeneratedか...
Blender:UVテクスチャを作る
 UVテクスチャを読み込み確認
読み込まれているかどうかの確認は、3D Viewのヘッダーで、ディスプレイモードをRenderdにします。
これでレンダリングの絵がリアルタイムで見られるはずです。
ご清聴ありがとうございました!
UnityとBlenderハンズオン第8章
UnityとBlenderハンズオン第8章
Upcoming SlideShare
Loading in …5
×

UnityとBlenderハンズオン第8章

6,023 views

Published on

静岡Developers勉強会のUnityとBlenderハンズオン第8章の資料となります。

Published in: Technology
  • Be the first to comment

UnityとBlenderハンズオン第8章

  1. 1. UnityとBlenderハンズオン 静岡Developers勉強会 第8章 UnityとBlenderの学び直し
  2. 2. はじめに 静岡Developers勉強会では、過去に下記の勉強会を行いました。 2010年:「Programming in Haskell」 2011年:「JavaScript: The Good Parts」 2012年:「HTML5&CSS3実践入門」、「GitHubハンズオン」、 「node.jsハンズオン」 2013年:「入門 機械学習」 2014年:「実践 コンピュータビジョン」 2015年は上記の勉強会で学んだことを実践し、Shizudev名義のスマホアプリ を開発します。 作成後は公開用のサイトや動画も作成し、機械学習を使ってダウンロード状 況などを分析していきます。 スマホの広告費は会費にあて、万が一予定より多く収入が入った場合には寄 付を考えています。
  3. 3. 自己紹介  やじゅ@静岡・・・漢字名は「八寿」 平口八寿人(https://www.facebook.com/yasuhito.hiraguchi) アラフォーエンジニア、元MSMVP(VisualBasic) 静岡県島田市のSL(大井川鉄道)が走っている所に在住 Twitter:yaju はてなID:Yaju3D http://blogs.wankuma.com/yaju/ http://yaju3d.hatenablog.jp/ 数学と物理を基礎からやり直す) http://www.slideshare.net/yaju88/presentations (スライド)
  4. 4. 概要 2015年の静岡Developers勉強会は「スマホアプリの開発」を題材とします。 スマホアプリを開発する上で、汎用的なツールの使い方を学びます。 ・Unity 統合開発環境を内蔵し、複数のプラットホームに対応するユニティ・テクノロジーズが 開発したゲームエンジンである。ゲームとインタラクティブな3Dコンテンツ制作のため の常識にとらわれない強力な機能を提供します。 ・Blender オープンソースの3DCG制作ツールです。 3Dモデルの作成、レンダリングのほかアニメーション、コンポジット機能も備える。
  5. 5. セッション内容  Unityの学び直し 今までチュートリアルをこなすことで精一杯になってしまい、理解度が弱かったため、 基礎部分を学び直していく。  パンダのモデリング 初心者のための!作って学ぶBlenderの基礎:③マテリアル・テクスチャを設定する - 日本VTR実験室 http://nvtrlab.jp/column/2-3  スマホアプリのアイディア 今年は、Shizudev名義でスマホアプリを作成します。 プロトタイプ版を作成する予定です。※今回は間に合わなかったけど
  6. 6. Unityの学び直し  はじめに 前回、ミニゲーム発表会を行ったが、作成する上でまだちゃんと理解できていない部分があった。 今までチュートリアルをこなすことで精一杯になってしまい、理解度が弱かったため、 基礎部分を学び直していく。 資料作成の都合上、間に合わないのは持ち越します。資料作成が手一杯で間に合わないんだもん。 基礎部分を学ぶ上で、下記の資料を一部使わせて頂いた。感謝します。 シューティングゲーム用ドット絵フリー素材 http://stg.iaigiri.com/material/
  7. 7. Unityの学び直し  アジェンダ ・アトラスからの切り出し ・スプライトアニメーションの作成 ・プレハブ化 ・タグの設定 ・Transform ・物理挙動(Rigidbody 2D) ・衝突判定 ・フォント ・重ね合わせ ・レイヤーの設定 ・レイヤーによる当たり判定の制御 ・BGM、効果音 ・コ・ルーチン ・背景のスクロール ・ゲームマネージャ ・シーンの切り替え ・アニメーション ・パーティクル ・モバイル機器に転送 などは次回に持ち越します。
  8. 8. Unity:アトラスからの切り出し  アトラスとは スプライトが集まった1つの画像データ。スプライトシートともいう 今回は素材として、「シューティングゲーム用ドット絵フリー素材」の一部を使用します。 http://stg.iaigiri.com/material/ 雑魚中型ヘリ2・3 小型戦車
  9. 9. Unity:アトラスからの切り出し 先にAssets内にUnityの基本ルールに則ったフォルダを作成して置いてください。 Assets/Spritesフォルダにダウンロードした画像を入れます。 Sprite Modeを「Multiple」に変更して、「Sprite Editor」ボタンをクリックします。
  10. 10. Unity:アトラスからの切り出し Sprite Editor画面で「Slice」をクリックします。 今までチュートリアルでやってきたのは「Grid」でしたが、今回は「Automatic」を選択します。 「Slice」ボタンをクリックします。そして、「Apply」ボタンをクリックします。 程よく分解されます。雑魚中型ヘリも同様に行います。
  11. 11. Unity:スプライトアニメーションの作成 小型戦車の3つを選択して、Hierarchyにドラッグ&ドロップします。 アニメーションの保存ダイアログ画面が表示されるので、Assets/Animationsに「Tank.anim」で保存します。 その後にHierarchyにて、「小型戦車_0」から「Tank」に名前を変更します。
  12. 12. Unity:スプライトアニメーションの作成 砲台を選択して、Hierarchyにドラッグ&ドロップします。 Hierarchyにて、「小型戦車_3」から「Battery」に名前を変更します。 「Battery」を「Tank」に配下に移動させます。 Main CameraのSizeを「1」に変更して、「Game」タブに変更してプレイボタンをクリックします。 戦車が走っているようにアニメーションします。
  13. 13. Unity:スプライトアニメーションの作成 雑魚中型ヘリをCtrlキーを押しながら離れた2つ選択して、Hierarchyにドラッグ&ドロップします。 アニメーションの保存ダイアログ画面が表示されるので、Assets/Animationsに「Helicopter.anim」で 保存します。その後にHierarchyにて、「雑魚中型ヘリ2・3_0」から「Helicopter」に名前を変更します。 戦車の左横に配置して、「Game」タブに変更してプレイボタンをクリックします。 プロペラが回るアニメーションをします。
  14. 14. Unity:プレハブ化  プレハブ化とは プレハブとはオブジェクトの作り置きが出来る仕組みのことです。テンプレートとして使用できる。 Assets/Prefabsに、Hierarchyの「Tank」と「Helicopter」をドラッグ&ドロップしてプレハブ化させます。 プレハブ化したらHierarchyの「Tank」と「Helicopter」を選択して削除します。 今度はプレハブ化した「Tank」と「Helicopter」から、 Hierarchyにドラッグ&ドロップします。 砲台が戦車に隠れてしまっているので、「Battery」のZ値を「-1」として描画順を上にします。 「Tank」の「Apply」ボタンでクリックして確定します。
  15. 15. Unity:タグの設定 ゲームオブジェクトに付けるタグ名です。 タグは、各ゲームオブジェクトに1つだけ付けることができ、タグ名でゲームオブジェクトを検索すること が可能になります。タグは1000個くらいからUnityエディタの処理が重くなる。30個くらいが管理しやすい。 例 GameObject.FindWithTag(“Enemy”)、 GameObject.FindGameObjectsWithTag(“Enemy”) Tankにタグを追加します。InspectorのTagで「Ememy」を追加して、タグに「Ememy」をセットします。 プレハブ化されているので、「Apply」ボタンで適用します。同様にBatteryとHelicopterにも付けましょう。
  16. 16. Unity:Transform  Transformとは シーン内のすべてのオブジェクトは Transform を持っています。 Transform はオブジェクトの位置、回転、スケールを格納し、操作するために使用されます。 全てのTransform は親を持ち、階層的に位置、回転、スケールを適用することが出来ます。 Vector3.upとtransform.up の向きの違い Transformの回転は、クォータニオン(Quaternion)の構造体を使用していてパラメータは4つ必要。 //これは間違い transform.rotation = new Vector3(x, y, z); //これが正しい transform.rotation = new Quaternion(x, y, z, w);
  17. 17. Unity:物理挙動(Rigidbody2D)  Rigidbody2Dとは 物理挙動を担当するコンポーネントです。ドキュメント:リジッドボディ 2D 物理エンジンの恩恵を受けられるようになり、重力を簡単にオブジェクトに掛けられたり、 力をオブジェクトに加えて動かしたり出来ます。 Unityの初期値では、地球と同じで質量1kgのモノに9.81N(ニュートン)力が重力として働いている。 ※質量であるMassプロパティは、初期値で「1」(1kg)に設定されている。 プレハブ化したTankにRigidbodyをアタッチします。 Add Component→Physics 2D→Rigidbody 2Dで追加します。
  18. 18. Unity:物理挙動(Rigidbody2D) 先にMain Cameraのサイズを「3」ぐらいにして、GameタブでPlayボタンを押す。 Rigidbody2Dをデフォルト設定のままだと、オブジェクトは下に向かって落ちていきます。 これは重力であるGravity Scaleプロパティが「1」に設定されており、オブジェクトが重力の影響 を受けるからです。 Gravity Scaleプロパティを「0」に設定すれば重力の影響を受けずに、その場にとどまり続けます。
  19. 19. Unity:物理挙動(Rigidbody2D)  Velocity Rigidbody2Dが持つ、速度(velocity)を表すプロパティです。 オブジェクトを外側から動かすのではなく、オブジェクト自体に速度を持たせて内部で自動移動 するように設定させることが出来ます。 Gravity Scaleを「0」にして、下記コードにすればオブジェクトの上方向に向かって動きます。 rigidbody2D.velocity = transform.up * 1; 40km 40km 40km 40km 40km 時速40kmで走れ velocityで速度を指定すると、後は自動的にその速度 で走り続けるように物理エンジンが計算してくれる。
  20. 20. Unity:物理挙動(Rigidbody2D)  AddForce オブジェクトに力(Force)を加えるためのメソッドで、引数には加える力をセットします。 指定する値の単位はN(ニュートン)です。 rigidbody2D.AddForce(new Vector2(0, 5)); Start()で一度だけ呼べば一回だけ力が加えられる事になりますが、Update()で何回も呼ぶと何回 も力を加えることになるので、オブジェクトはだんだん加速していきます。 Gravity Scaleが「0」に設定されていれば重力の影響を受けないので、一回力を加えればそのまま の速度を保ちますが、重力が設定されていれば力を加えた後だんだん速度が落ちていきます。
  21. 21. Unity:物理挙動(Rigidbody2D)  AddForce 0km 20km 40km 80km 160km アクセルを踏む 0km 20km 40km 20km 0km アクセルを踏む AddForceで1回だけ力を加えると、車のアクセル を一瞬だけ踏んだように、最初だけ加速して、 その後減速して停止する。 アクセルを踏む アクセルを踏む アクセルを踏む アクセルを踏む AddForceで常に同じ力を加え続けると、車のアクセ ルを常に踏み込むのと同じで、どんどん加速する。
  22. 22. Unity:物理挙動(Rigidbody2D) AssetsでC#スクリプトの「Tank」を作成します。次ページにあるC#スクリプトを入力します。 TankにC#スクリプトをドラッグ&ドロップしてアタッチします。 Tankを横向き(Rotaion Z:90)にします。小さいのでMain Cameraのサイズを「2.4」程度にします。 Rigidbody 2DのGravity Scaleプロパティが「0」に設定されていることを確認します。 Gameタブでプレイボタンを押して、左右キーで加速する戦車をコントロールしてみましょう。
  23. 23. Unity:物理挙動(Rigidbody2D)  速度制限 public float walkForce = 2f; public float maxWalkSpeed = 5f; void FixedUpdate() { Rigidbody2D rigidbody = GetComponent<Rigidbody2D>(); float h = Input.GetAxis("Horizontal"); //制限速度以下だったら、力を加える if(rigidbody.velocity.x < maxWalkSpeed) { rigidbody.AddForce(Vector2.right * h * walkForce); } //制限速度より大きかったら、自分の速度を制限速度に合わせる if(Mathf.Abs(rigidbody.velocity.x) > maxWalkSpeed) { //Mathf.Sign 値の符号を取得 rigidbody.velocity = new Vector2( Mathf.Sign(rigidbody.velocity.x) * maxWalkSpeed, rigidbody.velocity.y); } }
  24. 24. Unity:衝突判定(コライダー種類) Unityでは当たり判定にColliderコライダーという判定機能を持つコンポーネントを使用します。 コライダーはRigidbodyの物理挙動と強く関係しています。 Rigidbodyは物理法則に従って動かすものですが、Colliderは衝突判定を可能にするものになります。 Polygon Collider 2D(左)とEdge Collider 2D(右)の違い、地面の凸凹ならEdgeを使用するのが良い コライダーの種類 内容 Circle Collider 2D 円のコライダー、もっとも高速に処理されます。 Box Collider 2D 長方形のコライダーです。 Edge Collider 2D 境界線のコライダーです。頂点を自由に増やせます。 Polygon Collider 2D ポリゴン形状のコライダーです。頂点を自由に増やせます。
  25. 25. Unity:衝突判定(特殊なコライダー種類) Unityでは基本のコライダー以外に、バネやヒンジなどを実現できるジョイントコライダーがあります。 ピタゴラスイッチ的なゲームを作るのに使用します。 コライダーの種類 内容 Spring Joint 2D 2つのゲームオブジェクトをスプリングで接続できるジョイントコライダーで す。 Distance Joint 2D 2つの物体を紐で繋いだように固定できるジョイントコライダーです。 Hinge Joint 2D ヒンジ(扉のちょうつがい)でゲームオブジェクトを接続するジョイントコラ イダーです。 Slider Joint 2D スライドする機構でゲームオブジェクトを接続できるジョイントコライダー です。スライド扉等などが表現できます。 Wheel Joint 2D 車のタイヤのように回転する物体を実現するジョイントコライダーです。
  26. 26. Unity:衝突判定(アタッチ) プレハブ化したTankに「Box Collider 2D」をアタッチします。 Add Component→Physics 2D→Box Collider 2Dで追加します。 プレハブ化したHelicopterに「Rigidbody 2D」と「Circle Collider 2D」をアタッチします。 Gravity Scaleは「0」に設定しておきます。「Is Trrgger」のチェックオン/オフの違いは後で確認します。 とりあえず、戦車をヘリコプターにぶつけてみましょう。あ~れ~と言いたくなりますよ。
  27. 27. Unity:衝突判定(イベント)  他オブジェクトと衝突した瞬間に呼ばれる void OnCollisionEnter2D(Collision2D collision) 基本的に一接触につき一回しか呼ばれません。 引数のcollisionに衝突したオブジェクトが格納されています。名前で判定して破棄することが出来る。 if (collision.gameObject.name == “Bomb”) { Destroy (c.gameObject); }  他オブジェクトと触れている間に呼ばれる 触れている間は毎フレーム、メソッドが呼ばれます。 void OnCollisionStay2D(Collision2D collision);  衝突した他オブジェクトから離れた瞬間に呼ばれる 基本的に一接触につき一回しか呼ばれません。 void OnCollisionExit2D(Collision2D collision); ■衝突する側 ・Collider ・Rigidbody ■衝突される側 ・Collider 衝突する側にRigidbodyの適用が必要
  28. 28. Unity:衝突判定(トリガー) 通常、コライダー同士はぶつかり反発(物理挙動)します。反発は不要だが当たり判定だけ取りたい場合 コライダーの「Is Trigger」のチェックをオンにします。そうするとコライダー同士はすり抜けます。  他オブジェクトと衝突した瞬間に呼ばれる 基本的に一接触につき一回しか呼ばれません。 void OnTriggerEnter2D(Collider2D collision)  他オブジェクトと触れている間に呼ばれる 触れている間は毎フレーム、メソッドが呼ばれます。 void OnTrigger2D(Collider2D collision);  衝突した他オブジェクトから離れた瞬間に呼ばれる 基本的に一接触につき一回しか呼ばれません。 void OnTriggerExit2D(Collider2D collision); トリガーにした場合のイベントは OnCollision系を使わないで、 OnTrigger系を使用する。
  29. 29. OnCollision系関数やOnTrigger系関数は、コンポーネントの組み合わせによって は呼ばれないことがある。(なので、衝突する側にRigidbodyを適用しとくべき) 「OnCollision系関数は、少なくともどちらか一方がRigidbodyを持つ場合に呼ば れる。トリガー(Is Triggerオン)に対しては一切呼ばれない。」 コリジョンの発生する組み合わせ(OnCollision系関数) Unity:衝突判定(発生する組み合わせ:OnCollision系) Collider Rigidbody Collider Trriger Rigidbody Trriger Collider ○ Rigidbody ○ ○ Collider Trriger Rigidbody Trriger
  30. 30. OnCollision系関数やOnTrigger系関数は、コンポーネントの組み合わせによって は呼ばれないことがある。(なので、衝突する側にRigidbodyを適用しとくべき) 「OnTrigger系関数は、少なくともどちらか一方がRigidbodyを持ち、少なくとも どちらか一方のColliderがトリガー(Is Triggerオン)になっている場合に呼ばれる」 トリガーの発動する組み合わせ(OnTrigger系関数) Unity:衝突判定(発生する組み合わせ:OnTrigger系) Collider Rigidbody Collider Trriger Rigidbody Trriger Collider ○ Rigidbody ○ ○ Collider Trriger ○ ○ Rigidbody Trriger ○ ○ ○ ○
  31. 31. Unity:テキスト表示(フォントについて) Unityでは標準で 「Arial」という欧文用フォントが使用できます。 日本語の含まれていないArial等のフォントで日本語を表示しようとすると、端末の中の日本語フォントを 自動的に読み込んで表示するようになっているため、いろいろと問題があるようです。 参照:Unityで日本語フォントを使う、Sceneの読み込みで5秒近く固まる際に真っ先に疑うべきこと、 iOS 8.2 以降で日本語フォントが正しく表示されない 日本語を使用したい場合、日本語フォントをプロジェクトに追加するのが良さそうです。 有名なところでは「M+ FONTS」、最近ではGoogleとAdobeが共同開発しApache ライセンスで提供されてい る「Noto Sans CJK」フォントがあります。 【参照】 Unityで日本語フォントを使う 美しいフリーフォント M+ FONTS の種類が多すぎてわかりにくいので比較してみた Unityにもつかえる!アプリに使える商用利用可能・再配布可能なフォントまとめ Google と Adobe が共同開発し、Apache ライセンスで提供されている「Noto Sans CJK」フォント
  32. 32. Unity:テキスト表示(Notoフォントを使用する) GoogleとAdobeが共同開発しApache ライセンスで提供されている「Noto Sans CJK」フォントを 使ってみましょう。 ちなみに、NotoはNo Tofu(表示されない漢字が□=豆腐になるのを防ぐフォント)の意味です。 Google Noto Fontsのサイトにて、検索で日本語と入力すると、「Noto Sans CJK JP」が表示されます。 ダウンロード:NotoSansCJKJP-hinted.zip 解凍すると7種類フォントが入っています。種類の説明:Noto Sans CJK はオープンソースフォント Create→UI →Textで追加し、CanvasのRenderModeで「Screen Space Camera」に変更して Render Cameraに「Main Camera(Camera)」をアタッチする。 「NotoSansCJKjp-Regular.otf」をAssets/Fontsに格納し、Fontに「NotoSansCJKjp-Regular」を指定する。
  33. 33. Unity:テキスト表示(設定について)  テキスト表示機能 【参照】UnityのuGUIのテキスト表示機能について解説してみる、uGUIのTextでリッチテキストを使用する プロパティ 内容 Font フォント種類 Font Style Normal、Bold、Italic、Bold And Italic Font Size フォントサイズ Line Spacing 行間の幅 Rich Text オンでタグによる表示 例 <b>テスト</b> タグ 説明 <b> 太文字 <i> イタリック <size=文字サイズ> 文字の大きさ(ピクセル単位) <color=色> 文字の色 色:名前または16進 #rrggbb
  34. 34. Unity:テキスト表示(設定について)  テキスト表示機能 【参照】テキストの表示 - METAL BRAGE プロパティ 内容 Alignment テキストの水平、垂直方向の配置 Horizontal Overflow テキストが広すぎて矩形に収まらないような 状況を処理する為にとられる方法 オプション: Wrap と Overflow Vertical Overflow テキストが高すぎて矩形に収まらないような 状況を処理する為にとられる方法 オプション: Truncate と Overflow Best Fit オンでFont Sizeプロパティは無視され、コン トロールの矩形にテキストを合わせるように する。その際、Min SizeとMax Sizeが使われる Color テキストを描画するのに使用される色 Material テキストを描画するのに使われるマテリアル オプション 説明 Wrap 折り返す Horizontal Overflow 折り返さずTextエレメント の横幅からはみ出して表示 Truncate 縦幅からはみ出した行を削 除(非表示)にする Vertical Overflow 縦幅からはみ出しても表示 する
  35. 35. Unity:テキスト表示(エフェクトについて)  テキストのエフェクト表示 【参照】UnityのuGUIのテキスト表示機能について解説してみる AddComponentで「UI → Effects → Shadow」で影を追加する AddComponentで「UI → Effects → Outline」で輪郭を追加する AddComponentで「UI → Effects → PositionAsUV1」については用途が不明 グラフィック要素の頂点の座標を各頂点のUV1プロパティに設定して、シェーダーで扱えるようにする エフェクトは文字以外にも 画像に使用できます。
  36. 36. Unity:テキスト表示(グラデーションについて)  テキストのグラデーション表示 【参照】テキストグラデーション、原文 Unity3D gradient effect 上記サイトのC#スクリプト「Gradient」を作成する。 AddComponentで「UI → Effects → Gradient」でグラデーションを追加する 好みで、OutlineとShadowを追加する(描画順が関係するため、Gradientより後方に追加する) 5.1までのコードは「override void ModifyVertices」、5.2以降は「override void ModifyMesh」に変更する。 thx: Unity5.2のUIエフェクト - さけのさかなのブログ
  37. 37. Unity:テキスト表示(カスタムフォントについて)  カスタムフォント(ビットマップフォント) カスタムフォントはスプライトのアトラスのように、文字を並べたテクスチャから任意の文字を切り出して 表示する仕組みのフォントです。文字のグラフィックがそのまま表示されるため、通常のフォントよりも リッチな表現が可能です。 ビットマップフォントは、下記ツールを使用して作成するといいでしょう。 Windowsツール:Bitmap Font Generator、Bitmap Font Creator Macツール:Shoe Box 【参照】 mieki256/ChrRectSet Textの表示にビットマップフォントを使う Unityでカスタムフォントをエディタから設定する Unity|Macでbitmapフォントを作るにはなにがいいんじゃい ビットマップフォント画像を作るソフトについてメモ
  38. 38. Unity:テキスト表示(カスタムフォント:BMFont文字)  カスタムフォント(ビットマップフォント) 【参照】mieki256/ChrRectSet 上記サイトの通りに作成する。「Assets→Create→Custom Font」/「Assets→Create→Material」 (BMFontから出力された、fntファイル内容を元にして設定) 変更点:Texture Type 「GUI」→「Editor GUI and Legacy GUI」 Materialを指定しないと Colorが反映されてしまう
  39. 39. Unity:テキスト表示(カスタムフォント:等間隔文字)  カスタムフォント(ビットマップフォント) 【参照】mieki256/ChrRectSet 上記サイトの通りに作成する。「Assets→Create→Custom Font」/「Assets→Create→Material」 (等間隔で文字が配置されているビットマップフォント画像に対し、等間隔で分割して設定)
  40. 40. Unity:重ね合わせ  Z値によるスプライト表示の優先順位 Unityではデフォルトで、カメラが「X:0、Y:0 、Z:-10」に設定されている。 スプライトのZ値を「1」や「2」のようにプラス値方向へ大きくするほど奥に表示される。  Sorting Layer スプライト表示の優先順位をダイレクトに設定する機能。「ソーティングレイヤー」と「レイヤー」は別物 Helicopter Z:0 Tank Z:1 項目が下に行くほ ど、描画された時 に上に表示される Helicopter Back2 Tank Back1
  41. 41. Unity:重ね合わせ  Order In Layer ソーティングレイヤー内でスプライト表示をさらに細かく指定したい場合に使用します。 ソーティングレイヤーをたくさん作って優先順位を変えることもできるのですが、管理が大変になるので、 オーダーインレイヤーで調整します。 オーダーインレイヤーの数値が大きいほうが手前に表示されます。 同じソーティングレイヤー「Back1」でオーダーインレイヤーにて優先順位を変更している。
  42. 42. Unity:レイヤーの設定 レイヤーはスプライトのソーティングレイヤーと違い、設定しても表示の前後関係には影響を及ぼしません。 レイヤーは画像編集ツールと同じような概念で使います。レイヤーごとに一時的に編集不可にできます。 例えば、編集する際に邪魔なレイヤーを編集不可にすれば、選択したいオブジェクトだけを選択できます。 それ以外にも当たり判定やカメラの描画、ライトの光など様々な用途があります。 ちなみに Layerの0~7は、Unityが予め確保しているため編集不可のレイヤーです。
  43. 43. Unity:レイヤーによる当たり判定の制御 Unity公式チュートリアルのシューティングの「第05回 当たり判定とアニメーションイベントとレイヤー」 では、「Layer Collision Matrix」を使い、レイヤー同士の当たり判定を行うかどうかの設定をしています。 当たり判定を行うためにコライダーをゲームオブジェクトにアタッチしますが、必ずしも全てのコライダー 同士で当たり判定が発生するとは限りません。 少なくとも今回のシューティングゲームでは以下のように当たり判定に制限を設けなければいけません。 1: プレイヤーの弾とプレイヤーは当たらない 2: エネミーの弾とエネミーは当たらない 3: プレイヤーの弾とエネミーの弾は当たらない 4: プレイヤーの弾同士は当たらない 5: エネミーの弾同士は当たらない 6: エネミー同士は当たらない 7: プレイヤー同士は当たらない これらの制限を行う上で最も簡単なのがレイヤーで当たり判定を制御することです。
  44. 44. Blender:パンダのモデリング 初心者のための!作って学ぶBlenderの基礎 - 日本VTR実験室 ③マテリアル・テクスチャを設定する ④ボーンを設定する ※今回は時間的に間に合わないと思うので次回に持ち越します。 今回の学ぶポイント ・マテリアル ・テクスチャ ・ボーン
  45. 45. Blender:パンダのモデリング パンダモデリング資料 https://github.com/yaju/ShizuDev_UnityAndBlender/tree/master/Session8
  46. 46. Blender:基本操作  拡大・縮小 マウスのホイールで3Dモデルの拡大・縮小  視点の向きの変更 マウスのホイールを押しながらマウス移動  視点の移動 SHIFTキーとマウスのホイールを押しながらマウス移動  前後不覚になった場合 Homeキーを押す、または下側にある「ビュー」メニューから「全てを表示」を 選択すると3Dビューウィンドウに丁度すべてが収まるように視点が移動される。  履歴の参照とアンドゥで元に戻す 左側パネルの履歴にて 元に戻す(Ctrl + Z) やり直す(Shift Ctrl + Z)
  47. 47. Blender:マテリアル  マテリアルとは? メッシュオブジェクトに対して、色や質感を与えることが出来ます。  マテリアル追加 プロパティウインドウのヘッダーでマテリアルを選択し、新規ボタンをクリックします。
  48. 48. Blender:マテリアル  ディフューズ 主に物質の「色」が変えられます。 色を白、強度を「1.000」にします。  スペキュラー ハイライト(光で明るくなるところ)に関する設定です。 色を白、種類を「フォン」、強度を「0.700」、硬さを「250」にします。  シェーディング オブジェクトに関わる「光」について設定します。 放射を「0.07」、周囲を「1.000」、透光性を「0.000」にします。
  49. 49. Blender:マテリアル  オブジェクトに設定 3D Viewを見ると、パンダが白くなっています。分かりにくい場合、別の色に一旦変更してみましょう。
  50. 50. Blender:UVテクスチャを作る  メッシュオブジェクトを展開 モデリングで作った立体物を、平面に展開します。アジの開きのようにしていきますが、これが難しい。 パンダの中央を真っ二つにします。Altキーを押しながら右クリックすると中央がオレンジ色になります。 「Ctrl + E」キーを押すと出るメニュー(またはシェーディング/UVタブ)の「シームを付ける」を選択する。 シームを付けるとオレンジ色から赤色になります。 辺選択 隠面処理オン
  51. 51. Blender:UVテクスチャを作る 腕と耳と尻尾にシームを付けていきます。 各部分のShiftキーを押しながら右クリックで、底を囲んでシームを付けてみます。 パンダの向きをいろいろ変えないと線が付けれない。 ※Altキーを押しながら右クリックすると「ループ選択」になるのですが、場所によってならない。 辺選択に変更します。隠面処理オンにしとかないと線が表示されません。 辺選択 隠面処理オン
  52. 52. Blender:UVテクスチャを作る 腕と耳と尻尾の各底以外にシームを付けていきます。 どうすれば見本のようになるのか経験が必要です。すみませんが、今現在はまだよく分かっていません。 隠面処理オフにして、隠れた面を選択しないようになんとなくシームを付けてみます。 間違ってシームを付けた場合、間違った線を選択して「シームのクリア」をすれば解除できます。 辺選択 隠面処理オフ
  53. 53. Blender:UVテクスチャを作る シームを付けたのがどのように展開されるかは、先に「A」キーで全選択します。 「U」キーで出るメニューの「展開」またはシェーディング/UVタブの「展開」ボタンを押します。 ヘッダの「Default」から「UV Editing」に変更します。 シームを付けの全てが終わらなくても展開できるので、どのように展開されるか随時確認するといいです。
  54. 54. Blender:UVテクスチャを作る  展開図 右の見本の展開図と全然違いますね。経験が必要です。
  55. 55. Blender:UVテクスチャを作る  テクスチャを描く ガイドの書き出しはUV/Image Editorのヘッダーから、UVsををクリック。 一番上のExport UV Layoutを選びます。任意の名前でpngデータが書き出されるので、 それをガイドに絵を描きましょう。
  56. 56. Blender:UVテクスチャを作る  テクスチャを描く ガイドの書き出しはヘッダーの「UV Editing」を選択してから、 真下の「UV」をクリック。一番上の「UV配置をエクスポート」を選びます。 任意の名前でpngデータが書き出されるので、それをガイドに絵を描きましょう。
  57. 57. Blender:UVテクスチャを作る  テクスチャを描く パンダの黒色(R:66、G:66、B:66)
  58. 58. Blender:UVテクスチャを作る  UVテクスチャを読み込む テクスチャの読み込みは、プロパティパネルのテクスチャタブから行います。 新しいテクスチャを新規で追加します。
  59. 59. Blender:UVテクスチャを作る  UVテクスチャを読み込む デフォルトだと内蔵のテクスチャ「cloud」が設定されているので、Image/Movieに変更します。 続いてMappingの項目で、CoordinateをGeneratedからUVに変更します。
  60. 60. Blender:UVテクスチャを作る  UVテクスチャを読み込み確認 読み込まれているかどうかの確認は、3D Viewのヘッダーで、ディスプレイモードをRenderdにします。 これでレンダリングの絵がリアルタイムで見られるはずです。
  61. 61. ご清聴ありがとうございました!

×