平面画像が立体的になる!? 「3DEFY」



先日の記事の続きです。
これはこのサイトにシェアされていた作品をお借りしています。
私はセンスがないので、こんなにうまく作れませんが、簡単に平面的な画像をこんなふうに立体的に見えるようにするサイトです。

3defy20.jpg(←画面上にこのようなマークが出ている場合は、このマークをクリックしてください。)

3defy01.jpg3DEFYのトップページです。

【REGISTER】
登録して使うと、WEB上の画像やパソコン内にある画像を使って作ることができ、保存もできます。
登録しない場合は、サイト側で用意されているサンプル画像のみ使うことができ、保存はできません。
登録は無料ですし、IDを決めメールアドレスとパスワードを登録するだけですから、いろんな画像で楽しんでみたい方はぜひ登録してお使いください。

【3D MODELER】をクリックすると編集する画像を選んで始めることができます。

【HOW TO CREATE 3D MODELS】
こちらをクリックすると使い方の説明があります。
マウスの操作方法が主に書いてあります。
英文ですが、なんとなくわかると思います。
説明ページ上の【WATCH TUTORIAL VIDEO】をクリックすると動画で簡単な説明を見ることができます。

3defy03.jpg
登録画面はこんな感じ。

3defy02.jpgWEB上の画像を使う場合(Option1)とファイルをアップロードして使う場合(Option2)は登録していないと使えません。
登録している場合はトップページの【SIGN IN】からログインするか、この画面の「Login」をクリックしてログインした上で使用してください。

登録しない場合は(Option3)のサンプルイメージから選んでください。

以下、簡単な使用方法を書いておきますが、画像はこのサンプルイメージから使わせていただきます。

3defy04.jpg
「3D MODELER」をクリックします。

3defy05.jpg
WEB上の画像を使ったり、パソコン内の画像をアップロードして使ったりできますが、ここではサンプルイメージの中から選んでみました。

3defy06.jpg
「OK」をクリックします。

3defy07.jpg
「Objects」-「Create」をクリックします。

3defy08.jpg浮き上がったように見せたい部分を範囲選択します。
「Paint Brush」にチェックが入っている場合は選択部分を塗りつぶしていきます。
マウスホイールを動かすと、ブラシの大きさを変えることができます。

「Color Matcher」にチェックが入っている場合は、ポイントした部分と同じ色が選択されます。

「Erase」ボタンをクリックしてなぞると、消しゴムになります。

3defy09.jpg塗りつぶす範囲が大きい時は、外側を囲み、「Fill Gaps」ボタンをクリックするとその中が塗りつぶされます。

範囲選択する部分が全て塗りつぶせたら、「Create Object」ボタンをクリックします。

3defy10.jpg
このように、浮き上がったように見せたい部分が選択されます。

3defy11.jpg「Push/Pull」にチェックが入った状態で、マウスを右クリックしたまま上下(前後)に動かすと、選択された部分が大きくなったり(出てきたり)、小さくなったり(引っ込んだり)します。

「Create」をクリックすると確定します。

3defy12.jpg保存するときには「Save」をクリックします。
ただし、この場合はこのサイト内の自分のページに保存されるだけで、パソコンにダウンロードされるわけではありません。
パソコンにダウンロードする場合は(この画像には表示されていませんが)右側メニュー一番下の「Export ZIP」をクリックすると複数枚の画像としてダウンロードされます。
この画像をGifアニメにすると立体的に見えるかもしれません(やってないので不明)。


ここではブログなどに貼り付ける場合の方法を詳しく説明します。
「Share」をクリックします。

3defy13.jpg「Get URL」をクリックするとリンク先のURLが表示されます。
別ページで表示させたい場合はこちらがいいかも。

「Get Embed Code」をクリックすると、この記事で表示させたように埋め込んで表示させるためのコードが表示されます。

3defy14.jpgすでにログインしている場合はこの画面は出ませんが、まだログインしていない場合はこの画面が出てきますのでログインします。
もしくは登録します。
(登録する場合は「Register」をクリック。)

3defy15.jpg埋め込みコードが表示されますので「Copy To Clipboad」をクリックしてコピーしておきます。

3defy16.jpg
「クリップボードにコピーされました」と表示されますので「OK」をクリック。

そのタグを↓のようにそのまま貼り付けると……

<script type="text/javascript" src="http://apps.3defy.com/js/3defyembed.js"></script>
<div class="3defy" style="width:480px;height:360px;" resizable="false" model="14704/82c36246eddb8830602c789009a34c0eb8920395/r4f488f76494cb/21540"></div>

↓のように表示されます。



以上が基本的な使い方でした。


3defy17.jpg「Pivot」の使い方

「Pivot」は任意のラインを軸として少し回転したように見せることができます。

軸となる点を2ヶ所クリックします。
マウスを右クリックしたまま上下(前後)に動かすと、そのラインを軸として回転したようになります。

3defy18.jpg「Bend」の使い方

「Bend」は任意のラインを軸として曲げたように見せることができます。

軸となる点を2ヶ所クリックします。
マウスを右クリックしたまま上下(前後)に動かすと、そのラインを軸として曲がったようになります。

3defy19.jpg「Texture」の使い方

「Texture」はその範囲を膨らんだように見せることができます。

膨らんだように見せたい場所を選択します。
マウスホイールを回すと範囲選択の範囲が大きくなったり小さくなったりします。
マウスを右クリックしたまま上下(前後)に動かすと、選択範囲が膨らんだようになります。

いろいろと触ってみてどのようになるか見てみてください。
かなり楽しいです♪
私にもっとセンスがあればなぁ……。


関連記事

9 Comments

-  

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

2012/02/27 (Mon) 20:45 | REPLY |   

れん  

鍵コメ 2012/02/27(Mon) 20:45様

鍵コメ様、ご訪問くださって、コメントいただきありがとうございますm(__)m

鍵コメ様のブログにこの記事をリンクしてくださるのですか?
とってもうれしく思います♪
お好きなURLをどこにでも貼りつけてやって下さいませm(__)m

これからも遊びに来てくださいね!

2012/02/28 (Tue) 17:57 | EDIT | REPLY |   

れん  

○○士 ○郎 様

○○士 ○郎様、コメント拝見いたしました。
まず、せっかくいただきましたコメントですが、勝手ながら削除させていただきましたこと、心よりお詫び申し上げます。

コメント内容がこの記事にも、またこのブログにも全く関係のない内容であることと、金銭が絡む「営業」コメントであったため、不適当であると考えさせていただき、勝手ながら削除させていただいた次第です。

申し訳ございませんが、諸事情ご賢察の上、ご了承くださいますようお願い申し上げます。

2012/03/02 (Fri) 17:48 | EDIT | REPLY |   

-  

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

2012/03/06 (Tue) 19:45 | REPLY |   

れん  

鍵コメ 2012/03/06(Tue) 19:45 様

鍵コメ 2012/03/06(Tue) 19:45 様、再度のご訪問ありがとうございますm(_ _)m

わざわざコメントを残して下さってとても嬉しく思います♪

またぜひお越しくださいね!
今度は鍵コメ様のブログにもおジャマさせていただきたいです(*^^*)
よろしければURLお教え下さいませんでしょうかm(_ _)m
 

2012/03/08 (Thu) 14:55 | EDIT | REPLY |   

-  

管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

2012/03/08 (Thu) 21:05 | REPLY |   

れん  

鍵コメ 2012/03/08(Thu) 21:05様

鍵コメ 2012/03/08(Thu) 21:05様、返信が遅くなり申し訳ありません。

教えくださってありがとうございますm(__)m
私もお邪魔させてくださいね!

そうなんです。
秘密コメントにしても「このコメントは管理者のみ閲覧できます」と表示されます。
これは設定で表示されないようにもできるのですが、私は秘密コメントをくださった方へも全てのコメントに対して返信したいので、同じコメントに秘密コメントの方が複数いらっしゃる場合、何月何日何時何分に秘密コメントを入れてくださった方への返信…とわかるように、表示されるようにしています。
もちろん秘密コメントの内容は私しか読めませんけどね(#^.^#)

これからも遊びに来ていただけるとうれしく思いますm(__)m

2012/03/10 (Sat) 11:31 | EDIT | REPLY |   

恵那爺  

これ楽しそう

PhotoScapeのPSIを検索してこちらのブログにたどり着きました。
早速、今試している所です。
貴重な情報ありがとうございました。
きょうは、アメブロがメンテナンス中のためれん様の過去記事をいろいろ拝見していましたら3DEFYの記事を見て楽しそうなので、早速登録して作ってみたんですが、イマイチ上手く動きませんでした。v-40残念。
実は、チクワしか持ってねえというソフトでGIFアニメを作っているのですけど、動きが速すぎて、作ってから他のソフトで速度を調整しています。
それも面倒なんで何か良いソフトが無いかと探していました。
3DEFYは結構面白そうなんで
ゆっくり、作り直してみたいと思います。
また、困ったら遊びに来ますのでよろしくお願いいたします。

2012/10/16 (Tue) 05:25 | EDIT | REPLY |   

れん  

恵那爺様

恵那爺様、ご訪問くださってありがとうございますm(__)m
返信が大変遅くなり申し訳ありません。

3DEFY…すごいですよね!
静止画像から簡単にパーツ?を浮き出させてくれるんですから。

私がこれを記事にした時と現在はちょっと表示が変わってしまっています。
今は2画面出てきて「マジックアイ」の要領で眺めていると画像がものすごく立体的に見えてきています。

恵那爺様はFlash画像をGifに変換されているのですね?
すごいです!!e-460e-460

駆け足で恵那爺様のブログにお邪魔させていただきました。
いろいろと興味深い記事がたくさんあり、後ほどゆっくりと拝見させていただきたいと思っています。

これからもよろしくお願い致しますm(__)m

2012/10/17 (Wed) 21:48 | EDIT | REPLY |   

Post a comment