2014年11月7日

写真に奥行き感のある文字を入れられるアプリ

先日、写真に奥行き感のある文字を入れられるiOSアプリがリリースされました。無料ですので、皆さん是非ダウンロードしましょう。App Storeはこちらです。アプリのレビューはこちらのサイトが非常に分かりやすいです。
アプリで画像を選び、文字を入力、パースの基準となる2本の線を指で引くとその線の間に文字が挿入されます。非常に簡単な操作でパース感のある文字を入れることが出来ます。以下はInstagramにアップした画像の元画像(Instagramのフィルターのかかっていない、アプリから書き出した状態の画像)です。画像内のテキストは全て当アプリで入れたものです。

MEAD GUMDAMとか、


パース感と言えばヤマト、とか、


前に家でMadMapperで遊んでた時の画像とか。


ガンダムの手前でなく背景にMEADの文字がある様にするには有料(100円)のマスク機能を使います。マスクモードでガンダム部を塗り塗りするとその塗った部分には文字が描画されない様になります。文字自体を消している訳ではなく、マスク領域を指定しているだけので、後でフォントを変えたり文字位置を調整しても同様にガンダムの部分に文字がかからない様になります。
下の画像はマスク機能を使用している状態のスクショです。文字を半透明にして下の画像を見える様にし、マスク領域は薄い赤で表示されるので文字色も赤以外にしておくと良いでしょう。(現状、画像をかなり拡大してマスク機能をやっていると頻繁に落ちるので、こまめに保存しながらやった方がよさそうです。)


また、変形させた文字を入れるのはフォトショ等の画処理アプリでも出来ますが、本アプリの場合、文字を挿入した後、パースのラインに沿って文字をスライド移動すると文字の変形の基準となる消失点をキープしながら位置変更が出来る=パース感を保持する様に文字が自動変形されながら移動できるあたりが優れているポイントかと思われます。

例えば、下の画像の左の様に文字を入れたとします。で、右の画像がテキストをそのまま上にドラッグした状態。ほぼ水平だった文字のアンダーラインがかなり右上がりになる様に変形し、パース感が保たれる様に上に移動出来ています。


逆に下左の画像はパースラインの出ない、移動モードで文字を移動した場合。(右は上の右の画像と同じです。)上の画像左の文字の変形具合のまま、場所を移動出来る、いわゆるフォトショ等の移動と同じ移動です。この場合だと移動後に改めて右の画像の様なパース感になる様に自分で再調整する必要がありますが、画像のパース感等とは無関係に文字の場所を移動したい場合はこちらの方が良いでしょう。



以上、簡単ですが久々のオススメアプリのご紹介でした。

2014.11.15. 追記・・・上のBRADBURYビルの例では文字が立った状態での上下移動でしたが、地面に文字を書く様な、文字が寝ている場合の左右移動も同様なのでアップしておきます。

まずはこの様に立方体の上に文字が書いてある様に文字をレイアウト。


で、そのままの状態で文字をドラッグし、隣の立方体の上まで移動。文字のパース感が保たれたまま移動出来てます。「文字のパース感」に特化したアプリならではかと思います。


下メニュー右端の移動モードで同様の位置まで移動するとこんな。普通の移動でパース感は保持されません。


と言うことで、以下Instagramにアップした、地面に文字を入れた場合の作例です。

人。影部は人の文字を黒で入れ、透明度を上げ影っぽくしたものです。立ってる人との位置合わせが意外と難しいです。


INVADER。絵文字もいけます。ただ絵文字だと色が付いているので上の例の様な影的な使い方ができません。



ついでに最後に注意点を1つ。画像の解像度と書き出し時の文字の粗さについて。例えば下の様な文字をレイアウトしたとします。(0655のオープニングのニワトリを作ってみました。写真に文字の用途だけでなく、こういったタイポグラフィー的な遊びも出来るかと思います。)下地の黄色はオリジナルの色に合わせたいので、手抜きして0655のバナー画像の隅の方を正方形で切り出して使用しました。ですので画面に黄色くフル表示されていますが、実際の切り出しサイズは123x123pixelと非常に小さいです。で、下地の画像が粗かろうが、編集時の文字はピシッと見えるので、この状態で一所懸命文字をレイアウトしてカメラロールに書き出すと、、、


この様に粗々になります。もともと123x123pixelしかないので、文字もその解像度なりの粗さになってしまいます。ということで使用する下地画像はなるべく解像度の高い画像を使用する様にしましょう。


以上、このアプリの使用上の注意等の追記でした。