VectorGraphicsを触ってみる

【はじめに】
UnityはSVGファイル（スケーラブル・ベクター・グラフィックス、Scalable Vector Graphics）を使用できる（プレビュー機能）。

◆環境

Unity：Unity 2019.3.2f1
テンプレート：Universal Project Template
 

【詳細】

【Unity道場】VectorGraphicsで作る エモい表現 from UnityTechnologiesJapan

www.slideshare.net

【導入】
スライドの８ページ目の通り

• Vector Graphicsを導入しないと、SVGファイルをD&DしてもUnityで使用できるアセットにならない
• 2020/05/16 執筆時UnityのVectorGraphicsはPreview機能

【スライドのサンプルコードおためし（34ページあたり）】
◆準備

• Sprite用意：Hierarchy 右クリック ＞ 2D > Sprite
• マテリアルを新規作成してアッタチ：（Sprite Renderer の Colorで色を変えるため。ShaderはUnlit/Vectorを選択）

マテリアルのEnable GPU Instancingにチェックを入れると、SpriteRendererのColorの指定がSpriteに反映されます。

 
◆スクリプト
適当なGameObjectにアタッチ

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using Unity.VectorGraphics;

public class BuildSpriteScript : MonoBehaviour
{
    [SerializeField]
    SpriteRenderer spriteRenderer;

    void Update()
    {
        if (Input.GetKeyDown(KeyCode.B))
        {
            BuildSprite();
        }
    }

    public void BuildSprite()
    {
        // ベジェ曲線の情報を詰めるシェイプ定義
        var shape = new Shape();

        // シェイプに円作成に必要な情報を詰める
        var position = Vector2.zero;
        float radius = 100f;
        VectorUtils.MakeCircleShape(shape, position, radius);

        // 円の色を指定する
        shape.Fill = new SolidFill() { Color = Color.white };

        // 円のテッセレーションオプションを決める
        var options = new VectorUtils.TessellationOptions()
        {
            StepDistance = 10f,
            MaxCordDeviation = float.MaxValue,
            MaxTanAngleDeviation = Mathf.PI / 2.0f,
            SamplingStepSize = 0.01f
        };

        // ジオメトリの作成
        var node = new SceneNode()
        {
            Shapes = new List<Shape> { shape }
        };
        var scene = new Scene() { Root = node };
        var geoms = VectorUtils.TessellateScene(scene, options);

        // Sprite の作成と設定
        var sprite = VectorUtils.BuildSprite(
            geoms, 100.0f,
            VectorUtils.Alignment.Center,
            Vector2.zero, 128);
        spriteRenderer.sprite = sprite;

    }
}

 
実行してBキーを押すとスプライトが生成されます。

 

【そのほか】
 自分でSVGを用意してインポートしたなら...
Hierarchy > UI > SVGImageで画面に表示したり、
Canvasを使わないなら Assets > Create > Shader > 2D Renderer > Sprite Lit Graph (Experimental) でシェーダー作って表示させてみたり
など。

VIVE Cosmos セットアップで詰まったところメモ

Vive Cosmos に触れる機会があったのですが、セットアップに結構詰まったので備忘として記載します。

【 詰まり① 】セットアップファイルが入手できない。

公式の案内では、以下サイトからセットアップファイルをダウンロードするよう記載がありました。

https://www.vive.com/jp/setup/

実行すると VIVE PORT のインストールが始まり、終了後にセットアップファイルのダウンロード画面（下画像）が表示されるようなのですが、私の環境では表示されませんでした。

そんな時は、 VIVE PORT からセットアップファイルをダウンロードしましょう。

デバイス設定にVIVE CosmosをPCに繋いでおくと、デバイス設定にVIVE Cosmos用セットアップファイルのダウンロードボタンが表示されます。

繋いでいなくても「設定するデバイスモデルを選択してください」リンクから入手できるようです。

【 詰まり② 】セットアップが進まない。

Cosmos用のセットアップ中にSteamのログインを求められますが、ログインしてもプログレスバーが更新されず、次の設定へ進みませんでした。

私の環境では、上の画面から進みませんでしたが、インストールは完了しているみたいでした。

セットアップの画面を閉じようとすると、アンインストールしますか？と聞かれますが、「いいえ」を選択します。

※「はい」を選択すると、詰まり①のデバイスを設定するボタン押下からやり直しです。

【 詰まり③ 】その後どうすればよいか分からない。

何も指示がありませんでした。PCを再起動します。

再起動後、デスクトップに「VIVE Console」のショートカットが出来ているはずなので起動します。その後、おそらくアップデートを求められるので、アップデートします。

アップデート完了後、「VIVE Console」の画面左上の三本線の設定ボタンから「ルーム設定」を選択しプレイ環境を整えます。

【最後に】

セットアップがスムーズにいくか、いかないかはPCの環境によって変わるようです。

私も別のPCで試したら割とスムーズにセットアップが完了しました。

チョコレート検定 2019（プロフェッショナル）を受験しました。

チョコレート検定とは

以下ページに記載の通り、明治グループ100周年と、明治ミルクチョコレート90周年を記念して2016年から開催されています。2919年9月16日は第4回目ですね。

https://www.kentei-uketsuke.com/chocolate/about/

合格すると（2018年の検定では）名刺やピンバッチを作ることができます（有料）。

（（記念に作っておけばよかった。。））

難易度は以下３つ

【初級レベル】 チョコレートスペシャリスト

【中級レベル】 チョコレートエキスパート

【上級レベル】 チョコレートプロフェッショナル

2018年までは中級レベルまででしたが、今年から上級レベルが追加されました。

上級レベルではテイスティングの試験がある都合なのか、会場が東京（300人）、大阪（100人）の会場と人数に制限がありました。

▽今回は私が受験した上級について書いていきます。==============================================

上級のレベルは以下のように書かれていました。

https://www.kentei-uketsuke.com/sys/chocolate/entry

【チョコレートプロフェッショナル（上級）】
カカオやチョコレートに関する幅広く、専門的な知識を持ち、自らチョコレート文化を世の中に発信できるチョコレート好きの頂点を目指す方向けの上級レベル。

上級の試験についてざっと書くと以下のような感じになります。

①問題数100問のマークシート方式（４択）

②出題範囲は、公式テキストおよび、公式テキスト末尾記載の参考文献などから幅広く出題。

③テイスティングの問題あり

④正答率８０％以上で合格

試験時間はどの難易度も１時間で、受験資格は「チョコレート好きならどなたでも」とあります。なので上級の受験に中級取得している必要はないようです。

上級レベルの試験の実施自体が2019年からなので、気になるのが②、③です。

②参考文献とあります。どの参考文献をどれくらい勉強すべきなのか謎です。

③事前にテイスティング練習用のチョコが送られてくるものの、出題形式がわかりません。どんな準備をすればいいのか謎です。

▽実際に受験して、この準備しておけばよかったなぁ～と思ったこと。（過去の自分へ向けて）

==============================================

 〇WEBの練習問題はそのまんま出てきました。覚えましょう。

https://www.kentei-uketsuke.com/sys/chocolate/practice_guide

〇公式テキストの内容はどこから出題されてもおかしくありません。まんべんなく覚えましょう。

〇テイスティングは以下の形式でした。

カップに入ったチョコが４つ（A、B、C、D）配られる。

それぞれのチョコ１つにつき３問。計１２問がテイスティングの問題数。

１問目

そのチョコレートの風味を表すレーダーチャートはどれか。（４択）

ナッツ香、花香など度合が記載されているチャートから選びます。

２問目

その風味を説明した表現として適切と思われるのは次のうちどれか。（４択）

ミルク感があり～、フローラルな香り～ 、と表現される文章から選びます。

３問目

そのチョコレートの産地は次のうちどれか。（４択）

こんな感じで１２問あります。

事前にテイスティング練習用のチョコレートも送られてくるので頑張って味を覚えましょう。ちなみに産地の情報はWEBページに記載があるので目を通しておきましょう。

https://www.meiji.co.jp/sweets/chocolate/the-chocolate/lineup/

もっとテイスティングの練習しとけ～産地やミルク感もちゃんと覚えとけ～（過去の自分へ）

〇参考文献は公式テキストに載ってない内容で、比較的簡単なものを覚える（？？？）。

そもそもでテキストに記載のある参考文献の数が27あり、どれに目を通せばよいのか。。。（泣）

という問題は置いておいて、私が購入した本を載せておきます。

●チョコレートの世界史―近代ヨーロッパが磨き上げた褐色の宝石 (中公新書)

https://www.amazon.co.jp/dp/412102088X

カカオ視点で書かれた世界史です。カカオを通してどのようにヨーロッパが発展してきたかをざっくり学べます。奴隷の話も出てきたりと少し重たい本。

読んだ後、「世界はチョコレートを中心に回ってたんだ～」など良くわからない感想を抱いてしまいました。pease-time.

●チョコレート カカオの知識と製造技術

https://www.amazon.co.jp/gp/product/4782104049/

タイトルの通り、科学的にみたチョコレートの性質、製造技術や機械について書かれています。難しい本です。

この本に書かれている難しい内容は試験に出題されませんでしが、読んですぐ理解できる内容（同様の内容は他の参考文献にも記載されている気がする）は出題されていました。

ex)カカオの木の虫や病気

また、チョコレート作りってとても大変なんだなぁ～とか、どうやって作っているのだろうなど、お店に並ぶチョコレートを見るたびに思うようになります。

私が読んだのは上記の2冊でしたが、試験では自分が読んでない本からも出題されていました。

また、どちらの本も内容が濃く覚えきれません。。。（泣）

▽最後に

==============================================

検定、難しかったです。

もちろんすべての問題が難しかったというわけではなく、秒で解けた問題もありました。

どちらかというと、今回が上級レベル初の実施で、どのように試験対策をすればいいか分からないという要素が大きかったです。

チョコレートのように甘くない。

試験の結果はおそらく不合格ですが、今回の検定を通してチョコレートへの知識をさらに深めることができました。そのことが、私にとってとても喜ばしいことです。

やっぱり、おいしいチョコレートへの理解を深めることは楽しいですからね。

また来年チャレンジしようと思います。

~~~~~~~~

今回、公式テキストを電子書籍で購入して、暗記マスターというiOSアプリで学習していました。これはいいものだ！

探せば他にも同様のアプリがいくつか出てくるので今後もこういったものを活用していきたいですね。

コミティア129に参加しました。

〇参加のきっかけ

以前コミティア126に参加していましたが、

お酒の日に「次いつ出すの？」と知り合いに言われ、気づいたら申し込んでいました。

お酒って怖い。

コミティア129では、応募数が上限を下回ったそうで、申し込み時の記載に不備がなけらば、基本的にみんな当選したみたいです。

そういえば、サークル参加申し込み時にどんなジャンルのものを出すかを記載する場所がありますが、毎回どれにも該当しない気がして消去法で「青年」を選んでいます。青年要素皆無ですが。。。

今回参加させて頂いた際に、見本誌コーナーに立ち寄ったのですが、「青年」枠といっても内容は結構幅広かった気がしたので、困ったら「青年」にしとけばよいのでは？感が自分の中で大きくなっています。

〇原稿作業

毎回、テーマを決めて描きます。

（でないと、描いている内容がブレる気がしていて。。。）

前回参加したコミティア126では、

「仕事のできない部下は上司を殺す」、「無自覚に人を攻撃する」

でした。まさに私そのものです。

今回参加したコミティア129では、

「ないものねだり」

がテーマでした。まさに私その(ry...

が、話を考えているうちに考えが4転くらいして

最終的にまとまりがないものになってしまいました。反省。

〇作成期間

どんな話にしようかなと考えていて、とりあえず決まったのが8月4日でした。

（開催3週間前です。ハリー！ハリー！）

最初は文章でストーリー（場面や、セリフ）を書き起こしました。

いきなりネームを描きに原稿と向き合うのは、コマ割り考えながら出つらいなと。

16Pのものを描く予定だったのでそれを気にしつつ、ページ数を仮で割り振っています。（最終的にページ余りましたが。。。）

だいたいのストーリーが決まったらネームを描きます。

CLIP STUDIO PAINT を使いました。

ネームもっとうまくなりたい。

次は下書きです。

この段階で、コマ割り、フキダシ、セリフを入れました。

後々にペン入れレイヤーを作ってキャラクターを描いていくのですが、

その前にコマやセリフの枠線がはっきり見えていた方が自分としてはやりやすいなー

と思ったためです。（後で調整もしますし、人によりけり）

私は遅筆のため、ペンが全然すすまず下書きはティア開催の2日前に終わりました。

（おかげで、「飲み会や、電車の中で下書きを描く」スキルの習熟度が上がりました。）

進捗はカメでしたが、技術的に棒人間に毛の生えた絵しかかけないので、なんら問題ありません。間に合わないと思っても棒人間を描くだけです。

とはいえ内容は拘っていきたいので、時間の許す限りペン入れしていきます。

～今回の目標 ～

今まで自宅かコンビニでしか印刷していなかったので、 今回はキンコーズで印刷しようとしました。

なので、自分の中ではキンコーズで印刷できれば、実は今回の参加ではどんな本でもOKということにしていましたが、開催前日に持ち込むも、営業時間を勘違いしていてキンコーズで印刷できませんでした。

結局コンビニで印刷しました。。。30部作りました。

〇イベント当日

 本は無料配布で、5冊手にとって頂けました。ありがとうございました。

〇今回学んだことや感想

・CLIP STUDIO PAINT でコマ割りフォルダーというものがあることを知りました。

（これを前回知っていれば。。。！）

・CLIP STUDIO PAINT には有料（￥500円）でPDF出力する機能があったのですが、

これがとても便利でした。PDFで用意するとコンビニ印刷するときも、本になるように自動でページ順を並べてくれます。神機能です。（これを前回(ry　）

・印刷所の営業時間は平日と休日で 違うことがあるので、ちゃんと確認しような！

〇次回

コミティア130が、11/24(日)なのですがCG-ARTS検定と被っているので、別の機会に参加しようと思います。