Blenderで歯車を作る

自分用のメモです。
正しくない方法かもしれませんのでご注意ください。
円を作ります。頂点選択の状態がいいと思います。

1/4のサイズにします。ループさせたときにぴったりになる割合であればどれでも大丈夫です。

幅を増やします。e + sキーでやりました。

とがっている個所にしたい場所を選択します。

原点に置いた3Dカーソルをピボットの選択にして、e+sで伸ばします。

ピボットをそれぞれの原点にしてsキーで拡縮していい感じの太さにします。

エンプティを作ります。

歯車のほうを選択して、配列複製で下の画像のようにします。

エンプティと歯車のトランスフォームでのサイズが違うと変な感じになりますので、サイズを同じにするとしっかりと重なってくれます。


歯車の形の完成です。これに厚みを持たせたりします。

サイト運営していて思うこと

自分は最初は勉強のためにサイトを立ち上げて素材配布を最初は行っていたのですが、そこで思ったことを書いていこうと思います。

WEBプログラミングやWEBデザイン初心者の方で、これからサイトを持とうと思っている方の参考にもなれたらと思います。

まず、思うのはWEBプログラミング的なことなら特にそうだと思うのですが、実戦でしか学べないことがあるように思います。
学校にいれば、こういうことをやってきてな的な内容も多いと感じますが、自分で作るのであればDB設計から、サイト構成、サイトデザイン、セキュリティまで一人でやらないといけません。
それにどうやって人を呼び込むのか? どうやってサイトの機能を増やしくいくか? というようなことも、実際にやらないと本当のところはわからないのではないかと思います。
もちろん、人それぞれな面は多いと思うのですが、少なくとも僕はそう感じました。

例えば、一番わかり易いのはセキュリティだと思うのですが、実際に完璧なセキュリティ状態というのは初心者ではかなり難しいと思いますし、どうしても脆弱性は生じるものだと思います。
変な話ですが、早い時期から脆弱性を作ってしまい、慌ててそれを塞ぐという経験をしてみるというのもありではないでしょうか?
もちろん、脆弱性は無い方が絶対にいいと思いますが、初心者は絶対に作ると言えると思います。
セキュリティについて知らずに、気にせずに過ごしてしまうよりは、自分で立ち上げたサイトで(もちろん、人に迷惑をかけないようにすることがとても大事だと感じますが)、脆弱性を塞ぐということが、個人のセキュリティ対策力を向上させることにもなるのかなと思います。
もし先生がいるのであれば、その方に聞いて大丈夫かを確認するのも大事と感じますが、結局は自分のコードは自分で管理しなければいけない以上、自分が理解しなければ何もできないと感じます。

次に僕に限定した話になってしまうかもしれませんが、インターネット特有の情報の広がりの速さや、自分の作ったもので何かが起きていくとう経験も楽しいと感じました。
僕は3DCGモデルを配布していますので、それを動画サイトなどで使用してくださったものを見るのですが、最初は5日位に1個使用してくださった動画が投稿されるかされないかくらいだったのですが、今では1日に3~6件程度使用してくださった動画の報告が来ており、現在、累計ではニコニコ動画だけでも1400件程度の報告があります。それは、僕にとってもは非常に奇妙というか、自分という素人の3DCGモデラーが作ったものがこんなにも多くの方に使用されるということが、不思議なように思います。自分が作ったものが他の人の手に渡り、それが次のクリエイティビティにつながるということは、インターネットらしいと感じました。
また、その中で、こんな機能あったら良いなと思うことも多く感じました。
3DCGがそもそも専門分野であり、WEBアプリケーションの少ない分野であることも大きいと感じますが、まだまだ開拓の余地のある分野だとも感じますし、運営していく中でこうだったらいいなとか、こういうものがあったら良かったのに・・ということも多く感じることが出来ると思いますし、現実離れした計画ではなく、こういうものにこれだけのコストがかかり、こういうものにはセキュリティ的に難易度がこれくらいあるという計算がしっかりできた上での考えを作ることが出来るという面も、大事だと感じます。

また、自分はこういうものを作っているということは、ある意味では自分の実力の証明でもあると感じます。
今までこういうことをやってきた、ということは、今後はミニマムでもそれくらいは出来るだろうという目処が立つということでもあると思いますし、これができるからというのはとってもわかりやすいと思うので大事と感じます。
デザイナーになりたいなら、自分のデザインを自分で証明しなきゃ話にならないと思いますし、WEBプログラミングで仕事したいなら自分になにが出来るのか証明しなきゃわかりっこないのではないかとも思います。
とはいえ、僕自身そこまでプログラミングやデザインが得意というわけでもありませんから、偉そうなことは言えないのですが、とにかく作って証明することは大事なのかなと思っています。それは僕自身へのメッセージと言うか、指針のようにも思います。
今まで全く実績のない人に頼むのは、勇気がいると思うのですが、これやったことあります、こういうことやりましたというのはわかりやすいと感じますし、まずはそれがあってからという入り口のようにも思います。

プログラミングでもデザインでも毎日触り続ける、触るモチベーションが大事だと思うのですが、自分のサイトを運営することは、そのモチベーションの原動力になるように思います。
これをもっとこうしたい、もっとしっかりと作りたいという、これじゃ恥ずかしいという感じで続けられる気がします(もちろん、個人差あると思いますが・・)。

結論ですが、僕が思うサイト運営のメリットは、失敗して学べること、オープンな世界であって実戦であることを肌で感じられることであると思います。

Blenderをweb関係の人(デザイナー、プログラマー)が使うメリットを考えてみる

Blenderのいいところはもちろん無料であることだと思っています。
僕自身は3dsMaxやMAYAのようなプロが普段使っているようなソフトを使ったことは無いのですが、Blenderを使用して1年位経ちますのでBlenderを使うといいことを考えてみたいと思います。

僕はweb関係のプログラミングやデザインも勉強しているのですが、webプログラミングではあまりCGソフトというものは役に立たないかもしれませんが、トップページや動画制作も踏まえてプロモーション面ではかなりの力を発揮するように思います。また、サイト機能をいかにわかりやすく説明するという点でも、よりわかりやすい表現方法としての3DCGは頑張れると思います。
個人的な感覚として、webサービスに人を呼ぼうと思っても、登録ページまで行かずに離脱してしまうユーザーは相当多いのではないかと思います。
つまり、これはどういうものでどういったメリットを生んで、何が出来るものであるかを明確に伝えられていない状態で離脱するユーザも多いと思います。
これは、伝えきれていないという面でもったいないと感じますし、よりわかりやすくするという点では3DCGを活用してわかりやすくするという余地があると思います。

では、3DCGとwebサービスでどのような表現が出来るのだろうということなのですが、考えられるのは
①動画制作を行って、アプリケーションのメリットを伝える(3DCGはなくてもいいですが、あると迫力やわかりやすさが増すと思います)
②迫力のあるCG描画で告知を行うこと
③3DCG描画をイラストのように使用して要所要所でイラストと同じように使用する

webサービスで内容を動画で紹介されていることは、あまり無いと思いますが、どのようなフローでどのようなことが出来るのか、そういった面でわかり易く伝えられる方法として動画はかなり有効だと感じます。
ただ、動画制作に関しては3DCGソフトというよりはAfterEffectsのような動画編集ソフトが一番向いていますので、そういう意味では動画編集ソフト→3DCGソフトという流れになると思います。
また、webサービスでは告知を行うことも多いと感じますが、その場合はアプリケーションのシステム面というよりはデザイン面での重要性も上がると考えていますが、その場合に迫力ある絵を作るという意味では3DCGソフトの強さというのは、突出していると感じます。ただ、告知だけをする、伝えられればいい、シンプルにという場合には意味合いが異なってきますので重要度は下がると感じます。

次にwebデザイナー等のデザイン面を担う方のメリットなのですが、こちらはよりわかりやすく効果もあると感じます。
背景が寂しいなぁと思ったら、背景として画像を作成することも出来ますし、迫力のある絵を作ることも非常に得意だと感じます。
また、動画作成はある程度以上のPCスペックを必要としますが、最近では動画もPCサイトでよく取り入れられており、実際に何かを伝えることに非常に強いという面からCGソフトも使用できると自由度の高い表現が出来ると思います。
ただ、基本的には動画編集ソフトを勉強するのが先だとも思います。
CGソフトはなにがをつくることに強いソフトですし、AEのような動画編集ソフトはどちらかと言うと、もともとの素材があってそれをどうやって加工するかつなげていくかというソフトだと思うのですが、webデザインにおいて動画を撮ってというのは、なかなかにハードルも高いと感じますので、自分で自由にジェネレート出来る範囲が増えることは良いことだと思います。

PCサイトでのハンバーガーメニューはUIが悪いと思う

おしゃれなPCサイトでたまにメニューがハンバーガーメニューをクリックした場所に格納されていることがあるのですが、個人的にはそれが使いにくいのじゃないかなぁと思いました。

何故かと言うと、わかりやすいサイトのためにはぱっと見てすぐに分かるというのが大切だと思うのですが、こういったハンバーガーメニューはクリックしないと何が起きるかわからないために混乱してしまう利用者もいるのではないかと思います。デザインとしてはハンバーガーメニューの方が優れているかもしれないのですが、サイトを見に来ている人はデザインを見るためにサイトを訪れているのではないと思うため、これはかなり迷惑なのではないかと思ってしまうこともあります。

デザインが最優先事項になってしまい、サイトとしての機能がおろそかになってしまうのは、本末転倒な気がします。

また、僕はサイトを訪れてハンバーガーメニューをクリックすることはあまりないのですが、どれくらいこのボタンがクリックされる可能性があるのかをしっかりと理解する必要があると感じます。
作っている方は、クリックしてくれるだろうと思って作っていても、ユーザーは思った以上にクリックしてくれないものだと思っています。
ここらへんは、クリックしてくれないことを前提にどうやってわかりやすくするか?ということが大切だと思うのですが、ハンバーガーメニューは小さい上に端っこにあることが多く、わかりにくい = クリックされない →機能を果たせないという印象です。

Blenderのfreestyle(線だけのレンダリング)の感想

まず、線だけのレンダリングだとめちゃくちゃレンダリングが速いです。
爆速です。
自分の環境では、1フレーム0.2秒(!)から1秒以内にはレンダリングできました。
通常はかなり短くても30秒から10分くらいはかかるレンダリングが高速に終わることのメリットはかなり大きいように感じます。
ちなみに線だけのレンダリング(背景も透過させます)は、「レンダーレイヤー」タブの「レイヤー」→「インクルード」で、FreeStyle以外のチェックを外すことで出来ます。
また、FreeStyle自体を有効にするためには「レンダー」タブの下の方にある「FreeStyle」のチェックをONにします。
詳しくはわかりませんが、Blenderレンダーの状態ではFreeStyleの線が出る(カメラオブジェクトが必須です)のですが、Cyclesレンダーでは線が出ないようなので、注意が必要ではないかと思います。

まだまだFreeStykeを触りはじめてから日が浅いので、今回は触ってみた感想です。
FreeStyleだとイラストの線画のような絵を得ることができるので、イラスト系の方はメリットが大きいように感じました。
また、動画等で使用する場合はイラストと合わせる場面では使いやすいように感じました。
というのも、動画を作成するときに3DCGはあまりイラストと相性が良くないように思うからなのですが、線だけFreeStykeの場合はかなりイラストに質感を近づけることが出来ると思うので、かなり相性も良くなるように感じます。

動画編集ソフトで使用する際は、背景が大きく透過しているので、レイヤーの重なりを上手く使ってあげると面白いことができそうですね。
例えば、別に用意したグラデーション画像などでマスクしてあげたりすれば擬似的に色をつけてあげることも出来ます。
作例として、僕の作品のリンクも張っておきます。

ちょっとデメリットとして気になったのは、3DCGだから当たり前なのですが、イラストアニメーションのようにゆらぎがないので、完璧すぎて見ていて苦しい感じもしました。
また、線が多くなってくるとレンダリングに多くのbpsが必要になってくることも注意が必要です。
細い線の多い画面は、通常よりも多くのbpsを消費しやすいため動画投稿サイトでは画質の確認を前もって行うことが重要であると感じます。
また、輪郭部分の干渉の多い場面(cell fractureアドオンで作ったものを剛体シュミレーションさせたり、オブジェクトをパーティクルさせたり)では、線が潰れてしまったり、変な感じに重なってしまったりして非常に変な感じになってしまうのも少し気になりました。
ただ、上に書いたとおり、レンダリングがものすごい速いのでやり直しは楽だと感じます。
自分だけかもしれませんが、FreeStyleは他の機能と比べてBlenderが落ちることが多いように感じます。
なぜかはわかりませんが、特にプレビュー画面でタイムラインをぐりぐりしすぎると落ちやすいように感じます。
レンダリング中に落ちることは無かったので、それはありがたかったのですが、とにかくこまめな保存が大切と感じました。

FreeStyleのラインの細かい設定は「レンダーレイヤー」タブの下の方にある欄から行うのですが、ここから様々な効果を線にかけることができるので面白いです。

通常の3DCGのレンダリングと全く異なった雰囲気の線だけのFreeStyleは新しい可能性を感じ、とても楽しいと感じます。

フリーのノイズ動画素材紹介

4K Dirt vintage film dust hair damage 35mm footage FREE noise overlay after effects premiere HD – YouTube
Video Dust & Scratch – YouTube
4K FREE Dirt vintage film dust scratches damage 35mm footage overlay after effects premiere HD – YouTube
TV Noise – Free Animation Footage – YouTube
VHS static noise – YouTube
VHS Glitch – Free – YouTube
VHS Glitch – Vol. 2 – Free – YouTube
VHS Glitch – Vol. 2 – Abstract Version – Free – YouTube
Digital Glitch – 4K Video – Free – YouTube
VHS Tape Glitch and Static Noise – Free Footage [2K HD] – YouTube
VHS Tape Overlay – 4K Green screen FREE high quality effects – YouTube
Screen Glitch – Free Stock Footage – YouTube
Screen Glitch Free Stock Footage – YouTube

水彩画像を配布されているサイト

Sui-Sai~水彩画イラストフリー素材集~
商用可のフリー水彩素材│suisaisozai
「絵具・水彩 テクスチャ」の写真・画像素材が全て無料のフリー素材集(1)
「フリー素材61【水彩】」/「あぐりりんこ」のイラスト [pixiv]
水彩 – Pixabeyのフリーイメージ

Blenderでファイルのサムネを表示する

これだけだと、なんかわかりにくいなと思います。
bl1
この状態だと画面左上方向にある、この3つつながりのアイコンはこのような状態だと思います。
bl2
それを、このように一番右側のボタンをクリックすると、
bl3
サムネが表示されてわかりやすい!

PhotoShopで画像をふんわりとぼかす

画像をお借りしてきた際に、もうちょっとだけふんわりとさせたいけど、ディテールは失いたくないというときがあると思います。
そんなときに役に立つtipsを紹介します。


画像はぱくたそ様よりお借りしています。
崩落した民家

まずは画像を複製します。

その後に、複製した上のレイヤーにぼかし(ガウス)をかけます。

これだけだと、ぼやけすぎなので透過度を下げて下のレイヤーが見えるようにします。
イメージ的には、ぼかしをかけたレイヤーの下に、くっきりとした元の画像が来る感じです。
今回は描画モード「通常」で重ねていますが、他の描画モードでも雰囲気がだいぶ変わります。

完成です。