few lines


長い文章で表現できます

今回は、前回のone lineに続いて、few lines(複数行)になります。
one line は比較的アイキャッチに向いた構成でしたが、few linesでは文字いっぱいに映るので、少し向いてないかもしれないですね。
上のサンプルにあるような、飾りだけの英語を並べるだけならかっこいいとは思うのですが。

なので、今回のfew lineは新しく、メッセージカードとしての利用を提案したいと思います。
ACTIVE-FRAMEはコードを埋め込む方法以外にも、URLから参照する方法もあります。
好きな文字列をフォームに記述し、URLボタンを押して下さい。
新しいタブで先ほど作成した画像が表示されるかと思います。

あとは、そのURLリンクをSNSなどで友達に送るだけです。
簡単に、デジタルなメッセージカードとして利用できますよね。
それと上のサンプルは英語で書かれていますが、もちろん日本語も書くことができるので安心して下さい。

デザインについて

使う側の人で気になる方もいるかと思うので、今回作成したfew linesの具体的なデザイン面の仕様を書いていこうと思います。

まずフォントについてですが、下記のように指定しています。'Avenir','Helvetica Neue','Helvetica','Arial','Hiragino Sans','ヒラギノ角ゴシック',YuGothic,'Yu Gothic','メイリオ', Meiryo,'MS Pゴシック','MS PGothic',sans-serif
基本的にはAvenueHelveticaですが、表示するデバイスに搭載されていなければ、左側から順に選ばれるようになっています。

続いて、文字の配置についてです。
cssで事前に中央寄せを行なっているので、左寄せにはなりません。
短い文章でも、真ん中に表示されますし、デザイン的にもそっちの方がいいのかな、と思っています。

最後に縦横比ですが、これはACTIVE-FRAME全体で統一していて、360×200になっています。
比率で言えば、9:5ですね。
おそらくこの先ずっと変えることはないかと思います。

タイポグラフィーを取り入れる

タイポグラフィーとは、テキストの配置やフォントを意識し、文字をデザイン要素として扱う手法のことを言います。
僕はタイポグラフィーが好きで、このサイトやACTIVE-FRAMEにタイポグラフィーの考え方をよく取り入れています。
文字を主体にするこのデザイン手法は、シンプルでありながらも、奥が深く様々な印象を与えることができます。

なかでも、文字を使うだけあってよく見られるのが、知的な印象を与えるものです。
だからでしょうか、雑誌、コーヒー、酒、タバコ、これらのパッケージにはタイポグラフィーがよく用いられていますが、どれもある程度対象年齢が定まっていますよね。
やはり、全年齢に向けた商品とは違って、制限されたものだからこそできるデザインというのがあるのだと思います。
僕は、タイポグラフィーは洗練されていて、とても魅力的に感じるのですが、みなさんはどうでしょうか。

最後は自分の好きなものを話しただけでしたが、このデザイン手法は最近の傾向でもあります。
つまり、シンプルであることです。
最近ではミニマルデザインやフラットデザインという、言葉がよく聞かれるようになりました。
それは少しでも複雑さを無くしたデザインがweb上で表現するのが楽であるだけでなく、デジタル化が進んだ社会では情報を複雑に表現する必要がなくなったためでもあります。

技術や環境が変われば、人間も変わるので時代に合ったデザインが必要になってきますね。
そのためにも、文字で表現するシンプルなデザイン手法であるタイポグラフィーはこれから注目されてくるのではないでしょうか。