注意

スマホから取得する方法になります。PC本体のセンサー情報を取得にはこの方法だと無理です。

UnityリファレンスのURL

リファレンスを読めば分かる人はコチラ
- https://docs.unity3d.com/ja/2019.3/ScriptReference/Gyroscope-rotationRate.html
- https://docs.unity3d.com/ja/2019.3/ScriptReference/Gyroscope-rotationRateUnbiased.html

以降は私の記事から情報を得る人向けです(忘れやすい私でも分かるように書いています)

1. 角速度の取得方法(Part1)

最初にジャイロセンサーを有効化します

// Start is called before the first frame update
void Start()
{
  Input.gyro.enabled = true;
}

有効化後に角速度を取得します - 単位 : Rad/Sec
(念のためロール・ピッチ・ヨー方向が合っているかは実機で確認した方が良いです。)

private void UpdateGyroData()
{
  double pitch = Input.gyro.rotationRate.x;
  double yaw = Input.gyro.rotationRate.y;
  double roll = Input.gyro.rotationRate.z;
}

rotationRateは角速度センサーから取得した生のデータです。
なぜ説明しているのかを理解したい方はPart2を読みましょう。

2. 角速度の取得方法(Part2)

Part2ではrotationRateUnbiasedを説明します。
より正確な値を取得する人向けに使用が推奨されます。
rotationRateで取得すると自動車がドリフトしている時の値が正しくないケースがあります。
ドリフト時の様に誤差が生まれやすい環境で使用する場合に使用が推奨されています。
(ハードウエアがそれらを考慮した設計をされていればrotationRateで取得しても問題ありません)

最初にジャイロセンサーを有効化します

// Start is called before the first frame update
void Start()
{
  Input.gyro.enabled = true;
}

有効化後に角速度を取得します - 単位 : rad/sec

private void UpdateGyroData()
{
  double pitch = Input.gyro.rotationRateUnbiased.x;
  double yaw = Input.gyro.rotationRateUnbiased.y;
  double roll = Input.gyro.rotationRateUnbiased.z;
}

3. Rad/Sec から Deg/Sec に変換する

ラジアンより度の方が一般的なので変換する事が多いと思います。
メモ程度で記載します。参考になる資料は[参考]欄に記載しておきます。

private void UpdateGyroData()
{
  double pitch = (Input.gyro.rotationRate.x * 180) / Mathf.PI;
  double yaw = (Input.gyro.rotationRate.y * 180) / Mathf.PI;
  double roll = (Input.gyro.rotationRate.z * 180) / Mathf.PI;
}

Unityの関数を使用して変換する事も出来ます。
今回はdouble型ですがfloat型の時に使用するといいと思います。

private void UpdateGyroData()
{
  double pitch = Input.gyro.rotationRate.x * Mathf.Rad2Deg;
  double yaw = Input.gyro.rotationRate.y * Mathf.Rad2Deg;
  double roll = Input.gyro.rotationRate.z * Mathf.Rad2Deg;
}

もっといい方法(アドバイス)や感想があったらコメントしてください。
おいしいと思うお店の情報もお待ちしております。

[参考]
Unity専用関数を使用: https://docs.unity3d.com/ja/current/ScriptReference/Mathf.Rad2Deg.html
ラジアンと度の概念 : https://juken-mikata.net/how-to/mathematics/radian.html

はじめに

この記事は『メイドイン「俺」』から学ぶゲーム作り②台本(スクリプト)の書き方編
の続きです。
この記事は超初心者向けなのでアニメーションの作り方ではなく、アニメーションの構造について説明したいと思います。

アニメーションについて

みなさんはパラパラ漫画を描いたことはありますか？
パラパラ漫画とは少し違った複数枚の絵を高速でめくることで実際動いてるように見せるものです。

実はアニメーションとはそのパラパラ漫画のようなものなのです。
実際には動いていないけど、複数枚のイラストを交互に見せることによって動いてるように見えています。

ではこれが実際どのような感じなのか、例を追って見ていきましょう。

(例)風船が浮いているように見せたい時

まず風船の画像を用意します。

これだけだとただの風船ですよね。

では少し位置の違った風船の画像二枚を用意します。

この二枚を交互に表示すると、、

こんな感じに！少しぎこちないですが画像の位置が変わっていないにも関わらずプカプカ浮いているように見えます。

このように、画像を重ねることで実際にその動きをしているように見せるのがアニメーションという機能です。
もしマリオに歩くアニメーションがなかったら、マリオがただ平行移動しているだけに見えます。

動きを付け加えたい場合

例えばプカプカ浮いている風船に、割れるという動きを付け加えたいとします。
その場合、プカプカ浮いているアニメーションと、風船が割れるアニメーションの二つを用意しなければなりません。その場合

『もし風船に物が当たったら、プカプカのアニメーションから割れるアニメーションに移行する』という台本を書けば思い通りの動きになるかと思います。

マリオでも、『Aを押したらジャンプ』の動作になりますよね。この場合のアニメーションも
『Aを押したら、歩くアニメーションからジャンプのアニメーションに変更』という台本が実行されているわけですね！

終わりに

アニメーション編いかがでしたでしょうか？
次回は何を書こうか悩み中です、、

『メイドイン「俺」』についてのサイトはこちらから。

Kumamoto HoloLens ミートアップ vol.3 Dynamics 365 Guides ハンズオンの資料になります。

Microsoft Dynamics 365 Guides の概要に従って始めましょう。
※AzureのアカウントおよびHoloLens 2を事前に準備してください。（ここでは割愛します）

Dynamics 365 Guides 試用版にサインアップ

1．ここからサインアップし、無料トライアルで注文を確定します。

2．注文書が発行されます。続行します。

3．管理センターの画面が表示されれば完了です。

環境セットアップ

ここに従って、環境をセットアップします。

1．先ほどの管理センター画面の右側、新しい管理センターがONになっていることを確認します。

2．左メニューのアクティブなユーザーから製品ライセンスの管理をクリックします。

3．Dynamics 365 Guides Previewにチェックが入っていればOKです。(Dynamics 365 Guides にチェックが必要)

4．Power Platform Admin centerから左の環境をクリックし、Defaultの環境を選択、環境の管理をクリックしてください。

5．自分のデータベースを作成をクリックします。

6．JPYとJapaneseを選んで自分のデータベースを作成をクリックします。

7．こんな感じで表示されていれば完了です。

8．Power Platform Admin centerに戻り、新規をクリックします

9．名前、種類、地域、目的を下記のようにし、次へをクリックします。

10．保存をクリックします。

11．Readyになれば完了です。

12．アップロードファイルサイズを変更します。作成した環境を選び、設定をクリックします。

13．電子メール設定をクリックします。

14．添付ファイルを131072にして保存します。

15．環境に戻り、次はソリューションの管理をクリックします。

16．Dynamics 365 Guidesをインストールします。

17．規約に同意してインストールをクリックします。

18．インストール完了となれば完了です。

19．設定を開きます

20．ユーザーとアクセス許可からユーザーをクリックします。

21．ロールの管理をクリックします。

22．Common Data Service UserとDynamics 365 Guides Authorにチェックを入れ、保存します。

アプリのインストール

Microsoft ストアからDynamics 365 GuidesをPCにインストールしてください。
HoloLens2にはプリインストールされています。（アカウントの問題ですぐ落ちてハマってましたが…）

Guides動かん、まだ対応してなかったかな #HoloLens2 #Dynamics365Guides pic.twitter.com/oylxHHJnM1

— 藤本賢志(ガチ本)@HoloLens2 Ready (@sotongshi) January 14, 2020

ガイドの作成

PC

1．Guidesにサインインして、先ほど作成した環境に入ってください。

2．Example Guide を見てみましょう

3．サンプルのガイドを参考に独自に作ってみてください。

4．アンカーを保存し、印刷しておきましょう。

HoloLens 2

1．Guidesにサインインして、先ほど作成した環境に入ってください。
2．「処理」を選択します。

3．Example Guideを開き、実施します。

4．アンカーをスキャンし、指示に従ってやってみてください。

あとは動画で。

Guides Analytics のセットアップ

Dynamics 365 Guides によって作成されたガイドの分析を参照してください。

ユーザーの追加（オプション）

割愛します。

まとめ

Dynamics 365 Guides の導入を紹介しました。
明日のKumamoto HoloLens ミートアップ vol.3で一緒に新しいガイドを作りましょう。

この記事はリンク情報システムの2020新春アドベントカレンダー Tech Connectのリレー記事です。
engineer.hanzomon のグループメンバによってリレーされます。
（リンク情報システムのFacebookはこちらから）

2020新春アドベントカレンダー Tech Connect インデックスはこちら

はじめに

明けましておめでとうございます。
というには少し遅いですね。
年末年始のんびり寝てたので白紙のページに慄いています。
とりあえずそろそろShader触ってみたいと思っていたので今回はShaderで遊ぼうと思います。

Shaderとは?

名前そのままに影(shade)を描画するためのものです。
表面の色をいじるフラグメントシェーダーや頂点をいじるバーテックスシェーダーなどいくつか種類があります。
また、HLSLやGLSLといった特殊なプログラミング言語を用いて記述します。

Unityでシェーダーを書く

とにもかくにもプロジェクトを作って準備をします。
shaderとmaterialのフォルダを作成してそれぞれにシェーダー(standard surface shader)とマテリアルを作成します。
作成したマテリアルに作成したシェーダーを設定しておきましょう。

まずは円を描きたいのでどちらも名前はcircleにしました。

円を描く

ここから円を描いていきます。
参考はこちら。
参考にしたページではワールド座標を使っていますが今回はUV座標を使うように変更してみます。

struct Input {
    float2 uv_MainTex;
};

void surf (Input IN, inout SurfaceOutputStandard o) {
    float dist = distance( fixed3(0.5,0.5,0), IN.uv_MainTex );
    float radius = 0.1;
    if(  radius < dist ){
        o.Albedo = fixed4(110/255.0, 87/255.0, 139/255.0, 1);
    } else {
        o.Albedo = fixed4(1,1,1,1);
    }
}

UV座標を使うのでInput構造体にuv_MainTexを指定します。
適当に数字を変えてみたところ、UV座標は左上が(1,1)、右下が(0,0)ぽいので中心の(0.5,0.5,0)をdistanceの第一引数にすればOKです。
ということでこんな感じに真ん中を切り取ったような感じに。

でもこれでは円を描いたという感じではないですね。
というわけで少し改良。

void surf (Input IN, inout SurfaceOutputStandard o) {
    float dist = distance( fixed3(0.5,0.5,0), IN.uv_MainTex );
    float radius_in = 0.1;
    float radius_out = 0.11;
    if(  radius_out < dist || radius_in > dist ){
        o.Albedo = fixed4(110/255.0, 87/255.0, 139/255.0, 1);
    } else {
        o.Albedo = fixed4(1,1,1,1);
    }
}

すこしずらして内側も塗ってしまえばいい感じに円ぽくなります。
色は逆にしたほうがよかった気がしてきました。

ところでシェーダーはif文と相性が良くないらしいです。
なにやら並列処理がどうのこうので。
詳しいことはわかりませんがそういうわけでif文を使わずに円を描いてみます。

void surf (Input IN, inout SurfaceOutputStandard o) {
    float dist = distance( fixed3(0.5,0.5,0), IN.uv_MainTex );
    float radius_in = 0.1;
    float radius_out = 0.11;
    o.Albedo = step(radius_out,dist) * fixed4(110/255.0, 87/255.0, 139/255.0, 1)
        + step(dist,radius_out) * step(radius_in, dist) * fixed4(1,1,1,1)
        + step(dist,radius_in) * fixed4(110/255.0, 87/255.0, 139/255.0, 1);
}

ここではstep関数を使っています。
step関数は第一引数が第二引数より大きければ0.0、小さければ1.0を返すので外側、円、内側に項を分けて計算しています。
もっときれいに書けそうですが・・・。

四角を描く

次は四角を描いてみます。
同様にstep関数を使って1辺ずつ描いていって最後に中を白く塗りつぶしています。

void surf (Input IN, inout SurfaceOutputStandard o) {
    float width = 0.1;
    float x = IN.uv_MainTex.x;
    float y = IN.uv_MainTex.y;
    o.Albedo = step(IN.uv_MainTex.x, width) * fixed4(110/255.0, 87/255.0, 139/255.0, 1)
        + step(y, width) * step(width, x) * fixed4(110/255.0, 87/255.0, 139/255.0, 1)
        + step(1 - width, x) * step(width, y) * fixed4(110/255.0, 87/255.0, 139/255.0, 1)
        + step(1 - width, y) * step(width, x) * step(x, 1 - width) * fixed4(110/255.0, 87/255.0, 139/255.0, 1)
        + step(y, 1 - width) * step(width, y) * step(width, x) * step(x, 1 - width) * fixed4(1, 1, 1, 1);
}

絶対もっと楽に描けると思うんですけど・・・・・・。
描画結果はこんな感じになります。

おわりに

頭から煙がでそうなので今回はここまでです。
お絵描きといいながら円と四角を描いただけでしたが・・・。
まぁでも円と四角が描ければ組み合わせで色々と描けるんじゃないでしょうか！

明日は@p3ngu1nさんです。

参考

7日間でマスターするUnityシェーダ入門
【Unity】【シェーダ】シェーダにおいてif文は悪か

---

リンク情報システム株式会社では一緒に働く仲間を随時募集しています！
また、お仕事のご依頼、ビジネスパートナー様も募集しております。お気軽にご連絡ください。