1. 芸術情報演習デザイン(Web)
第10回: TumblrでWebサイトを作成
2013年6月13日
東京藝術大学 芸術情報センター(AMC)
担当：田所淳

2. 今日の内容
‣ Tumblrのサービスを使用してWebサイトの公開に挑戦!
‣ http://www.tumblr.com

3. Tumblrとは?
‣ (ミニ)ブログと、ソーシャルブックマークを統合
‣ 2007年3月1日にサービス開始
‣ CEO、David Karp

4. Tumblrとは?
‣ 利用状況 (2013年6月現在)
‣ 115,00,000 のブログ
‣ 52,800,000,000 の投稿
‣ 参考：http://www.tumblr.com/about

5. Tumblrとは?
‣ 2013年5月 Yahoo! (米) がTumblrを11億ドルで買収
‣ ただし、Tumblrは今後も独立した事業として運営

6. Tumblrにアカウントを作成する

7. Tumblrにアカウントを作成する
‣ まずは、アカウントを作成
‣ 既にアカウントを取得している方は、既存アカウントを活用

8. Tumblrにアカウントを作成する
‣ Step 1：
‣ Tumblrのサイトにアクセス http://www.tumblr.com
‣ 右上にある「Sign up」ボタンをクリック

9. Tumblrにアカウントを作成する
‣ 登録は、emailとpasswordとusername を入力するだけ!

10. Tumblrにアカウントを作成する
‣ 年齢確認に正直に答えましょう

11. Tumblrにアカウントを作成する
‣ 表示される、判読しずらい文字を入力
‣ コンピュータによる大量のアカウント取得を防止している

12. Tumblrにアカウントを作成する
‣ 登録したemail宛てに確認のメールが届くので認証

13. Tumblrにアカウントを作成する
‣ Step 2：
‣ ユーザー登録
‣ まず登録するのは以下の３項目のみ
‣ emailアドレス
‣ パスワード
‣ ユーザ名
‣ 年齢を入力、利用規約を読んだことにして「次へ」

14. Tumblrにアカウントを作成する
‣ 登録が完了すると、登録したemailアドレスに確認のメールが
送られてくるはず
‣ 「メールアドレスを認証する」を選択しアカウントを確定

15. Tumblrにアカウントを作成する
‣ ログイン完了、スタートアップ画面が表示される

16. Tumblrにアカウントを作成する
‣ 画面の指示に従って、諸々設定
‣ 1. 自分のポートレートを投稿
‣ 2. 自分のブログ用のテーマとタイトルを選択
‣ 4. アバターを変更する
‣ 順番にこなしていきましょう!

17. Tumblrにアカウントを作成する
‣ タイトルやブログの説明は、テーマのカスタマイズ画面で
‣ テーマ選択もここから

18. Tumblrにアカウントを作成する
‣ 設定画面で、サムネイル画像や、URLを設定する

19. Tumblrを使ってみる

20. Tumblrを使ってみる
‣ Tumblrでは、様々な種類のメディアを投稿できる
‣ テキスト、画像、引用、リンク、チャット、音声、動画

21. Tumblrを使ってみる
‣ 投稿するメディアを選択し、実際に投稿してみる

22. Tumblrを使ってみる
‣ 「保存・公開」すると、ダッシュボードに追加される

23. Tumblrを使ってみる
‣ ダッシュボード右上「(ブログ名) を開く」ボタンを押してみる

24. Tumblrを使ってみる
‣ 設定したテーマで投稿が表示される
‣ → このページが公開されたブログに相当する

25. Tumblrを使ってみる
‣ ブックマークレットを設定すると、投稿が楽になる
‣ http://www.tumblr.com/goodies
‣ このページにある「Tumblrで共有」のリンクをドラッグし
て、ブックマークバーに追加する

26. Tumblrを使ってみる
‣ 投稿したい情報のあるサイトへ移動して、登録したブックマー
クレットを押す
‣ 別ウィンドウで投稿画面が表示される

27. Tumblrを使ってみる
‣ 実習：
‣ 作成したTumblrに、様々なメディアを投稿してみる
‣ ある程度投稿が溜まったら、テーマを選択して好みのデザイン
にしてみる
‣ 余裕があれば、テーマをカスタマイズ
‣ 作成したブログのURLを下記にメールしてください
‣ tadokoro+geidai@gmail.com

28. 参考：Tumblrの有名サイト

29. 参考：Tumblrの有名サイト
‣ Lady Gaga (http://amenfashion.tumblr.com/)

30. 参考：Tumblrの有名サイト
‣ VOGUE (http://vogue.tumblr.com/)

31. 参考：Tumblrの有名サイト
‣ GQ Magazine (http://gq.tumblr.com/)

32. 参考：Tumblrの有名サイト
‣ DOLCE & GABBANA (http://dolcegabbana.tumblr.com/)

33. 参考：Tumblrの有名サイト
‣ GICCI (http://gucci.tumblr.com/)

34. 参考：Tumblrの有名サイト
‣ Barack Obama (http://barackobama.tumblr.com/)

35. 参考：Tumblrの有名サイト
‣ STUDIO VOICE (http://studiovoice.tumblr.com/)

36. 参考：Tumblrの有名サイト
‣ ART iT Japan (http://art-it.tumblr.com/)

37. 参考：Tumblrの有名サイト
‣ 水野美紀 (http://mikimizuno.com/)
‣

38. 次週予告
‣ 次週は、Tumblrをより高度にカスタマイズする方法をやって
いきます!!