funde-rectangleのブログ

ウルトラごった煮

TwitterのFleet機能:動くステッカー(Sticker)を作ってみる

(ドット絵描きの視点で書いております)



TwitterのFleet機能、お使いでしょうか。

なんだか使い道がよく分からなくて分からない・・・
という方も多いと思いますが、以下の通りいろんな特徴があります。

【特徴】

1.画像や動画の上にテキスト、絵文字やステッカー(GIFアニメ)
をスクラップブックのように、1枚のスペースにペタペタ貼って投稿できる
2.iOS/AndroidTwitter公式アプリからのみ閲覧できる
3.タイムライン上には表示されず、以下のいずれかの方法で閲覧できる
 <フォローしている人>
  タイムライン上部の丸型アイコンをタップ。
 <フォローしていない人>
  アカウントのプロフィール欄のアイコンをタップし、
  「Fleetを表示」を選択。
4.投稿から24時間で消滅する。
5.投稿者はFleetを閲覧した人のアカウントの一覧を確認することができる。
 (片方向フォローの鍵垢アカウントであってもこの一覧に掲載される)


特に注目すべき点はここ!

「GIFアニメをステッカーとして貼ることができる」


これご存じなかった方多いのではないでしょうか。
いままでスポットライトが当たることのなかったGIFアニメが
令和の時代に入ってまさかの栄転です。

LINEスタンプのフォーマットがアニメーションPNGだったので、
ここにきてそうなるとは思いもしませんでした。

GIPHYまたはTenorというサービスに登録されていて
かつ特定の条件を満たしたステッカー(GIPHYのみ後述)を
貼り付けることができます。


ご存じない方もいらっしゃると思うので、
フリートにGIFアニメステッカーを貼り付ける方法を
記載します。

0.FleetでGIFアニメステッカーを使う方法

【手順】

(1)フリートを投稿します。

 ベースはテキスト画像動画何でもOKです。

(2)ベースが選択出来たら画面下部の顔マークをタップします。

f:id:funde-rectangle:20210428005643p:plain

(3)「ステッカーを検索」をタップしてキーワードを入力します。

   タグ付けされたステッカーが表示されます。
f:id:funde-rectangle:20210428005715p:plain
f:id:funde-rectangle:20210428005751p:plain

(4)貼り付けたいステッカーをタップすると編集画面に出てきます。

   一本指でなぞるとステッカーを移動でき、2本指で広げたり縮めると拡大縮小ができます。
f:id:funde-rectangle:20210428005811p:plain

(5).気が済んだら「Fleet」ボタンで投稿。

   (顔マークをまたタップすればステッカーの追加もできます。)


そしてこのステッカー、なんと自作したGIFアニメを
GIPHYまたはTenorにアップロードすることで
Fleetで使えるようになるのです!!

「自作」「使える」が交錯した瞬間、世界が広がりましたね。
もう何でもかんでもやりたい放題です。(倫理的に問題ない範囲で)


導入がとても長くなりましたが、今回のメインのお話はこちらです。
TwitterのFleet機能で自作のGIFアニメステッカーを使えるようになるまでを
GIPHYのアカウント登録~GIFアニメの投稿の範囲で紹介いたします。


1.そもそもGIPHYとは?

f:id:funde-rectangle:20210428005851p:plain
GIFアニメを専門とした画像アップロードサービスです。
アップロードしたGIFにはタグ付けができ、検索時にはこのキーワードを使って
探り当てます。

GIFアニメと検索機能に特化したtumblrという例え方が一番近いかもしれません。


GIPHYで保管されるGIFアニメは「GIF」「Sticker」の2種類に分かれていて、
いずれかの形式でアップロードが可能です。

「GIF」 :GIFの画像。 画像単体で扱われることが多いです。
      Twitterではツイート欄に[GIF]ボタンがあって、そこから
      GIFのリンクを貼ることができます。
f:id:funde-rectangle:20210428005908p:plain


「Sticker」:小さいGIFの画像。 背景の大半が透過されており、
      何かに貼り付ける形で使われることが多いです。
      Stickerとして扱うには制約がありますがそれは後程紹介します。
      チャンネルが特定条件を満たした状態でこの形式で登録すると
      TwitterのFleetで使えるようになります。
      ※今回紹介するのはこちらの形式です。
f:id:funde-rectangle:20210428005921p:plain

2.TwitterのFleet機能で使えるようにするための特定条件(チャンネル)


ズバリこの2つです。

・承認済みアカウントのチャンネルである

・GIFをStickerの形式でアップロードする

3.承認済みアカウントの登録方法

GIPHYにはYoutubeのようにチャンネルという形式のアカウントがあり、
その中でGIFをアップロードして公開することになります。

このチャンネルにも3種類あります。

デフォルトのチャンネル
 登録初期時の状態。
ブランドチャンネル
 いわゆる企業アカウント。芸能人もこの枠に含まれるようです。
 承認アカウントに相当します。
アーティストチャンネル
 企業ではない、個人のアカウント。
 承認アカウントに相当します。


今回はアーティストチャンネルのケースで説明します。
(個人で作成なさる場合はこちらで問題ないと思います。)
※GIPHYのアカウントは既に作成されていることを前提としてお話します。
 (アカウントの作成はこちらのページ(https://giphy.com/join)から作成できます。)

4,アーティストチャンネルを登録する前提条件

申請するにはいくつか条件があり、これらを満たしている必要があります。
(そして申請後に審査があるようで、これが通れば晴れてアーティストチャンネルというわけです)
support.giphy.com

(1)プロフィール画像(Avatar)が設定されており、ポートフォリオとして外部サイトを提示できること。

簡単に言えば作品が投稿されている外部サービスを教えてねということみたいです。
自分はtumblrにGIFアニメなどの作品を掲載していたので、そちらのURLとTwitterのアカウントを記載しております。
(多分この辺も見て審査しているはずです。)

(2)GIFやステッカーをアップロード済であること。(目安は5~10個)

自分は30x30のものを3倍に拡大したドット絵GIFアニメを5つほど登録して申請しています。

f:id:funde-rectangle:20210428012319p:plain
赤い人間と熱帯魚です

※ちなみにアニメーションGIFでないと投稿時に怒られてアップロードできません。
 そのせいか、静止画でもピクピク動いてるStickerが多いです・・・何それ・・・
 f:id:funde-rectangle:20210428013445p:plain

(3)GIFとStickerのベストプラクティス(登録できる条件とか)は目を通しておいてね

  Stickerについては詳細を後述します。Stikerとして登録するために条件があるためです。


この条件を満たしたうえで次に進みましょう。

5.アーティストチャンネルの申請手順

1.申請!

こちらのページから申請します。
giphy.com

ちなみにGIFを5つ以上アップロードしてないと怒られるので注意。

f:id:funde-rectangle:20210428013024p:plain
この顔、腹たつわー

f:id:funde-rectangle:20210428013806p:plain
条件を満たしているとこの画面が表示されます。

「Artist」の「Select Artist」を選択しましょう。

2.必要な情報を入力する

f:id:funde-rectangle:20210428013948p:plain

Email Address    :自分のメールアドレス
Contact Name    :実名(英字)
Display Name    :アーティストチャンネルとして表示したい名前
Username      :ユーザー名。(GIPHYのと同じでいいはず)
Website or Portfolio:他に作品を掲載している外部サービスのURL。
※Optional(=任意)ってなってますが、実質必須じゃないかな・・・
Location      :居住地(自分はJapan Aichiで出しました)
Social       :SNSサービス。(自分はTwitterで出しました)
Avatar       :プロフィール画像

必要項目に入力して、チェックをつけて「Submit Application」押下で申請完了です。

撮るの忘れちゃいましたが、受領されると「You're Done!」と表示され、
登録したメールアドレスに以下のメールが飛んできます。

f:id:funde-rectangle:20210428014725p:plain

ここからだいたい長くて1週間くらいかかるみたいですが、
自分の場合は次の日には申請が通ってました。
(もしかしたらtumblrポートフォリオ出してたのが良かったのかも)

申請が通るとこんな感じのメールが飛びます。

f:id:funde-rectangle:20210428014847p:plain


あとは既にPublicで登録しているStickerが序盤で説明した手段で検索すれば
出てくるはずです。おめでとうございます!

6 TwitterのFleetで使えるようにするには

簡単です。 GIFアニメをpublicのStickerとしてアップロードします。
ただし、アップロード直後はTwitterでは検索できないみたいで、
だいたい5~6時間くらい後を目安に反映されます。


あとはタグをつけるのも忘れずに。

ただ、このタグ付けなぜかアップロード後に編集画面にいって
タグ付けしないと反映されないみたいです・・・


f:id:funde-rectangle:20210428015418p:plain
自分でアップしたものは画面右上のユーザー名をクリックすれば確認できます。

f:id:funde-rectangle:20210428015600p:plain
タグ付けしたいものをクリック。

f:id:funde-rectangle:20210428015630p:plain
画像にカーソルを合わせると右下に鉛筆マークが出るのでクリック。

f:id:funde-rectangle:20210428015822p:plain
登録したいタグ(日本語OK)を入力して「+」ボタンを押せばタグ登録完了。

6 Stickerとして登録する条件

こちらに条件があります。

support.giphy.com

必要条件だけ斜め読みで翻訳しますが

1.Stickerの背景は透過してね。色がついてたらだめよ
2.GIFアニメは少なくとも動きをつけてね!(最低2フレーム)
 ※瞬きみたいなパーツが動くでもOKみたいです

3.余白の透過部分?が大きい場合はトリミングします
4.円か正方形の形にトリミングして透過したビデオはステッカーとしての資格はありません。
 ※よくわからん・・・動画はだめってことかな
5.背景は透明であることが意図されているから不要な境界線やエッジをいれないでね
 ※画像そのものに枠を入れないでねってことだと思います。
  (後述するけどできちゃったんだよな・・・)
6.画像は少なくとも20%の部分は透過していないとNG。
 ※透過部分が少ないとNGってことです。
7.アニメPNGはNG。GIFアニメのみ登録可能。
8.サイズ制限は100MB、アニメーションの時間制限は15秒まで。(おすすめは6秒まで)
9.GIFアニメはループアニメーション(=無限にループする)ものであること。
10.見栄えが良くなる解像度にすること。自動的にサイズを変更するケースあり。
  (解像度には4の倍数を採用するのがベター。)

GIFアニメを作る部分で特に気を付けないといけないのは太字部分ですかね。


条件を満たしていないと、アップロード画面でStickerを指定していても、
自動的にGIFとしてアップロードされてしまいます。罠だ。

f:id:funde-rectangle:20210428020109p:plain

f:id:funde-rectangle:20210428020145p:plain
たとえばこういうのをあげても(透過部分の割合が少ない)

f:id:funde-rectangle:20210428020306p:plain
こんな感じでGIFとして登録されちゃう。
(「GIF」じゃなくて「Sticker」と表示されてればOKです。)

7 あとがき


ヒャー疲れました。
でもこれすごく便利でおもしろので、最近はステッカー作ってはフリートにばしばしあげてます。
セーフかどうかわかんないけど、ワンピースの部分だけ透過して
お洋服の柄を背景にするステッカーを作りましたが、こいつがめちゃくちゃ楽しいです。

是非いろんな方にスタンプ作ってもらってペタペタできるようになりたいですね。


f:id:funde-rectangle:20210428021811p:plain

もっとちまちましたものも作って見たいですね。


二次創作のラインが分かりづらいので、ポップンの絵は上げず、
にじさんじVtuberのステッカーでいろいろ試してみてる感じです。
(こういうとき二次創作が明示的に認められてるジャンル助かる~~~)

ポップンも大丈夫そうならリゼ子とかぼちぼち挙げてみたいね~
営利目的じゃないからセーフな気はするけど、しばらくは様子見してます。


ちなみにTwitterのFleetでなぜ使えるかというと、そのまま画像を貼り付けているわけでは無く、
あくまでリンクしているだけというスタンスみたいです。
なので、基本的なポリシーはGIPHYに従う形になるんじゃないかな、と思います。