三階ラボ

Archive for the tips Category

Home Prev Next

tips 連続したテキストデータを作る

Tags:
nothing

このエントリーはfoobar ontheheadから読み込んだものです。レイアウトや表示に乱れがあるかもしれませんが、ご了承ください。

デザイナーさんの中には、Excelを毛嫌いする方も多いかもしれません….
という前提で、Excelには作図や表計算以外にも「オートフィル」という便利な機能があります。

オートフィル機能を使えば、連なったテキストを簡単に用意することができます。

Excelのオートフィル

例えば、数字を1から100まで用意したい場合、最初のセルに「1」を、次のセルに「2」も入力しておきます。入力した2つのセルを選択します。選択した2つのセルの右下部分にカーソルを持っていくとカーソルが「+」に変ります。そのまま100セル目までズリィ〜っとドラッグすると、ドラッグしたところまでの数値を自動的に補完してくれます。

例

セルの書式設定を「文字列」に設定しておけば、「001」みたいな頭にゼロのつく数字も扱えるようになります。
数字以外にも、月名や曜日なんかも自動で入力してくれるので、カレンダーを作るときに便利だったりします。

ボクの場合、ウェブサイトに画像を大量に貼り付けるとき、このオートフィル機能を使うことが多いです。

imgの連番を自動補完


tips グラデーションの反転

Tags:
,

このエントリーはfoobar ontheheadから読み込んだものです。レイアウトや表示に乱れがあるかもしれませんが、ご了承ください。

グラデーションの反転

Illustratorのグラデーション方向を変える場合、「角度」を180°にすれば逆方向にすることができます。ですが、いちいち数値をキーボードで入力するのが面倒なときがあります。
そんなとき、マウスとOptionキーを使って簡単に反転することができます。

グラデーションパレット

反転させたい鉛筆マークをつかみます。つかんだままOptionキーを押しながら、もう一つの鉛筆マークの上までドラッグすると、グラデーションが反対になります。(細かく言うと、色が入れ替わるっていう感覚だと思います。)

複数色のグラデーションの場合は、ドラッグ開始の鉛筆マーク色重なり合わせた鉛筆マーク色 を入れ替えることができます。


tips 画像を水平にする

Tags:

このエントリーはfoobar ontheheadから読み込んだものです。レイアウトや表示に乱れがあるかもしれませんが、ご了承ください。

サンプル画像

傾いてしまっている写真を水平にしたいとき、Photoshopのものさしツールを使うと簡単に修正することができます。

まず、基準となりそうな水平な部分を探し、「ものさしツール」でドラッグします。

ものさしツールでドラッグ

その状態で、「イメージ」→「カンバスの回転」→「角度入力…」を選択すると、水平にするための角度が自動的に入力されています。

自動で数値が入力

んで、OK。

完成図


tips Illustratorのカラーパレット

Tags:
,

このエントリーはfoobar ontheheadから読み込んだものです。レイアウトや表示に乱れがあるかもしれませんが、ご了承ください。

Illustratorのカラーパレットには、マウスを併用する便利ショートカットがあります。カラーパレットの左上にあるプルダウンからいちいち選択しなくて済むので重宝します。

アクティブになっているカラーを補色に変換

アクティブになっているカラーを補色に変換

  • スペクトル部分
  • Command + Click

「塗り」または「線」のアクティブになっている方のカラーを「補色」に変換してくれます。

非アクティブになっているカラーをスペクトルから選択

非アクティブになっているカラーをスペクトルから選択

  • スペクトル部分
  • Option + Click

「塗り」または「線」の非アクティブになっている方のカラーをスペクトルから選択してくれます。

非アクティブになっているカラーを補色に変換

非アクティブになっているカラーを補色に変換

  • スペクトル部分
  • Command + Option + Click

「塗り」または「線」の非アクティブになっている方のカラーを「補色」に変換してくれます。

カラーパレットの表示モードを変更

カラーパレットの表示モードを変更

  • スペクトル部分
  • Shift + Click

カラーパレットの表示モードを、「RGBモード」→「HSBモード」→「CMYKモード」→「Web セーフ RGBモード」→「グレースケールモード」→「RGBモード」…. という順番でループしながら変更してくれます。

明度と彩度の比率を保ちながら変更

明度と彩度の比率を保ちながら変更

  • スライダー
  • Shift + Drag

カラーパレットの表示モードが「HSBモード」と「グレースケールモード以外のとき、明度と彩度の比率を保ったまま色を変更することができます。(この説明で合っているのか自信なし。)

個人的に「カラーパレットの表示モードを変更」を頻繁に使用しています。Illustrator 10の頃は「Web セーフ RGBモード」→「グレースケールモード」→「RGBモード」と変更した際、「グレースケール」のときに彩度を失ってしまったのですが、Illustrator CSあたりから、一度「グレースケール」を通過しても彩度を維持してくれるようになりました。


tips [OSX] 滑らかな文字のスタイル

Tags:
,

このエントリーはfoobar ontheheadから読み込んだものです。レイアウトや表示に乱れがあるかもしれませんが、ご了承ください。

OSXのアンチエイリアス

以下、ものすごくどうでもいい内容です。知識の乏しいボクが適当に解釈したものです。興味のある方は、詳しく説明してあるサイトで調べてみてください。興味が無い方や既知の方は、へえ。またアンチエイリアスかよ! 程度に斜め読みしてください(笑)

OSXは、システムからソフトウェアまで、ほぼ全てのインターフェイスでアンチエイリアスのかかった滑らかで美しい(人によっては嫌いな方もいると思いますが)文字を表示してくれます。
この滑らかな文字の設定を、システム環境設定アピアランス内にある「滑らかな文字のスタイル」で変更することができます。
自動 - 主ディスプレイに最適」に設定しているかたがほとんどかと思われますが、この他にも4種類の設定があります。

その内の「」「中 - フラットパネルに最適」「」に設定にすると、サブピクセルフィルタ(サブピクセルレンダリング)でアンチエイリアス処理された文字で表示してくれます。

液晶モニタを拡大

液晶モニタは小さな画素がたくさん並んで構成されています。一般的な液晶モニタではその画素一つ一つが、さらに(左から)R, G, Bの3つのサブピクセルで構成されています。

この液晶独特の性質を生かしてRGB各サブピクセルの強弱でアンチエイリアスを表現してくれるのがサブピクセルフィルタ(サブピクセルレンダリング)です。簡単に言うと、今までより横解像度が3倍になった感じでしょうか。WindowsのClearTypeやFlashのFlashTypeで話題なりましたがたぶん同じ原理だと思います。

このアンチエイリアス処理は、スクリーンショットを撮って拡大してみると違いがよくわかります。

自動 - 主ディスプレイに最適

自動 - 主ディスプレイに最適

自動で接続したモニタに最適な設定を選んでくれます。たぶん。液晶モニタしか持ってないので、他のモニタを接続したときにどう変るのかよくわかんないです。ウチの場合は、グレーのアンチエイリアス処理になりました。

標準 - CRT に最適

標準 - CRT に最適

グレーのアンチエイリアス処理された文字で表示してくれます。昔からある普通のアンチエイリアスです。

弱

サブピクセルフィルタによるアンチエイリアス処理された文字で表示してくれます。
アンチエイリアスのかかり具合は弱めです。

中 - フラットパネルに最適

中 - フラットパネルに最適

サブピクセルフィルタによるアンチエイリアス処理された文字で表示してくれます。
アンチエイリアスのかかり具合は「弱」に比べ若干強めです。

強

サブピクセルフィルタによるアンチエイリアス処理された文字で表示してくれます。
アンチエイリアスのかかり具合は結構強めです。文字が太って見えます。

といった感じです。

サブピクセルフィルタによるアンチエイリアスな文字を拡大

サブピクセルフィルタによるアンチエイリアス処理された文字の場合、黒線の左側は赤色、右側は青色のトーンで描画されているのがわかります。

横方向のアンチエイリアス

これは、白(RGB全点灯)→黒(RGB全消灯)の境界線のときは一番右のB(続いてG)から消えていき、最終的に一番左のRが残るからだと思われます。黒(RGB全消灯)→白(RGB全点灯)の境界線はその逆です。

縦方向のアンチエイリアス

一方、黒線の上部と下部は、普通のグレートーンでのアンチエイリアス処理されています。サブピクセルは横に3色並んでいるため、縦方向には適応できないのが原因だと思います。

サブピクセルフィルタは、液晶モニタに最適化された機能であって、CRTモニタだと変えって見づらくなってしまいます。印刷物だと版ズレっぽく見えてしまうかもしれないので、仕事などでスクリーンショットを扱う作業では気をつけた方がいいと思います。

とか言いつつ、面倒くさいので、このサイト上でのスクリーンショット画像はサブピクセルフィルタなアンチエイリアスのままです(笑)


Top Prev Next