SleepingMuseum

森のゲーム開発室

森クマのアゴの線で占う2018年おみくじ作ったクマ!しかしTwitterカードが!!

ここは2017年12月31日も残り1分の森のゲーム開発室・・・

f:id:shakeflower93:20180102150917j:plain

(ちっちっちっ・・・)

 

f:id:shakeflower93:20180102150931j:plain 

(あけるのかあけるのかあけるのか)

 

f:id:shakeflower93:20180102153058j:plain

 (ちっ!ちっ!ちっ!・・・ちちちちちち!!!!)

 

f:id:shakeflower93:20180102154032j:plain

(ぽぉおおおおん!!!!!)

ひょおおおおー!!!2018年クマー!!!今年もよろしクマー!!

f:id:shakeflower93:20170212180225j:plain

OL「今年こそはマネーをがっつり稼ぐわよ!!じゃあ私は寝る!森クマは寝る前にクマVSマの保守作業をよろしくね!!」

f:id:shakeflower93:20170204134554j:plain

 (1月1日の深夜)

・・・ 

ひひひ・・・ 

『実は今日1月1日は、クマVSマの保守作業より先にやりたいことがあるんですクマ!!』

 

森クマは画策していた・・・今年は年初から話題を席巻することを・・・

毎年、年明けに流行るおみくじ/占い系のWEBサービス

 

(ちびねこのおみくじ。可愛い)

 

これを元旦早々に作って公開したいクマ。

占い方法はそう・・・森クマの顎の線を使うという、画期的かつ斬新かつキュートな方法・・・!!これはもう元旦からSNSを席巻すること間違いないクマ!!

 

とりあえずベースになる線なしの森クマ画像を用意するクマ。

f:id:shakeflower93:20180102143241p:plain

・・・

顎のラインが消えたら、森クマを識別する要素は1つも残らないのでは・・・

 

次に顎の線だけの画像を用意するックマ。

 

f:id:shakeflower93:20180102151405p:plain

CocosCreatorを半年ぶりに起動して、占い画面を簡単に作るクマ。

(半年前に使って以来、全く起動していなかったため、使い方をだいたい忘れた)

 

f:id:shakeflower93:20180102142056p:plain

  1. ベースの線なし森クマをSpriteで表示して、子ノードに顎部分の線を表示するSpriteをセットしておくクマ。
  2. 「線を引く」ボタンを設置して、クリックしたら乱数で選ばれた線の画像をSpriteにセットして対応するメッセージを表示するクマ。
  3. そして「ツイート」ボタンでこのページをシェアできるようにしたックマ。2018年を占う、森クマの顎ラインが引かれた画像をシェアできれば、拡散も間違いないックマ。

 

 

できたー!!!

 

しかし・・・

 

・・・あ・・あれ・・・?森クマ(の顎ラインが引かれた)画像のサムネイルがTwitter上で表示されない・・・

 

(こういう風に、引き当てた森クマの画像を表示したかった)

 

・・・いや、そもそもはてなブログとかWEBページをシェアした時に、サムネイル画像がTwitterに表示される仕組みってどうなってるクマ・・・単にリンクを掲載するだけではダメなの・・・?

 

そうこうしているうちに、Twitterカードなるものの存在を教えてもらう。

f:id:shakeflower93:20170730200137p:plain

これだぁ!!

 

Twitterカード — Twitter Developers

 

なるほど・・・つまりサムネイル表示したいWebページのHTMLに、サムネイル表示用のmetaタグを埋め込んでおくクマね。サムネイル画像として表示したい画像のURLとかもmetaタグで指定しておけばいいと・・・

f:id:shakeflower93:20180102152406p:plain

 

・・・でも松隈(待つクマ)。森クマの画像はcocos2dxのSpriteを利用して、ブラウザのWebGLレンダリング表示しているクマ・・・しかも森クマベースと顎ラインの画像は別々・・・Twitterカードで指定するサムネイル画像は、画像ファイルへのURLじゃないとダメなのでは・・・

(そりゃそうだわ・・・)

 

f:id:shakeflower93:20180102145753p:plain

f:id:shakeflower93:20180102145815p:plain

f:id:shakeflower93:20180102145838p:plain

 

f:id:shakeflower93:20180102145849p:plain

 

まぁいいか・・・今年は・・・来年もあるし・・・

 

森クマの顎ラインで占う2018年運勢よろしクマー!!

 

森クマのゲーム2018年もよろしクマー!!

  

森クマLINEスタンプもよろしクマー!!

 

グッズもあるよクマー!!

(至高のコーヒーブレイクマ)
 

・ 

とりあえずindex.htmlにmetaタグを埋め込んでみようクマ。

今年も波乱の幕開けクマね・・・