さまざまなデザインシーンで使用されるタイポグラフィ。種類はもちろん、表現の仕方にもいろいろな方法がありますが、今回紹介するのはクリエイティブなインスピレーションを与えてくえれるタイポグラフィグラフィック集「50 most brilliant typography designs for inspiration」です。

(Children of the idiom on the Behance Network)
個性溢れる表現のタイポグラフィを使ったグラフィック作品が多数紹介されています。その中でもいくつか気になったものを紹介いたします。
2018年 新年あけましておめでとうございます。
2017年は自身の仕事環境も大きく変化したこともあり、多忙を極め、ブログを一時期アップできないなど、今後のDesigndevelopのあり方について考えさせられた年となりました。結果的にはやはり、少しでも多くの情報を届けていきたい、また自身にとってのクリエイティブリソースを高めていきたいという想いが強くあり、定期的に更新ができる環境を整えることができました。
webの流行と共に、毎年デザインのトレンドや、システム開発技術などどんどんと進化を遂げており、1年前に最新とされていたものが古く扱われてしまうなど、スピードの早い業界にいて、次はどんなものが登場するのかを今からとても楽しみにしています。
2018年も同様に、最新の情報を皆さまにお届けできるよう努めていきたいと思いますので、ぜひ今後もご覧頂けますと嬉しく思います。
今年もDesigndevelopをどうぞよろしくお願いいたします。
さまざまな描写表現ができるイラストレーターは、デザイナーにとってなくてはならないもの。その表現の幅も非常に広いため、使いこなせていないと感じている方も多いのではないでしょうか。今回はそんなシーンで参考にしたい、イラストレーターを使ったベクター素材チュートリアル&テクニックまとめ「27 New Vector Illustrator Tutorials to Learn Design & Illustration Techniques」を紹介します。

How to create an engraved illustration effect in Illustrator – Transfuchsian
いろんな種類のチュートリアルやテクニックが紹介されており、どれも試してみたくなるものばかりが揃っています。気になったものをピックアップしましたので下記よりご覧ください。
詳しくは以下
まだまだ対応ブラウザの問題から、コーポレートサイトなどでは導入が難しいCSSですが、スマートフォンなど環境が整ってきたこともあり、利用し始めているという方も多いと思います。今日紹介するのは、角アール、シャドウなどCSS3を利用した表現を簡単に実装できるCSS UIフレームワーク「CSS3 Button UI」です。

予め、CSSが設定されており、簡単なクラスを割り当てるだけで、CSS3をのボタンを再現することができます。
詳しくは以下
コードの呼び出し例は以下のとおり。

上記は画像で貼り付けてありますが、マウスオーバーの処理もセットされていて、実用的に利用できそうです。その他にも角アールのものや文字の前に画像を表示させるものなどがセットされています。その他のデモは配布元の「CSS3 Button UI」からご覧ください。ボタンはCSS3でとお考えの方は是非どうぞ。
プログラムについてはそれぞれのジャンルごとに様々なサイトやブログでレビューやTIPSが公開されており、ソースコード自体を記載されています。今回紹介するのは、そんなソースコードをステップごとにわかりやすく閲覧させることができる、プログラムコードをスライダー形式で見せることができる「SPECTACLE-CODE-SLIDE」です。

行数が入り、かつ色分けされたよく見る埋め込まれたコード表示のままで、ステップを追って見せることが可能です。
詳しくは以下
デザイン制作に欠かすことのできないフォント自体にも、さまざまな種類のデザイン性を持つタイプがどんどん登場しています。そんな中今回は、さまざまなデザインに利用したい 9つのフリーフォント「Fresh and Free Fonts for January 2014」です。

(DK Fiebiger Eins font by David Kerkhoff – FontSpace)
形自体に個性が感じられるタイプのフォントがまとめられています。中でも気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
テクスチャの中でも定番として、非常に便利に利用できるペーパーテクスチャ。そのまま使用するのはもちろん、他の素材と組み合わせたり、ニュアンス的にパーツに素材感を出すために加工したりと、いろいろな使い方ができます。そんなペーパーテクスチャが12種セットになった「12 Paper Textures」を今回は紹介したいと思います。

非常にシンプルで、ベーシックなタイプのペーパーテクスチャがまとめられています。
詳しくは以下
非常に高機能なjavascriptライブラリとして、WEBではかなり利用されているjQuery。今回紹介するのはjQueryとCSSで制御するスライダー「Automatic Image Slider w/ CSS & jQuery」です。
この手のjQueryを用いたスライダーは数多く存在しますが、「Automatic Image Slider w/ CSS & jQuery」はHTML部分、CSS部分とてもシンプルに作られており、カスタマイズが非常に簡単に行なう事ができます。また動きの部分のjQueryもシンプルなので、カスタマイズもjavascriptを知らないというかたでも何となく分かる作りになっています。
詳しくは以下
多様化するwebデザインの中で、常に取り上げられるミニマルデザイン。シンプルなだけにアイデアやデザインクオリティの高さが求められます。そこで今回は、webデザインの参考になる、クリエイティブ性の高いミニマルデザインについての解説付きデザイン集「10 Minimal Website Design and Ideas」を紹介したいと思います。

一口にミニマルデザインといっても、テキストをメインに利用したページから、シングルページ、ワンビジュアルで魅せるデザインなど、クリエイティブ性はさまざま。そんなミニマルページをカテゴリーに分け、詳しく解説しています。
詳しくは以下