読者です 読者をやめる 読者になる 読者になる

トマシープが学ぶ

Mac/Unity/AR好きのミーハー初心者

睡眠導入系音アプリTaoMixとMelodest紹介

TaoMix

環境音を自分好みに組み合わせられるアプリ

play.google.com

使い方は、画面の下の3本線から+ボタンで追加したいサウンドを選びます。ノイズなどもあります。

f:id:bibinbaleo:20170523172303p:plainf:id:bibinbaleo:20170523172234p:plain

無料版では3つまで追加できるようです。

真ん中の丸に近づくほど音が大きくなります。

f:id:bibinbaleo:20170523172226p:plain

音のアイコンをクリックするとアイコンの色を変えることや、音を消す・または変更することができます。

f:id:bibinbaleo:20170523172240p:plain

また長押しするとその音自体の大きさも変えられます。

f:id:bibinbaleo:20170523172246p:plain

真ん中の丸は移動することができます。また長押しでドラッグし離すと、ブロック崩しの玉のように飛び回ります。いろんな音の大きさが変化するのです。

f:id:bibinbaleo:20170523172251p:plain f:id:bibinbaleo:20170523172316p:plain

作った環境音は名前をつけて保存できます。またタイマーで音が消える時間を設定できます。睡眠導入用にもってこいですね。画面を消していても音はちゃんとなってくれますし。

f:id:bibinbaleo:20170523172303p:plainf:id:bibinbaleo:20170523172257p:plain

また、f:id:bibinbaleo:20170523182126p:plainのマークでランダムに環境音を作成してくれます。すごい!

i.meet-i.com

Melodist

Melodist -写真を美しいメロディに変える

Melodist -写真を美しいメロディに変える

  • Sonar Multimedia
  • ミュージック
  • 無料

画像から音を作ってくれるアプリ。単調で落ち着いた曲が多い気がする。眠りやすい曲を作っているのかな?iosのみ

f:id:bibinbaleo:20170523194208p:plain

音は無料版なら2種類。

f:id:bibinbaleo:20170523194201p:plain

書き出しもできる。

f:id:bibinbaleo:20170523194217p:plain

こちらもタイマーがある

f:id:bibinbaleo:20170523195341p:plain

 

hajihaji-lemon.com

Cinema4Dでモデルに髪を生やして、ポーズを変える。

Autodesk Character Generatorで作ったモデルにCinema4Dで髪を生やしてみました。 

bibinbaleo.hatenablog.com

今回は貞子を作ります。モデルはハゲにしておきました。初心者な上に、ろくに解説も読まずに手探りでやっているので、あまり参考にしないでください。

f:id:bibinbaleo:20170521192017p:plain

髪をはやす

髪を生やしたい部分を選択ツールで選択します。

そしてシミュレート>ヘアオブジェクト>ヘアを追加で髪が生えます。

 

ヘアツール>ブラシで髪を撫でると動きます。初期設定では髪の先端しか動かすポイントがないので、場合によってはヘアモード>ポイントを選ぶと髪一本につき4つぐらいのポイントが出てくるので細かく髪を移動できます。

f:id:bibinbaleo:20170521192230p:plain

ブラシの大きさも変えることができます。ただこの画面が出なくなるときはどうしたらいいのだ?ショートカット+コロコロでも変えられたのですがどうやったか忘れました。

f:id:bibinbaleo:20170521192009p:plain

またポイントたくさんの状態でツールのカットを使うと髪を切ることができました。ただ長さはあとで紹介するパラメーターで変えられます。

f:id:bibinbaleo:20170521193455p:plain

他にもいろんなツールがあってなんとなく変化します。思ったように扱うのは難しかったです。

レンダリング

ビューをレンダリングで今見ているビューをレンダリングしてくれます。

f:id:bibinbaleo:20170521192439p:plain

思った以上に髪が太いし量も生えています。顔見えないし

髪の調整

髪の太さや長さはヘアを選択した状態で、ガイドやヘアのパラメーターで変えられるようです。

ガイド>根元>長さで長さを変えられます。

f:id:bibinbaleo:20170521193749p:plain

またヘア>セグメントで何かが変わっている気がする

f:id:bibinbaleo:20170521194126p:plain

左が1で右が9

f:id:bibinbaleo:20170521194319p:plainf:id:bibinbaleo:20170521194304p:plain

ヘアのクローンで数が増えます。太さも調節できますね。1にしただけでかなり増えます。多分2倍になってるってことですよね。

f:id:bibinbaleo:20170521194935p:plain

f:id:bibinbaleo:20170521195020p:plain

髪の動き

ちなみにモデルを傾けた状態で再生ボタンを押したら髪が動きました。一時停止してレンダリングしたらその通りの髪が表示されます。

髪すごい貫通しますね。

f:id:bibinbaleo:20170521200220p:plain

ダイナミクスの剛体にチェックを入れたら垂れなくなります。この状態でセットすればいいのかな?

f:id:bibinbaleo:20170521200215p:plain

 

ポーズを変える

ポーズを変えるにはボーンを選択して回転させないといけません。でもそのままではボーンを選択できません。周りの肉が邪魔している。なので選択>選択フィルタ>ポリゴンのチェックを外します。

ポリゴンの選択を不可にする C4D User

 そうするとボーンを選択できました。その前に全身の親を選択して横向きにしておきました。

f:id:bibinbaleo:20170521192115p:plain

邪魔なものはばつ印にして非表示にします。

f:id:bibinbaleo:20170521195326p:plain

そして腕などを動かしたものがこちら

f:id:bibinbaleo:20170521195329p:plain

ちなみに足を動かしたらスカートもちゃんと伸びてくれました。すっごーい

f:id:bibinbaleo:20170521200323p:plain

一応の完成品がこちら。

f:id:bibinbaleo:20170521211400p:plain

Unityに入れてみる

f:id:bibinbaleo:20170521201751p:plain

fbxで書き出したのですが、ヘアは含まれてませんでした・・・あーあ

結局昔ポリゴンで作った髪をあてはめました。

f:id:bibinbaleo:20170521214823p:plain

cinema4dは情報が少ないので素人が一人でやるには難しいですね。

参考

makototamura.com

maxon.blog.shinobi.jp

webで使えるイラレみたいなソフト「Gravit」使ってみた

twitterで流れて来たwebで使えるイラレみたいなベクタツールを使ってみました。

新規作成

https://gravit.io

アカウントを作りログインすると、空っぽのダッシュボードに出ます。

左上からCREATE DESIGNで作りはじめます。

f:id:bibinbaleo:20170518173855p:plain

キャンバスの大きさを選べます。twitterのカバーとかの大きさもデフォルトで入っているのでヘッダー系を作るには良さげですね。もちろん自分で自由に大きさを変えることもできます。

f:id:bibinbaleo:20170518173727p:plain

私ははてなブログアイキャッチ画像を作ろうと思い1500*1051で作りました。

さてデザイン画面はこんな感じです。

f:id:bibinbaleo:20170518173718p:plain

キャンバスのアップはイラレとナジようにalt+コロコロで変えられました。基本的にイラレと同じショートカットっぽい。

レイヤー

がっつり作るなら最初に右上にあるLAYERSボタンを押してレイヤーを作ったほうがいいかも。

レイヤー画面比左端に出ます。フォルダを作ってそこに入れていく感じかな?

f:id:bibinbaleo:20170518174610p:plain

パスひとつひとつが表示されます。

テキスト

色々選べます。ほんと下が見えないぐらいいっぱいあります。

f:id:bibinbaleo:20170518173723p:plain

でも日本語は無理っぽい。コピペでも表示されませんでした。

f:id:bibinbaleo:20170518185432p:plain

文字の大きさは入力からじゃないと変更できないのか?

f:id:bibinbaleo:20170518190409p:plain

図形

四角とか線とかフリーハンドとか色々あります。

f:id:bibinbaleo:20170518173711p:plain

f:id:bibinbaleo:20170518173715p:plain

f:id:bibinbaleo:20170518173701p:plain

画像

画像はドラッグで読み込めます。またメニューからアップロードすることでも配置できるようです。

f:id:bibinbaleo:20170518190845p:plain

Iconではベクタのイラストが選べます。謎に忍者とかいる

f:id:bibinbaleo:20170518191002p:plain

アイコンはパーツごとに選択したり色を変えたりできます。

f:id:bibinbaleo:20170518191138p:plain

画像をダブルクリックしたら角を丸めて、なおかつマスクみたいなこともできた。

f:id:bibinbaleo:20170518191358p:plain

その他

イラレで見たことがある切り抜きとか

f:id:bibinbaleo:20170518173658p:plain

図形の変形

f:id:bibinbaleo:20170518191848p:plain

キャンバスの背景や大きさの変更も簡単にできます

f:id:bibinbaleo:20170518191913p:plain

書き出し

保存はCtrl+Sでできます!

それとは別に完成したら書き出しも行いましょう

f:id:bibinbaleo:20170518192908p:plain

フォーマットはpng,jpeg,svg,pdfの4つ。

f:id:bibinbaleo:20170518193241p:plain

Selectionは選んだオブジェクトだけ書き出す機能。

Asstsは同じ画像をいろんなサイズで書き出せるUI作成向けの機能だと思われる。オブジェクトを選んで、右下のMAKE EXPORTABLEを押して+ボタンを押したらその部分だけ書き出せる。

f:id:bibinbaleo:20170518194120p:plain

f:id:bibinbaleo:20170518194238p:plain

これをダウンロードしたらzipになっており、違う大きさのが入っていました。

f:id:bibinbaleo:20170518194518p:plain

UI作成のソフトで見たことがあるやつ。スマホとか画面サイズが違うからいろんな大きさで書き出すんでしょ?使ったことないからわからないが。

アカウント

Gravitは一人で作るだけでなく、誰かと一緒に作業したり、SNSのように世界中の人と繋がったりできる側面があるようです。

ホーム画面で自分が作ったものが表示されます。

f:id:bibinbaleo:20170518200012p:plain

画像を右クリックすると色々できます。Make publicにすると世界中の人が見れるようになります。多分

f:id:bibinbaleo:20170518200044p:plain

shareではユーザー名からシェアする人を選べるみたいです。編集できるかどうかも選べる。

f:id:bibinbaleo:20170518200812p:plain

チームも作れます。どうやって招待するかはよくわかってませんが、チームで作業できるみたいですね。

f:id:bibinbaleo:20170518195732p:plain

左下のdiscoverから世界中の人の作品やユーザー、チームが観れます。

f:id:bibinbaleo:20170518200419p:plain

いいねをしたり、コメントしたり、シェアしたりできます。webならではってとこでしょうか。

 最後に

 できたのがこちら

f:id:bibinbaleo:20170518195144p:plain

グラデーションも使いやすいし、フォントもいっぱいあって楽しかった。サクサク動くしいいですね!ただ日本語入力できないのが辛いですが

プログラミング用テキストエディタmiとsublime【Mac】

コードを書くときに便利なテキストエディタ紹介。標準のテキストエディットでもコードはかけるが色分けなどがあったほうが使いやすい。

本当はまとめようかと思ったけど、すごく良い記事がすでにあったので、持っているmiとsublimeだけ紹介。気が向いたり周りの人が使っているのを見たら追記で紹介していきます。

eng-entrance.com

ほんと色々なのがあるんだな〜Adobeが作っているBracketsは色がエディタで選べるのいいね。はてなブログのデザインアレンジとかこれでやってもいいかも

mi

先生にオススメされて入れた最初のテキストエディタ

mi - テキストエディタ

f:id:bibinbaleo:20170516190819p:plain

デフォルトが日本語で、インターフェースが白なのがいいですね!でも色分けがされないことが多々ある。

sublime

大学の先生が使ってたので入れてみた。

www.sublimetext.com

f:id:bibinbaleo:20170516191931p:plain

すぐに色分けしてくれる。上のmiと同じファイルを開いてこの違い。しかもなんの言語か右下に表示される。でもデフォルトが黒いので嫌だ。多分変えられるのだろうけど、英語でよくわかんないや。

ドラッグで開ける(共通)

今日知ったのですが、ファイルを画面にドラッグしたら開けるんですよ!びっくり!

f:id:bibinbaleo:20170516192108p:plain

ちなみにデフォルトのテキストエディットでやったらファイルの場所名が表示されました。ターミナルでも同じように場所が表示されます。

おまけ:paiza.IO

web上でコードを書いて実行までできるサービス。色分けもしてくれる。

Web-based online coding environment | paiza.IO

f:id:bibinbaleo:20170516192749p:plain

対応してる言語も多いし本当にすごいよね!

f:id:bibinbaleo:20170516192859p:plain

最後に

滅多にコード書かないのであんまり熱意を持って紹介できませんでした。色分けしてくれるかどうかぐらいしか使いやすさを実感するとこがない。

xcodeとかpycharmみたいな統合開発環境でやることも多いのですしね。何が違うんだろう。

100記事越え記念!ヘッダーとアイキャッチ画像を変更

祝100記事!

最近記事数が100記事になりました!おめでたい!

始めた当初はこんなハイペースで更新するつもりは全くなかったけど、興味あることが増えすぎて、色々なサービスなどを記事にしてたらあっという間でした。まだ1年経ってないのに。

ヘッダー変更

別にその記念ではないのですが、たまたま自分と同じブログデザインを使っている人のブログを見つけ、少し差別化したいなと思ってヘッダー画像を自作のものに変えました。

f:id:bibinbaleo:20170516181823p:plain

詳しくは別の記事に書いてますが、イラレフォントワークスの素敵なフォント(キアロとつばめフォント)を使いました。

bibinbaleo.hatenablog.com

ちなみにスマホで見たらめっちゃ拡大されていて変だったので、また別に調整しました。滅多にスマホで見ないから早めに気づけてよかった。

 アイキャッチ(サムネ)画像

ブログのサムネ画像って変えられるんですね。何もいじってなかったので、記事内の最初の画像が表示されていて、たまにかっこ悪いのもあったのですが、ググったら設定から変えられるらしいので変えました。

f:id:bibinbaleo:20170516182557p:plain

記事の編集画面を開いて、歯車マークからアイキャッチ画像を選ぶところがありました。過去の記事をいじるときは更新マークを押さないと画像がすべて表示されないようです。

f:id:bibinbaleo:20170516182603p:plain

ただ、これから100記事遡って変えるのは大変なので、これから頑張ります。

また記事内に画像がないときなどにデフォルトのアイキャッチ画像がありますが、それもブログの詳細設定から変えることができますよね。

f:id:bibinbaleo:20170516183435p:plainこれがデフォルト

f:id:bibinbaleo:20170516183217p:plainあんまりいいのが思いつかないしデフォルトのデザインが悪くないので、何も設定してないのですがそのうち考えたいですね。

help.hatenablog.com

追記:作りました!

f:id:bibinbaleo:20170519203529p:plain

サイドバーにモジュール追加

これも最近知ったのですが、サイドバーに注目記事を乗せることができたんですね!スマホ版ではデフォルトで載ってるけど、PC版はないのかなとかプロだけなのかなって勝手に思ってたら普通にあったわ!

デザインのサイドバーから「モジュールを追加」

f:id:bibinbaleo:20170516184002p:plain

その左側に普通にありました。

f:id:bibinbaleo:20170516183817p:plain

ただ注目記事って最近のアクセスか、はてブの数とかでしか並び替えれないみたいであんまり意味ないのでやめました。ここ数週間の閲覧数順とかならよかったんだけど。

以上!

Viveのカメラ機能できた&Editor VRやってみた

Viveのカメラ機能

HTC Viveにはカメラが付いており、HMDを被っている時にコントローラーから現実の風景を表示することができます。

indiegame-japan.com

SteamVRの

設定から「カメラ」を選択し、「カメラを有効にする」と「カメラのルームビューを許可(システムボタンをダブルクリック)」のチェックボックスをオンにする

そしてコントローラーのシステムボタンをダブルクリックしたら青っぽい粗い現実空間の映像が拡大されて表示されます。

最初USBがダメですみたいなのが出て表示できなかったのですが、パソコンのUSBハブをUSB3.0 に変えたりしたら表示できました。

ただパソコンの画面を見るには荒すぎるので、人の存在状況やペットボトルなどの場所を知る程度にしか利用できないかな?

Editor VR

HMDをつけながらゲームの制作作業ができる「Editor VR」という機能付きのUnityが試験的に提供しているようです!すっごーい。

ソフトごと新しくダウンロードしないといけないようなので、少しめんどくさいけどそのうちやってみます。

f:id:bibinbaleo:20170524173313p:plain

インストー

下のドキュメントのDownloading EditorVR (EVR)からUnityVR本体unitypackageをダウンロードします。

docs.google.com

EditorVRを新しいフォルダにインストールし、起動し、既存のViveプロジェクト(どうなってもいいやつ)を開き、上書きされるのを待ち、開いたら、unitypackageを追加。applyを押したら利用できます。


利用にはWindows > EditorVRを選択するか、Ctrl+Eを押します。この状態でHMDをかぶるとScene内にVRで入ってました。

パソコン画面のチェックボタンを押すとパソコンにも見てる画面が表示されるので他の人とこんな感じだよって共有できます。

あと最初CameraRigを拡大していたのですが、その状態だとメニュー画面が拡大しすぎて文字が見えなかったので、元の大きさに戻しました。

この記事を参考にやりました。 

framesynthesis.jp

操作

操作はよくわかってませんが確認できた部分だけ。詳しくは英語でさっきのページに書いてあるそうです。

docs.google.com

移動

片方のコントローラーのコロコロ部分でxz移動。片方でy移動と見渡しができます。

メニュー

コントローラーの下にあるUnityマークを片方のポインターで押したら直方体のメニューが出ます。

f:id:bibinbaleo:20170524164056p:plain

またコントローラーのコロコロを見ると丸いメニューのインターフェースが出ています。その中にInspectorがありました。

f:id:bibinbaleo:20170524162748p:plain

数字も入力できるようです。やり方がよくわかんなかったけど。

チェック外すとかはできました。

オブジェクト選択

肝心のオブジェクトを移動させるやり方はよくわからなかった(ドキュエント読め)

ただポインターでそっちに向けて何かしらのボタンをクリックしたら選択できた気がします。

 

HTC Vive用Steamゲーム紹介【無料】

 前回も有名どころを少しだけ紹介しましたが、また新しくプレイしたものを紹介して行きます。

bibinbaleo.hatenablog.com

無料のやつです。有料のもやりたいけどお金が・・・・

随時このページを更新して行きます。あと重くてプレイできなかったものもありますが、それも一応紹介します。

できたもの

Allumette

store.steampowered.com

マッチ売りの少女のような童話が3Dで見れます。

ネタバレになるけど人が死んで悲しいので悲しいのが嫌いな人は見ないほうがいいかも・・・

私は悲しくて途中で見るのをやめました。

www.moguravr.com

あと見る方向によって重くて画面がチカチカしました。パソコンのスペックが足りていないらしいです。

indiegame-japan.com

この記事を見て、フレームレートを表示しながら体験していたのですが、登場人物がいない方向は良好なのですが、動いている人がいる方向を見ると赤くなります。

NEKOPALIVE 

store.steampowered.com

2つのライブが見れます。インタラクティブ性はなく見るだけですね。固定位置から見るだけだったのであまり躍動感はなかった。

好きなキャラだったら楽しいのかな?

panora.tokyo

SURGE

store.steampowered.com

ミュージックビデオです。綺麗な抽象世界がリズムに合わせて変化していく、気軽に見れるいい作品でした。3分ぐらい?これもインタラクティブ性はなく見るだけで、メニューも視線だけで選べます。

singularity-cafe.com

昔からあるんですね。

INVASION!

store.steampowered.com

かわいいうさぎと宇宙人みたいなやつの短いストーリー。

見るだけだけど何も考えなくていいのがいい。こわくないし。

www.moguravr.com

Accounting

store.steampowered.com

仕事体験と聞いて、やりたくなかったけど、実際やってみたら何すればいいか全然わからなくて、周りの触れるものを触るだけだった。棚を開けたり、あとコントローラーを下向きにすると振動した。振動初めて。

移動できる環境じゃないとだめかも。ポインター移動ができなかった。あと英語がわからんと電話で何言ってるかわからない。

www.moguravr.com

Belko VR: An Escape Room Experiment

store.steampowered.com

脱出ゲーム!2Dの脱出ゲームは良くやってたけど、VRでも雰囲気は同じですね。ほとんどのものを触れるのが楽しいです。ただ英語がわからないのとほんと身動きとれない環境でプレイしてるので、思うように操作ができなかったので全く謎は解けてません。

ポインターがあるので歩けなくてもいいけど、床のものを拾えるぐらいの環境でやったほうがいいです。

プレイできなかったもの

多分パソコンのスペック的な問題でできなかったやつ。

Trials on Tatooine on Steam

store.steampowered.com

スターウォーズの世界を体験できるミニコンテンツ

きれいだったけど重くて途中で挫折。

体験記事見たら楽しそうでいいな〜ライトセーバーも振り回せるのか・・・

oriver.style

Rec Room

store.steampowered.com

つながらなかった。対戦でスポーツゲームができるらしい

weekly.ascii.jp

Freedom Locomotion VR

store.steampowered.com

新たな移動手段の提案VR?

最初に身長とか部屋の歩ける範囲とかをキャリブレーションする。私の環境は一歩も歩けないのでめんどくさくてスキップした。

歩くスペースに行ったけど、そこで重くなって断念。

bank.vrinside.jp

BlueShift

store.steampowered.com

ずっと起動準備をしています状態で、始まらない。

空を飛べるらしいのでやりたかったけどまた今度かな?

bank.vrinside.jp

Hop Step Sing! High Quality Edition

まだ公開されてなかった・・・

store.steampowered.com

ゲーム検索の仕方 

VRで遊べる無料ゲームの探し方です。

Steamに行きます

http://store.steampowered.com/

左側のカテゴリからバーチャルリアリティを選択

f:id:bibinbaleo:20170504181629p:plain

ページの下の方にいろいろなお勧めが表示されていますが、その一番下にある「全ての新作を表示」を選択

f:id:bibinbaleo:20170504181626p:plain

並べ替えで価格の安い順にしたら、無料のが表示されます。

f:id:bibinbaleo:20170504181628p:plain

また右側でいろいろな絞込みができます。日本語対応ありのとかも選択できます。

f:id:bibinbaleo:20170504181627p:plain

 このサイトもレビュー記事がたくさんありました。

bank.vrinside.jp