2Dアニメーション!

最近ちょっとLive2DやらSpineやら、2Dアニメーション制作ツールに興味があるtaeminです!
一枚一枚手書きでパラパラ漫画のようにキャラクターを動かしていた時代から、一枚のイラストアニメーションを作ることが出来る時代に!!
時代も進化しましたね〜〜

てな訳で今回は簡単に、
2Dアニメーション制作ツールのご紹介です!

1. Live2Dhttp://www.live2d.com/ja/

また今年もLive2D Creative Awards 2018が始まりましたねー!
このブログを読んでくださっている方の中にも参加の方がいらっしゃるかも…?
国内で一番使われているツールだそうです!一番の有名どころ!
導入コストもリーズナブルで、初心者の方も手が出しやすい感じです!

2. Spinehttp://ja.esotericsoftware.com/

Live2Dよりコストはかかりますが、非常に汎用性が高く、使い勝手のよいツールであるとの評判です!
2Dキャラクターを3Dのように動かしたり、2D画面から3Dアニメーションも作ることが可能なほか、ファイルが軽量(!)という利点もあります。
日本語対応していない事が難点かも・・・?

3. SpriteStudiohttp://www.webtech.co.jp/spritestudio/

アニメーションの補間性能が良く、ぱっと見でとっつきやすい、日本語のチュートリアルサイトが豊富など、全体的に使いやすいとの評判です!
導入コストもまずまず・・・!

4. E-motehttps://emote.mtwo.co.jp/emofuri/

ビジュアル的になんだか特化した感のある見た目ですが、その通りです!(笑)
楽しく、ぬるぬる動くキャラクターを作りたい、そんなあなた!「楽をしたい」あなたにもピッタリ!
なんと!!!!!!無料!!!!!!!無!!!!!!!!!!料!!!!!!!!!!!!!!!
とりあえずダウンロードして探ってみてくれ!!!!!!!!!!!!

何種類かツールがあるので自分に合うのを探してみてくださいね~~!
では!

Adobe Lightroomを最近使ってます!

ちゃお♪
taeminで〜す☆

ここ最近だいぶ涼しく秋を感じる日があったかと思えば、熱さ再び!という日々があったりとその繰り返し・・・今年のこの暑さはほんと災害レベル!!!体調の方が追いついていかない・・・

てな訳であまりの暑さに休日もどこにも出掛けられないのでtaeminは大人しく愛犬と涼しいおうちでオネンネデス・・・😇

・・・・・・そんなわけで??今回は〜〜??

全く関係ないけど今回のお題は
「Adobe Lightroom(ライトルーム)を使ってみた」
です!

lightroom(ライトルーム)とはなんぞや〜〜?という方に簡単に説明すると、ライトルームとは写真加工専門ソフトなんですね👏👏👏

インターフェイスがこんな感じになっていて〜〜👀
右側の赤枠の部分で数値を調整するんですね〜〜👏👏👏

するとご覧の通りに補正できちゃいます!

ちょっと色褪せた写真もこの通り!
ライトルームが便利&面白くて最近ハマっているtaeminです!

若干暗く写ってしまった写真でもこのソフトを使えば、たちどころにインスタ映えするような写真に大変身〜〜!!

興味のある方は是非使ってみてくださいね〜〜!!

サプライド本日で5期目を迎えました!

サプライド、5期目迎えたってよ。

人数も続々と増え、ますます殺気活気立っておりますよ!
今後ともサプライドをよろしくお願いします!

 

画像は、弊社の敏腕営業チームとそれを束ねる我が社の代表・・・

悪人茶目っ気たっぷりノリノリの構図での撮影です!
普段着ではないですからね!そこ、勘違いしないように!!

かなり加工してありますが、この写真がサプライドサイトのどこかに使われているかも・・・?

皆さんも是非、探してみてください!
https://www.supride.jp/

5周年もこうやって、楽しく仕事していきますよ♪
皆様よろしくお願いします~

先々週は社員旅行!

先々週の事ですが、サプライド社員みんなで社員旅行に行ってきました〜〜!!

さてさて向かった行き先は〜〜👀??


鬼怒川温泉!!!!!

みんなでこのクソ暑い中温泉行ってきましたーー!!!
ホテルまでの移動中、みんなからは阿鼻叫喚でいっぱいでした!!!

無事ホテルに到着し・・・・・
おお!とってもキレイなホテル〜〜!絶対お高いんでしょ!!

さすがに昼間は暑すぎて観光どころではなく・・・・・・・
大人しくホテル内で涼んで夜はみんなで宴会をして大変盛り上がりました!

宴会の後は二次会へ・・・・
社員さんたちが体を張って熱演!!!

その後も三次会、四次会と開催され・・・・・
や〜〜〜最高に熱い夜でした〜〜〜💋💋💋




その次の日の朝・・・・・・(チュンチュン)
完全に酔い潰れてた人たちが・・・・

ブログのネタにされます〜〜〜〜😙
来年は誰がネタにされるのか??!
また来年の社員旅行をお楽しみに!!!

【hoverで色変え】ちょっと流行りのグレースケール→カラー画像を使ってみた

みなさん、おはようございます!こんにちは!こんばんは!

りんごちゃんです。

さて、梅雨もあっっっっっというまに空けてしまって、スタイルを気にする季節がやってきましたね。みなさん、ちゃんと水分補給しなきゃダメですよ?熱中症には気をつけてくださいね!エアコンのかけ過ぎにも注意!!

もう学生たちは、夏休みとかに差し掛かってきているのですかね〜羨ましいです。( ;´Д`)

海とかにも行きたいですねーそのためにはダイエットもしなくちゃですけど( ;´Д`)

ではでは、本題に入りますか!

題名にもあるようにちょっと流行りに乗ってみました!

いま、当サプライドが8月に5周年になるので、それに向けて、サイトをリニューアルしちゃいます!それで、今はどんなサイトが流行りなのか調べてみました!

するとこちらが出てきました

画像をスタイルでグレーにして、カーソルが重なった時にカラーになる。

もう一つは画像が少し大きくなるんですよ!表示されている画像の大きさは変わらないので、中にある画像がブワンと大きくなる動きが意外と面白い。

では、コーディングして行きましょう。

まずは、htmlはこんな感じです画像をdivで囲んで

CSSでまず外で囲んでるクラスwakuに幅高さを決めて(基本的には画像に合わせて作った方がいいです)、display:block;をかけて、下の三行を入れるだけです!

これでまずは、画像がグレーになります。()のなかの1は、グレー100%を示しています。

次にカーソルが重なった(以降ホバー)時にグレーのフィルターを外します。

()のなかの1を0にするだけですね。

これだけだとホバーした時にパッとカラーに変わるのでそこで!

これですよ!

transition-duration: 1s;

このコードをそれぞれのスタイルにかけるとふわ〜をカラーになったりグレーになったりします。

これで画像をグレーにしまくれますね!

では、次に中の画像をホバーした時に大きくしましょう!

ここでは、中のimgをいじります。

 

まずは、画像自体にtransition-durationを指定します。ここで、枠と画像との間に余白が入っていると見栄えが良くないので、0.1%ほど大きくしています。ここは好みです。

次にホバーした時にtransform: scaleで画像のサイズを大きくしています。1は100%のサイズをしているので、それより大きくしたい場合は1以上の数値にそれより小さくしたい場合は、1より小さい数値に指定したらオッケーです。

これで終わりじゃないですよ。これを忘れちゃダメですよ!

この一文をdivに書き忘れるとdivからはみ出ても表示されちゃいますので、気をつけてくださいね!

これで完成です♪

これひとつ入れておくだけでも流行りに乗っかったサイトになるでしょう〜〜〜☆*:.。. o(≧▽≦)o .。.:*☆

では、失礼します。まったね〜〜〜♪