Makery Blog

西麻布のクリエイティブラボ「Makery」でテクノロジーとアイデアをこねています。

slick.jsを使ってスライドショーを作る(スライドごとに秒数指定)

各スライドごとに秒数指定できるようなスライドショーを作りましょう。
自前でjsを使ってスライドショーを実装するのは結構大変だと思うので、今回は自分がよく使わせてもらっているslick.jsを使って手軽にできるようにしてみます。

DEMO

なおslick.jsを使う諸々の準備等は公式のgithubページなどを参考にしてください。

続きを読む

年末恒例社内賞、BBmediaクリエイティブアワード

企画演出の豊島です。

2017年もあと少し。世の中も何だかワクワクする年末の雰囲気に……

そうです忘年会シーズンです。

 

ビービーメディアも毎年恒例の忘年会を行います。

楽しいゲーム大会、美味しいご飯……

そして始まる、BBmediaクリエイティブアワード』授賞式!

 

  f:id:bbmedia:20171226120002p:plain

 

続きを読む

水中に潜ってプレイするARコンテンツを制作しました。

f:id:bbmedia:20171225104447p:plain

 

12/3(土)に行われた、第1回ゆるプル選手権にて、水中に潜ってプレイする

ARコンテンツを制作しました。 

 

今回は概要やその時の検証の様子、結果などを書いていこうと思います。

 

※今回は事前にプール内でのスマホの所持、撮影許諾等を得ています。 

  通常はプール内での撮影は禁止だと思いますのでお気をつけください。

 

続きを読む

ATLにモーションキャプチャーとモーショントラッキングのテスト

 

テクノロジーモーショングラフィックスの楊です。

 

先月に、ATL(Advanced Technology Lab)の研究員になって、検証しに来ました。

現在ATL研究員になっている社内のスタッフは4人です。(田村さん、中野さん、谷崎さん、楊)

それでは、ATLは簡単に紹介します。

VRコンテンツの開発と、VRヘッドセット「HTC Vive」、「Oculus Rift」、モーションキャプチャー整備、グリーンバックルーム、そしてその他もろもろ機材を無料で開発用として、オープンイノベーションスペースです。

利用するには、会員登録をして「客員研究員」になる必要があります。また、そのスペースでクリエイトされたものはATL SHOWCASEで公開されるとのこと。しかし、その他の権利(著作権など)はすべて開発者のものとなります。

atl.recruit-tech.co.jp

 

今回検証したのを紹介します。 

 

モーションキャプチャー

モーションキャプチャースーツがサイズ違いのを用意されています。

 

f:id:bbmedia:20171122191527j:plain

モーションキャプチャー

モーションキャプチャーのデータを3Dソフトに変換,そして、モデリングにモーションを配置

f:id:bbmedia:20171122192428j:plain

モデリングを配置

モーションありのモデリングをunityに書き出し、ARアプリに出力。

キャプチャーした映像はこちらになります。

youtu.be

 


モーションの精度について、前に試したkinictに比べると、かなりいいです。今後も幅広く活躍できると思っております。

 

 

ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー 

 

モーショントラッキング

グリーンバックルームを使用して、テープを用意し、壁に貼り付け、携帯で撮影しました。(本来はちゃんとしたカメラで撮らないといけないですが、会社のカメラが予約できず)

f:id:bbmedia:20171122193341j:plain

グリーンルーム

 今回はUnreal Engine4を使って、実写合成をしてみました。カメラトラッキングはCinema4Dを使って、データをUE4に書き出し、背景は全部UE4でつくりました。レンダリング時間はかからず完了しました。

youtu.be


Unreal Engine4はゲームエンジンですが、近年ハイスピードで開発され、ゲームだけではなく、CGスタジオにも確実に広がっていたようです。レンダリング時間がかからないの代わり、質感の表見できない部分は多少あります。今後にも3Dソフトとのバランスよく作業分けて、効率よく使って行こうと思っております。 

マーケティングを学び、映像を活用する意味を考える

プランニンググループの森田です。

9月より日本マーケティング協会の

マーケティングマスターコースをの受講をはじめました。

我40にして惑いまくりながら、マーケティングの「マ」から学んでいます。

 

▶︎マスターコースとは?

現役バリバリの各種企業の現役マーケターのみなさんが集い

毎週1回、約11ヶ月の期間を通して、頭に汗をかく座学を行なっていく講座です。

最終論文を仕上げ、規程課題を克服すると、「マーケティングマスター」の称号が!

 

▶︎そもそもマーケティングとは何か?

「学ではない、論なのだ」

初回の講義でマスターの先生のお言葉がありました。

時代によって、語る人によって変化し続けるもの。

 また、先日のワークショップではとてもシンプルに言語化もしていただきました。

「誰に、何を、どうやって売るのか?」

なんだ、そんなシンプルな話しかと思いますが、奥が深すぎます。

 

 

▶︎ツールは熟達すべしということで

SWOT、4P、STP、など聞いたことのある分析ツールではありますが

使いこなすのはそう簡単ではないことがやってみるとわかります。

講義の序盤ではある「メガネブランド」を元に

「ケースメソッド」*1で経営課題に直面する

実践疑似体験を行ないました。

f:id:bbmedia:20171006161503j:plain

SWOT分析からSTPに苦戦!

 

(グループご一緒させていただいたみなさま、ありがとうございました。)

 

▶︎SWOT分析から自社の強みを最大化する

例えば、弊社でやってみるとこんな感じに。

f:id:bbmedia:20171012150106j:plain

BBmediaのSWOT分析

強み(Strength)と機会(Opportunity)を生かし

テクプラ部門では「映像と体験」を掛け合わせた

オリジナルコンテンツの自主開発をBB+(プラス)と名付け、もっか制作中です。

f:id:bbmedia:20171012150741j:plain

 

▶︎映像市場の今を整理してみる

さて、「映像を強み」にと言っても、映像分野はもはや多岐にわたっています。

これも、一度頭の整理のために可視化をしてみました。

f:id:bbmedia:20171012145416j:plain

動画と一言では、もはやくくれない

もともとTVCM制作から始まった弊社のビジネスも

オウンドメディアの台頭によって、広告動画のみならず

この左右の両極をカバーしていくコンテンツ制作会社になっていくべきことが見えてきます。

 

引き続き、マーケティング視点を持つべく勉強しながら

大胆に過去の思い込みを捨て、イノベーションを生み出せる

そんな能力を磨いていきたいと思います。

 

※講座についてブログで紹介させていただくことは、マーケティング協会事務局さまにご快諾いただきました。

一部、講義の雰囲気のわかる写真を掲載させていただいていますが、問題がある場合は、森田までご連絡ください。

 

 

*1:実際の事例研究を重視した教育方法のこと。アメリカ合衆国ロー・スクールビジネス・スクールなどの、大学院教育において主に採用されている Wikiより引用

デバイステキストをCSSで制御するTips諸々

レスポンシブWebデザインもすっかり定着し、様々な解像度の端末も増えたからか、昔と比べると画像テキストを使わずデバイステキストを扱う機会が増えたように思います。

なのでデバイステキストをコントロールするtipsをメモがてら連々記しておきます。

続きを読む