Twitter は自己表現の大きなチャンスであり、その一部は間違いなく視覚的な要素です。Twitter インターフェースでは基本的な背景がいくつか提供されていますが、正直言って、そのほとんどは退屈で、何十万人もの人が同じ要素を使用している場合、独自性を演出するのは難しいでしょう。ツイートだけでなくスタイルでも注目を集めるには、独自のカスタム背景を作成してみてください。2 部構成のシリーズの第 2 部では、タイル状 (またはパターン化) の背景を作成する方法について説明します。昨日の第 1 部では、画像マスクを使用して背景にシームレスに溶け込む左上のグラフィックを作成する方法について説明しました。今回は、タイル状 (またはパターン化) の背景について詳しく説明します。このチュートリアルは Twitter 用に作成されていますが、ここで作成したパターンは、個人のブログや会社の Web サイトなど、ほぼどこでも使用できます。
Twitter向けのデザイン
シンプルでスタイリッシュなパターンは、あなたのページに洗練された雰囲気を与え、人々はあなたが選んだ画像からあなたを連想する傾向があります。粗い猫の写真をページ全体に並べても、フォロワーはそれほど多くは獲得できないでしょう。漫画風の可愛い猫のパターンなら、あなたが猫好きであるというメッセージを伝えることができ、全くの初心者だと思われずに済みます。
キラーパターンを考案することが目標です。繰り返しが目立ちすぎないよう、パターンは適度に大きく(300×300ピクセル以上)しましょう。グラデーションはタイル間で溶け合わないため、避けましょう。また、パターンの色とコントラストも慎重に調整しましょう。結局のところ、ユーザーはツイートを読むために来ているのであって、失明するために来ているのではありません。
Adobe Photoshop CS3またはCS4を開き、「ファイル」→「新規」を選択します。パターンの幅と高さを入力します。この例では、400×400ピクセル、72ピクセル/インチを選択します。パターンは必ずしも正方形である必要はありません。幅広または高さのあるパターンの方がコンセプトに合うと思われる場合は、600×300や200×800などの解像度を入力してください。(Twitterの唯一の要件は、画像ファイル全体のサイズが800KB未満であることです。)「OK」をクリックして続行します。

レイヤーパレット(ウィンドウ -> レイヤー)を見つけて、頻繁に使用するので手元に置いておきましょう。まずはパターンの背景色を設定します。「レイヤー」→「新規塗りつぶしレイヤー」→「単色」を選択します。カラーレイヤーの名前(例:背景色)を入力し、「OK」をクリックします。カラーピッカーから色を選択し、「OK」をクリックすると、レイヤーパレットに新しいレイヤーが表示されます。(カラーレイヤーのサムネイルをダブルクリックすれば、いつでも背景色を変更できます。)
パターンにグラフィック要素を追加しましょう。「レイヤー」→「新規」→「レイヤー」を選択します。テキスト、ペイントストローク、パスなど、好きなものを追加できます。このチュートリアルで必要なのは、グラフィック要素がドキュメント内に収まることです。最初のグラフィック要素に満足したら、レイヤーの横にある目のアイコンをクリックしてレイヤーの表示/非表示を切り替えます。このプロセス(新しいレイヤーと新しいグラフィック要素を追加し、レイヤーの表示/非表示を切り替える)を繰り返し、パターンに必要なすべてのグラフィック要素を作成します。
次に、タイル上にグラフィック要素を配置します。最初に作成した要素のレイヤー表示をオンにし、「フィルター」->「その他」->「オフセット」を選択します。(ベクターオブジェクトを作成した場合は、続行する前にベクターマスクがラスタライズされるという警告が表示されます。)「オフセット」ウィンドウが表示されたら、プレビューオプションにチェックを入れます(まだチェックが入っていない場合は)。すぐ下に「未定義領域」のオプションが表示されます。「折り返し」ラジオボタンをクリックします。次に、水平方向と垂直方向のスライダーを動かしてグラフィック要素を配置します。グラフィックをドキュメントの端から押し出しても、反対側に折り返されることがわかります。グラフィック要素を配置し、「OK」をクリックします。各要素に対してこの手順を繰り返すだけで、すぐに興味深いパターンを作成できます。

パターンをエクスポートするには、次の手順に従います。
- 「ファイル」->「Web およびデバイス用に保存」を選択します。
- プリセットポップアップメニューからPNG-24を選択します。
- 透明度がチェックされていないことを確認してください。
- 「sRGB に変換」がチェックされていることを確認します。
- 予測されるファイル サイズ (右下に表示) が 800k 未満であることを確認します。
- [保存] をクリックして、ファイルをデスクトップに保存します。

Twitterにパターンを投稿する
パターンのアップロードは簡単です。Twitterのホームページにアクセスし、「設定」をクリックします。ページが読み込まれたら、「デザイン」をクリックします。デフォルトのテーマのすぐ下に、「背景画像を変更」というオプションがあります。このリンクをクリックし、「ファイルを選択」をクリックします。デスクトップに保存したパターンを見つけて、「選択」をクリックします。背景をタイル表示するオプションにチェックを入れ、「変更を保存」をクリックします。これで新しいデザインが確定しました。次は、デザインの色(テキスト、リンク、サイドバーなど)をそれに合わせて調整しましょう!
[ クリス・マクベイは、ノバスコシア州ハリファックス在住の作家、イラストレーター、そしておもちゃの写真家です。TwitterではActionFiguredとして知られています。 ]