饂飩コーディング

iOSアプリやら、Unityやら、Cocos2dやらごにょごにょ書いております

回る地球を作ってみよう!

f:id:appdeappuappu:20140602091856p:plain
↓実行結果
http://nrtkb.sakura.ne.jp/forblog/unityFolder/farEarth.html


おおまかて手順
1、Sceneに照明とSphereを二つ追加する
2、Sphereの中心を合わせて、大きさに若干違いを付ける←雲の層を表現
3、二つのSphereに回転アニメーションをそれぞれ付ける←雲の層は回転を遅くする
4、それぞれのSphereにTextureを貼付ける
5、カメラの調整を行う。


Unityでの手順は上記のように簡単ですが、地球を作成する場合はTextureの作成がポイントになってきます。それではTextureの作成方法は以下の手順で

1、ネット上から使えそうな地球の画像をひろってくる。(商用フリーとか)
http://earthobservatory.nasa.gov/Features/BlueMarble/BlueMarble_2002.php
↑今回はコチラから画像をつかわせていただきました。
2、Land Surface, Ocean Color, and Sea Ice と Clouds の二枚を使って作業を進めます
それぞれLandTexture.png、CloudTexture.pngと名前を変更します
3、それぞれの画像を512x512の大きさに縮小する。縦と横の比率が変に見えてもかまいません
 ↓こんな感じ
f:id:appdeappuappu:20140602093927p:plainf:id:appdeappuappu:20140602093945p:plain
4、CloudTexture.pngを雲以外の部分が段階的に透明になるように処理します。
  4−1、Photoshop Elementsで開く
  4−2、背景レイヤーを複製してレイヤーを追加する
  4−3、追加したレイヤーにフィルター→色調補正→階調の反転を選択する
  4−4、レイヤーマスクを選択するf:id:appdeappuappu:20140602100020p:plain
  4−5、レイヤーマスクの白い表示されている部分をOptionキーを押しながらクリックする
      f:id:appdeappuappu:20140602100800p:plain
  4−6、背景レイヤーの目のマークをクリックして不可視にする。
  4−7、レイヤーマスクが適用されたレイヤーにもう一度階調の反転をかける。
  4−8、PNG形式で保存するf:id:appdeappuappu:20140602100440p:plain


これで、LandTexture.pngとCloudTexture.pngができました。

これ以降はUnityで作業します
5、LandTexture,CloudTextureをAssetとして取り込み、Materialを二つ作成する
   LandTexture→Diffuseを選択
   CloudTexture→Transparent/Diffuseを選択
6、Sphereを二つ作成してそれぞれLandSphere,CloudSphereと名前を付けてそれぞれに5で作成したMaterialを設定する
   LandSphereは地上の部分をCloudSphereは雲の部分を表現しており透明化されていますf:id:appdeappuappu:20140602102447p:plain
7、LandSphere、CloudSphereのPositionを0、0、0として重ねます
8、LandSphereのScaleは1、1、1 CloudSphereのScaleは1.05,1.05,1.05と少し大きくします。これで地球らしくなりました
f:id:appdeappuappu:20140602102902p:plain
9、LandSphereを選択してAnimationタブを開き、AddCurveをクリックすると保存windowがでてくるので名前をLandAnimationとします。するとAssetにanimationとanimator二つのアイコンが追加されます。
10,Rotationを追加して、Y軸の変化を1秒後のキーフレームをクリックして360と入力。f:id:appdeappuappu:20140602103722p:plain
11、この状態でテスト再生してみると、回転が早いので最終フレームを6秒の辺りまでドラッグして移動させましょう。
12、CloudSphereも9〜10の作業を行い、最終フレームを8秒に移動させましょう

以上で完成です


カメラの位置を変更すれば色々なシーンで使えるかと思われます。


Unityゲーム プログラミング・バイブル

Unityゲーム プログラミング・バイブル

UnityではじめるC# 基礎編

UnityではじめるC# 基礎編

Unityで神になる本。

Unityで神になる本。

Mesh Collider Convexオプションについて

Mesh Colliderって3Dモデルの形状にそってColliderを設定してくれるので便利だけど、やっぱり衝突計算やらなにやら複雑になるんでパフォーマンスに影響が大きいんだろう。そのために?Convexオプションがあるんだけど、ConvexをオンにするとMesh Collider同士の衝突を判定できるらしい。
↓実行結果
http://nrtkb.sakura.ne.jp/forblog/unityFolder/ConvexTest.html


ここで注意が必要なのが、ConvexをONにした時にはMesh Colliderの形状が選択したMeshにはならない点。次の写真では真ん中が空洞になったModelの上に蓋の様にColliderがかぶさっています。(緑の線が一本入っています)
f:id:appdeappuappu:20140602080745p:plain


一方、Convex Offの場合はModelの形状に忠実にColliderがはりついているのが分かります。
f:id:appdeappuappu:20140602080750p:plain




Mesh Colliderは使う場面を考えて使いましょうね!



もちろんMesh Collider(Convex Off) 対 Mesh Collider以外なら通常判定してくれます。
実行結果の左の例、球体(Sphier Collider) 対 Mesh Collider(Convex Off)の様に。



Unityの教科書 Unity 2017完全対応版

Unityの教科書 Unity 2017完全対応版

透明TextureかModelingか検討

f:id:appdeappuappu:20140601112240p:plain
↓webで実行バージョン
http://nrtkb.sakura.ne.jp/forblog/unityFolder/web.html


透明Textureを試してみました!場面によっては使えますがモデリングした方がよい場合もありそうですね。
透明TextureはPNGjpeg以外)で透明な部分を持つTextureを外部アプリで作成し、ShaderでTransparent/Diffuseを選択すると透明化させてくれます。
右の透明Textureの方は、単なるCubeの透明Textureを適応させたものです。
f:id:appdeappuappu:20140601112449p:plain

一方、左の非透明モデルはモデリングソフトで立方体の内部をくりぬいた物をUnityに取り込んでいます。コチラは綺麗に内部もその外側も表示されていますが、透明Textureを用いた方はCube内のレンダリングが行われていないためCubeの奥行きが不自然になっています。

しかし、透明Textureを用いた方もCubeの外側に対してはレンダリングされていますので、奥行きがあまり無いObjectの場合には透明Textureで十分みたいですね。



Hexagonでの中抜きCubeの作成方法
1、position0,0,0にScale1,1,1のCubeを作成する
2、positon0,0,0にScale0.8,0.8,0.8のCubeを作成する
3、2のCubeのx、y、z軸にScaleを5になる様に設定して3つの直方体を作成する
4、1で作った立方体を元に3で作った直方体に大してBoolean Operationでくり抜く。f:id:appdeappuappu:20140601115429p:plain

Unityに自作3DモデルをImportする

Unityに自作した簡単な3Dモデルをインポートしてみます。
モデルはネットでもライセンスフリーの物があるのでそれを利用するのもいいんですが
簡単な物は自分でつくってみて、流れを理解するには自力ってのもいいですよね。

手順概要
1、Hexagon2.5でモデリングする
2、モデリングしたオブジェクトにUVマッピング作業を施す
3、Hexagon2.5でobj形式でexportする
4、Unityでimportしてtextureを設定する

1、Hexagon2.5でモデリングする
 今回はDaz3d.com にフリーでダウンロードできるHexagon2.5を使います。
http://www.daz3d.com/products/hexagon/hexagon-what-is-hexagon/←ダウンロードはこちらから

3DプリミティブからCubeを選択して設置します。ここでInspecterでpositonを0、0、0sizeを1、1、1、
にしておく。←これをしておくとUnityに取り込んだときの中心点がいい感じになります。
f:id:appdeappuappu:20140526112554p:plain


2、モデリングしたオブジェクトにUVマピング作業をほどこす
 オブジェクトを選択してから、UV&PaintタブからUnfoldを押します。するとUVViewが表示されるので
 CubeProjectionボタンを押す(Unfoldアイコンから二つ隣のアイコン)。するとPropatiesのUVGizmoが表示される
 ので、一番右の展開を選択する。この状態で面選択ボタンをおしてからUVパネルにマウスを持っていくとどこに
 あたるのか青い表示に変わるので分かりやすいです。
 f:id:appdeappuappu:20140526113100p:plain

 UVViewの下に小さなカメラがあるので押して、UVファイルをPNGで出力します。
 f:id:appdeappuappu:20140526113615p:plain
 あとはこのPNGPhotoshopか何かで編集すればOK

Photoshopで編集が終わったら、Hexagon2.5のmaterial InspectorのTextureから読み込みます。
 最初はColorになっているのでTexture imageに変更するとPNGファイルが読み込める様になります。
f:id:appdeappuappu:20140526113929p:plain

3、Hexagon2.5でobj形式でexportする
マッピングの具合を確認できたら、File→Exportでobj形式で出力します。
f:id:appdeappuappu:20140526114324p:plainf:id:appdeappuappu:20140526114319p:plain


4、Unityでimportしてtextureを設定する
 Project ViewでAssetをImportする。.objと.pngの二つをインポートしてきましょう。
 f:id:appdeappuappu:20140526114833p:plain

 インポートするとAssetが出来上がるので、Texture inspectorでAssetの一番左のObjectにpngからの画像を設定します
 f:id:appdeappuappu:20140526115028p:plain
 f:id:appdeappuappu:20140526115032p:plain

 あとは、このAssetを使えばUVマッピングされた自作モデルをUnityで使用することができます。

Flashでの実行結果はコチラ↓
http://nrtkb.sakura.ne.jp/forblog/unityFolder/forweb.html
 


 

Unityでnend広告を実装 iOS

思った以上に簡単に実装できます。
iOSとかCocos2Dでの実装とは比べ物にならないくらい。
Androidは→
Unityでnend広告を実装 Android編 Unityから実機テスト(非ADT) - 饂飩コーディング


詳細手順はnendの取り説を見ながら進めれば問題なくできるはずです。

大まかな手順は
1、Unity ProjectにnendPluginをインポート
2、enmity Game Objectを作成
3、上記のempty Game ObjectにインポートしたNendAdBannerスクリプトを追加する
4、追加したスクリプトのInspectorで広告のIDとサイズ、設置場所を設定
5、buildを出力
6、XcodeでProjectにAdSupport.framework,Security.frameworkを追加する
7、実機でテスト!

こんな感じです。まじ簡単

ただし、Build毎にXcodeフレームワークを追加しなきゃいけなかったりと
少々面倒な所もありますが・・・
↑これはUnity側のBundleScriptをいじればいけそうなんだけどそれままた今後の課題ということで



↑実装結果



そして、こんかいはユニティちゃんをつかってみました。
ModelもAnimatiomも音も入っているので色々つかえそうですね。


ユニティちゃんライセンス

本コンテンツは、『ユニティちゃんライセンス条項』に基づいて公開・配布されるものです。本コンテンツをご利用される場合は、ユニティ・テクノロジーズ・ジャパン合同会社が定める『キャラクター利用のガイドライン』をお守りいただく必要があります。

Unityでとりあえず実装したい事 その1 glScissorっぽいっこと


これでスロットマシーン的な物が作れそうな気がする。 - YouTube


cocos2dでは実装したんだけど、ゲーム画面上に複数のViewを配置して
そこにそれぞれ数字のSpriteを上から下に流すってのを実装したい。
まぁ、マスクみたいなもんなんだけど複数表示してコントロールできればOK


cocos2dの時はglScissorを実装したclass作ってそれだけだったんだけど
Unityではどうしたものか?とglScissorで検索しまくったけど収穫なし。


結局は以下の方法でやれるのかな?(パフォーマンス的には不明、今後検証予定)
同一Scene内にカメラを三つ作成してそれぞれの視野が被らない様に、アニメーションするSpriteを
設置→それぞれのカメラのViewPort Rectを設定する。

こんな感じかな?
f:id:appdeappuappu:20140520101408p:plainf:id:appdeappuappu:20140520103118p:plainf:id:appdeappuappu:20140520103119p:plainf:id:appdeappuappu:20140520103120p:plain


↓実行結果がこんな感じ


もしかして、unityのカメラってglScissor使ってるってこと?

Unityによる2Dゲーム開発入門1

↑近所の図書館で借りて来ました。

オススメポイント
Unityを使って広告付きアプリ開発の流れを理解するにはぴったりの一冊です
詳細な解説書は他の書籍をおすすめします。


内容とかですが
Unityを初めて間もない自分はまずはこちらで勉強しました。

Unityを使って広告付きのアプリをリリースするのであれば
流れを一通り実際に手を動かしながら理解できる書籍ですので
おすすめです。

内容的にはiPhoneアプリを過去に数本リリースし広告を実装
した事がある方なら数時間で理解できる内容です。

もちろん初心者の方にも理解しやすい内容だと思います。

自分はHexagon、Carrara、Cocos2d等使っていたので
UnityのUIは取っ付きやすかったんですが、
UI周りの説明もあるので納得の内容です。

Unityインストール
Spriteの説明
Componentの説明(物理)
Animation
Game作成
広告の実装
端末へのインストール
アプリリリース


Unityってcocos2dをGUIである程度操作できるものかな?なんて今は理解しています
cocos2dには戻れないかも・・・cocosBuilderって似てるのかな?

次回からはUnityの2Dアプリ開発について記述しようかと思っています。