お使いのブラウザは最新版ではありません。最新のブラウザでご覧ください。

CNET Japan ブログ

weblin(ウェブリン):アニメーションアバターの作り方

2008/08/20 08:04
  • このエントリーをはてなブックマークに追加

ミキ・オキタWebClip ウェブデザインのニュース

この記事のトピック

weblin(ウェブリン)でアバターを自作したい。

こんにちは。“時代の3歩先をねらうWeb屋さん”ミキ・オキタです。
このブログ「WebClip ウェブデザインのニュース」では、Webデザイン・Webマーケティングの話題をお届けしています。

「weblin(ウェブリン)」というドイツ生まれのWebサービスが、今、注目されはじめているようだ。
CNET Japan アルファブロガー 佐々木俊尚 氏の最新エントリ「セカンドライフの「その先」をもう一度考えてみる」のなかに登場して驚いた。過去には、山崎秀夫氏に紹介されたり、百式で紹介されたりしている。

weblin(ウェブリン)
weblinの公式サイト。日本語対応しているので、ページ右上から言語を「日本語」にするとよい。

weblinをはじめて、僕はすぐにアバターを自作してみたくなった。自分自身のアイデンティティに合致するアバターが使えると楽しい。weblinでは、ちょっとしたグラフィックソフトのスキルがあれば、アバターを簡単に自作することができる。

アバターの自作について、まだ日本語の情報が少ない。公式ページも、アバターの自作に関する文書だけ英語のままだ。

そこで、公式ページのヘルプにあるアニメアバターの作成方法(PDF)を翻訳してみた。

なお、上記文書は内容が一部古かったので、僕のわかる範囲で翻訳時の最新情報に修正している。わかりづらいと思う箇所にいても、加筆している。
あくまでも英語の素人が訳したもので、正確性に責任は持てない点はご了承ください。

【アニメーションアバターの作り方】

元ソース:weblin - how to create an animated avatar

1.最初のステップ:キャラクターを選ぶ

あなたは、ギャラリーからアニメーションを選ぶか、自分でアニメーションを作成してアップロードすることができます。
「マイweblin(MY WEBLIN)」へログインし、「スタート(Start)」>「weblinの変更(Switch weblin)」から変更したいキャラクターを選んでください。(図1)

20080820_1.jpg
(図1)

画像サイズ:

画像の最大サイズは100x100ピクセルです。アニメーションのファイルサイズは、50KBを越えてはいけません。

画像フォーマット:

アニメーションGIF形式で画像を保存してください。

プレビュー画像(Preview picture):

プレビュー画像として表示される画像は、静的な(アニメーションGIFではない)GIF形式かPNG形式(PNG8)で、100x100ピクセル以下にします。ファイルサイズは10KBです。

2.アニメーションアバターを作る

新しいアバター

新しいアバターを作るため、「現在のweblin(Current weblin)」へ行き、次に「自作アニメーションを作成(Own animations)」を選びます。(図2)

20080820_2.jpg
(図2)

次のような画面が表示されます。(図3)

20080820_3.jpg
(図3)

「アニメーションアバターの新規作成(Create a new animated avatar)」をクリックし、指示に従い、規約を確認します。次のステップで、プレビュー画像をアップロードします。アップロードした画像は後で変更することができます。「次へ(next)」をクリックして、設定を確認してください。確認後、アニメーションが表示されます。(図4)

20080820_4.jpg
(図4)

3.アバターの変更

アバターを変更するには、以下の画面(図4)で「変更(Change)」ボタンをクリックします。「アバターの特徴(Avatar properties)」(図5)の画面が表示されます。この画面で、アバターの名前、説明文、および、プレビュー画像を変更することができます。

20080820_5.jpg
(図5)

「アニメーションの追加/変更(Add/change animations)」ボタンをクリックすると、異なるアクションや特性を保存することができます。これは新しい窓に示されるでしょう。 特定の特性で、あなた自身のアニメーション画像を保存できます。「新規(Add)」ボタンをクリックし、指示に従います。ただし、絵のサイズと形式を見守ってください。(図6)
(訳注:画像の透過色は、透過GIFかどうかにかかわらず、左上1x1ピクセルの位置に来た色が透過色になる。また、必要な画像をひととおり「新規(Add)」したら、そのまま次のステップへ進んでよい。全体を保存するボタンは無いので)

グループ(Group)

グループは、動作の種類ごとにまとめたものです。ひとつのグループに複数のアニメーション(動作)を設定して、ランダムで切り替えることができます。グループは以下の17種類です。

  • ふつう(Normal) (訳注:立ち姿)
  • 左へ歩く(Walk left)
  • 右へ歩く(Walk right)
  • 話す(Talk)
  • 手を振る(Wave)
  • キスする(Blow a kiss)
  • 叩く(Strike)
  • 応援する(Cheer)
  • 同意する(Agree)
  • 拒否する(Decline)
  • 拍手する(Clap)
  • 踊る(Dance)
  • あくびをする(Yawn)
  • 怒る(Annoyed)
  • 笑う(Laugh)
  • 周囲を見回す(Roll eyes)
  • 寝る(Sleep)

ピクセル/秒(Pixel/Sec)

「ピクセル/秒(Pixel/Sec)」(1秒あたりのピクセル数)はアバターが動く速度を示します。アバターは「ピクセル/秒(Pixel/Sec)」に設定された速度で、横軸に沿って左右へ動きます。左への最高速度は-100ピクセル/秒から-10ピクセル/秒の間です。右への最高速度は100ピクセル/秒から10ピクセル/秒の間です。

頻度(Frequency)

それぞれのグループで「新規(Add)」ボタンをクリックすることで、それぞれ異なった画像を保存できます。頻度はそのグループ内で、どれくらいの頻度でその画像が表示されるかの関係性を示します。(図6)

20080820_6.jpg
(図6)

4.作成したアニメーションアバターを選ぶ:

新しく作成したアバターを選ぶには、「マイweblin(MY WEBLIN)」>「現在のweblin(Current weblin)」>「カスタマイズしたアバターアニメーションの選択(Choose own animation)」(図7)へ行きます。設定したいアバタープレビュー画像を選び、「選択(Select)」ボタンをクリックします。

20080820_7.jpg
(図7)

weblinの参考情報。

以下、weblinについて情報が掲載されているウェブサイト。

【参考リンク】

クリボウの weblin 入門
日本語の情報が少ないなかで、初心者向け情報を掲載している貴重なサイト。

weblin(ウェブリン)
weblin(ウェブリン)の公式サイト。

株式会社メルティングドッツ
いち早くweblinへの取り組みをはじめている。

メルティングドッツは、先日、僕も取材させていただいている。その記事も読んでいただけると嬉しい。

【WebClip】メルティングドッツ、未来への視線

この記事に拍手する

はてなブックマークに追加はてなブックマークに追加

※このエントリは CNET Japan ブロガーにより投稿されたものです。朝日インタラクティブ および CNET Japan 編集部の見解・意向を示すものではありません。
運営事務局に問題を報告

最新ブログエントリー