毎日コーディングでさまざまなコードを書くデベロッパーにとって非常に便利なスニペット。知っているだけで作業効率が格段にアップするもの。そんな方におすすめできる「30 Seconds of CSS」をご紹介していきたいと思います。 先進的な知識を多く取り込むためにも、基礎的な業務内容をいかに短縮して行っていけるかは非常に重要なポイント。デベロッパーの方はぜひ下記よりチェックしてみてください。 詳しくは以下 レイアウト、アニメーション、インタラクティビティ、その他といったようにカテゴライズされており、それぞれのジャンルに分類されたコードがわかりやすく記載されています。デモもすぐ閲覧できるようになっており、使いたい要素を探しやすいのも魅力。奇抜なものはありませんが、基本として使いたい、ぜひ知っておきたいものが揃っているので、日々のコーディングに非常に役立ってくれそうです。 コードを書く手間を短縮す

TOP  >  Font  >  グラフィックデザイナーのためのおしゃれなフリーフォント「21 Fresh Free Fonts for Graphic Designers」 デザインの良し悪しの決め手ともなるフォント選び。デザイナーにとって重要なアイテムとなるので、様々なジャンルに対応できる最新のフリーフォントは必見です。そんな中今回紹介するのは、グラフィックデザイナーのためのおしゃれなフリーフォント「21 Fresh Free Fonts for Graphic Designers」です。 MINDFULLY – FREE CALLIGRAPHY FONT — Pixel Surplus | Resources For Designers 柔らかな印象を与えてくれる手書きフォントから、スタイリッシュに決まるものまで、21種類のフリーフォントを紹介しています。 詳しくは以下 Typoli

ログインをもっと快適に オープンソースのログインフォーム10選「10 Open Source Login Pages Built With HTML5 & CSS」 会員登録ページや管理画面へのアクセスに使用するログインページ。シンプルなものが一般的ですが、こだわりを見せることでサイトのクオリティは高まります。今回はそんな時に参考にしたい、オープンソースのログインフォーム10選「10 Open Source Login Pages Built With HTML5 & CSS」を紹介したいと思います。 Sign in 10種類の、それぞれ個性をもったログインフォームがピックアップされています。 詳しくは以下 Login Form ログインフィールドにドロップシャドウがかかった、フォームやボタンのエッジが丸い、柔らかい印象のフォーム。フラットテイストなトレンド感を感じさせるデザインですね。

オンラインショップをテーマにしたWordPressのテンプレートまとめ「25 Free eCommerce WordPress Themes for No Cost Online Stores」 昨今、誰でもオンラインショップを開くことができるようになりました。個人オーナーの雑貨屋ではオンラインショップの開設も珍しくありません。プロモーション方法の一つであるWEBサイトはかっこいいものをつくりたいもの。そんなシーンで役立つWordPressのテンプレートまとめ「25 Free eCommerce WordPress Themes for No Cost Online Stores」をご紹介します。 Leto: Free Ecommerce WordPress Theme – aThemes オンラインショップで必要な機能もついたテンプレート。下記にいくつかピックアップしているので、チェック

高度な技術を習得できる便利なPhotoshopチュートリアル「32 New Photoshop Tutorials – Learn Essential Techniques」 Photoshopを自在に操ることができると様々な場面で役に立ちます。高度な合成技術があれば、まるで1枚の幻想的な写真であるかのような作品が出来上がります。今回紹介するのは、高度な技術を習得できる便利なPhotoshopチュートリアル「32 New Photoshop Tutorials – Learn Essential Techniques」です。 Create Hot Air Balloon Adventure Photo Manipulation in Photoshop – PSD Vault 比較的簡単な写真の加工から、高度な合成の手順まで様々なチュートリアルが紹介されています。 詳しくは以下 Burge

制作時に役立つillustratorのチュートリアル「Illustrator Tutorials: 35 Fresh and Useful Adobe Illustrator Tutorials」 デザイナーはイラストレーションやフォントの処理など様々なテクニックが求められます。高度な技術を求められた時、チュートリアルがあるととても便利です。今回紹介するのは、制作時に役立つillustratorのチュートリアル「Illustrator Tutorials: 35 Fresh and Useful Adobe Illustrator Tutorials」です。 Create a Shattered 3D Geometric Text Effect in Adobe Illustrator – Vectips 初心者にも役立つ基本的な操作から、高度な技まで幅広くチュートリアルが紹介されています

TOP  >  Design , WebDesign  >  ウェブサイト開発に関するアイコンセット「Smashing Freebies: Website & Development Icon Set」 文字で記されているだけの情報よりも、絵で表現されている方が、理解が早くできることもあるはず。そんな中今回紹介するのは、ウェブサイト開発に関するアイコンセット「Smashing Freebies: Website & Development Icon Set」です。 サイトの表現を分かりやすく簡単に表現しているフリーのアイコンセットです。 詳しくは以下 POPなカラーリングで作られたアイコンが特徴的なアイコンセットは、言葉で表現することが難しい内容を分かりやすくしてくれています。png、ai、svg、epsとデータ形式も豊富ですので、用途にあった形式で使用することが可能。もちろんカラーの編集

魅力的なブログ制作に！ベストなフリーTumblrテーマ20選「20+ Best Free Tumblr Themes For Powerful Blogging in 2017」 写真や動画を気軽にシェアしたり、テキストを投稿できるTumblrは、手軽にブログを始められる人気のサービス。フリーのテーマを使えば、既存のブログサービスよりもおしゃれでデザイン性の高いブログを手軽に始めることが可能です。今回ご紹介するのは、そんなブログに最適なおしゃれなフリーのTumblrテーマをまとめた「20+ Best Free Tumblr Themes For Powerful Blogging in 2017」です。 20+ Best Free Tumblr Themes For Powerful Blogging in 2017 ブログのデザインにもこだわりたいと言う方にぴったりな、ハイクオリティなT

80年代を思わせる、どこかレトロな幾何学的デザイン。今期も引き続き人気で、多くのデザインシーンで使用されています。そんな中今回紹介するのは、幾何学的なデザインを簡単に生成できる素材セット「Neo Memphis Megaset」です。 92種のベクターパーツとオリジナルの34種のポスターがセットになった、ネオンなビビットカラーもとても印象的な素材となっています。 詳しくは以下 図形やドット、ラインなど、さまざまな形をしたモノクロの図形を組み合わせてオリジナルの幾何学デザインが作成できます。またポスターはどれも完成された独特のバランス感が個性的で、このままグラフィックとして使用すれば、見ている人を惹きつける、非常に印象的なビジュアルになりそうです。 こういった非常に個性あふれるアート要素の強いグラフィックを、一から起こすのはなかなか困難なもの。素材を使うことでより簡単に、かつ、今まで自分の中

テンプレートからアクションまで デザインに使えるフリーのPSD素材まとめ「30 New Useful Free Photoshop PSD Files for Graphic Designers」 デザイン業務の時短やコスト削減など、いざという時に役立ってくれるのがテンプレートやアクションなどの素材。そんな使えるデザイン素材は、常に最新のものを手に入れておきたいものです。そんな中今回ご紹介するのは、そんな使える最新のPSD素材をまとめた「30 New Useful Free Photoshop PSD Files for Graphic Designers」です。 30 New Useful Free Photoshop PSD Files for Graphic Designers | Freebies | Graphic Design Junction 紙からWEBまで広く使えるPSD

デザインは使うフォントでイメージがガラリと変わります。メインとなるタイトルには印象的なフォントを使ったり、読ませる部分には可読性の高いものを使うなどシーンで使い分ける必要があるので、フォントの選定はとても重要となります。そんな中今回紹介するのは、近未来を表現したデジタライズフォント「Kid A – Free Font」です。 処理を加えることで多彩な表現が可能なデジタライズフォントです。 詳しくは以下 ドットを組み合わせたようなデジタライズフォントは一見、可読性に欠けるように見えるかもしれませんが使い方一つでちょっと昔のゲームやパソコンの表示画面のような表現をすることもできます。色を重ねたり、処理を加えることでより近未来的な雰囲気にすることも可能なフォントですので、自由度の高いアイテムです。様々な背景色や写真、イラストと合わせて使用してみてはいかがでしょうか。 Kid A – Free F

TOP  >  WordPress  >  2018年にリリースされた良質なWordPressテーマ「10 of the Best WordPress Themes for 2018」 Webサイトを構築する上でWordPressは、サイト作成や更新が今までのツールよりも簡単にできる点でもとても魅力的なツールです。今回紹介するのは、2018年にリリースされた良質なWordpressテーマ「10 of the Best WordPress Themes for 2018」です。 TheGem – Creative Multi-Purpose High-Performance WordPress Theme by CodexThemes 様々なシーンで活用できるWordpressテーマが数多く紹介されているまとめです。 詳しくは以下 BeTheme カスタマイズ可能な300種類以上のテーマが揃

TOP  >  Design , WebDesign  >  カラフルでポップなセール用ベクターセット「Free Colorful Sales Vector Set For Designers」 紙で制作しなくてはならない場面が多いものの一つである“セール”のデザイン。目を引くデザイン性が求められるポイントですが、カラフルにしたり装飾をつけるなどしていると、ついまとまりがなくなってしまいがちなのではないでしょうか。そんなシーンで役に立つ「Free Colorful Sales Vector Set For Designers」を今回はご紹介していきます。 ビビットカラーが映える今時のデザインが多く収録されています。 詳しくは以下 ビビットカラーと相性の良いメンフィスを取り入れたデザインもあり、今時のトレンドを取り入れたポップな演出をしてくれるベクターセット。多種多様な色味を使いつつも目立た

TOP  >  WebDesign  >  シルエットから切り替わるダイナミックなスライドショー「Silhouette zoom slideshow」 スマートフォンやタブレット端末が普及する中で多くの人がWebサイトを閲覧するようになりました。数多く存在するサイトの中でより目を惹くためにもメインビジュアルの表現は重要になってくるのではないでしょうか。そんな中今回は、シルエットから切り替わるダイナミックなスライドショー「Silhouette zoom slideshow」を紹介したいと思います。 インパクトのあるスライドショーで印象に残るサイトが構築できるアイテムです。 詳しくは以下 人物のシルエットから次の写真へと切り替わるスライドショーはダイナミックで、とても印象に残る表現です。色鮮やかな写真にくっきりと浮かぶシルエットがなんとも美しいですね。 数え切れないほどのWebサイトが存在する

TOP  >  Design , Font , WebDesign  >  ヴィンテージなヒップスターを演出できるフォントをまとめた「20 Hipster Fonts You Can Download For Free」 シンプルかつシックなデザイン性で根強い人気を誇るヒップスター。ファッションはもちろんのことトレンドのマテリアルデザインと相性がいいこともあり、Webにも取り入れられつつあります。そんなレトロさを演出してくれるフォント集「20 Hipster Fonts You Can Download For Free」をご紹介致します。 Rising Star Monoline Script — discover Pixelbuddha Plus design resources library トレンド感を出すことができるフォントが20種類もまとめられています。 詳しくは以下 Yum

高い技術を活かしたデザインがどんどん進化する中、アナログな手描きのデザインは常に根強い人気を誇っています。そんな中今回紹介するのは、水彩の草花の風合いが美しいイラストセット「Botanical Garden Watercolor Set」です。 ボタニカルテイストの植物イラストをセットでダウンロードすることができるようになっています。 詳しくは以下 繊細な雰囲気を持ちつつも、力強いはっきりとした色合いの水彩使いが特徴。イエロー、ネイビー、グリーン、レッドなどの色合いで統一されており、抽象的ではなくリアルな質感が表現されています。そのままグラフィック要素として使ったり、化粧品など女性をターゲットとした美しさを強調するデザインの素材にしたりと、イラストが主役となって作品や商品を演出してくれそうです。 素材はpng形式。使い方次第でいろんな表現ができると思いますので、気になった方はぜひチェックし

アプリには必要不可欠なアイコン。テキストよりもアイコンで伝えることが多く、ほとんどのユーザーもアイコンで直感的に機能を理解して操作を行うことが多いのではないでしょうか。それくらい重要なアイコンを探している方におすすめできる、「140+ Free Vector UI Icons (SVG)」を今回はご紹介していきます。 複数のテーマにわけられてシリーズ展開されているアイコンまとめになります。 詳しくは以下 146個のアイコンがまとめられており、SVGで作成されているので編集も可能。音量や再生マークなどの音楽関係のアイコン、Wi-FiやBluetoothなどの電波に関するアイコンなどカテゴリ毎に展開されてまとめられているので、使用しやすいのポイントです。少し太めのラインですが、調整次第で雰囲気も変わっていくのでぜひ使用してみてください。 SVG以外にもPNGデータも収録されています。アプリ作成

TOP  >  Font  >  繊細なイメージ表現に活躍する 細身なフリーフォントまとめ「20 Free Thin Fonts for Elegant Designs」 フォントにはいろいろな種類がありますが、細身のタイプはデザインを繊細で美しく見せてくれる効果を発揮します。今回はそんな繊細なイメージ表現に活躍するフリーフォントまとめ「20 Free Thin Fonts for Elegant Designs」を紹介したいと思います。 Honeymoon PERSONAL USE font by Måns Grebäck – FontSpace フォント全体が細身なものから、強弱が付いた印象的なものまで、20種のフリーフォントがピックアップされています。 詳しくは以下 Goldoni font by sharkshock – FontSpace 繊細な中に、ベーシックな形状を保ったフォ

TOP  >  Design  >  男性の顔をカスタムできるイラストジェネレーター「Gentleman Character Generator」 自身のプロフィールやポートフォリオを作成する際に、顔写真を使用することがあると思いますが、中にはちょっと抵抗がある方もいらっしゃるはず。今回はそんな時に活躍してくれそうなカスタムできるイラストジェネレーター「Gentleman Character Generator」を紹介いたします。 さまざまなパーツを組み合わせて、オリジナルの男性の似顔絵を作り上げることができます。 詳しくは以下 用意されているのは、ベースとなる首から上の顔、目、髪型、髭、口元などの顔パーツ。衣服や帽子、メガネなどの服飾パーツ。また、それぞれのパーツは色選択も可能なので、組み合わせのバリエーションはかなりの量になります。日本人の顔といった印象ではないですが、ちょっと編集すれ

TOP  >  Font  >  グラフィックデザイナーのためのフリーフォント25種「25 Freshest Free Fonts for Graphic Designers」 デザイナーにとってフォントの選定は重要な作業です。しかし、フリーフォントが数え切れないほど多く存在する中からイメージにあったフォントを探し出すのは案外大変なこと。そんな時に役に立ってくれるのが今回紹介する、グラフィックデザイナーのためのフリーフォント25種「25 Freshest Free Fonts for Graphic Designers」です。 TERM – | FREE FONT | on Behance 様々なテイストのフォントが集約されたサイトは時間短縮にもつながる、便利なサイトです。気になった方は是非チェックしてみてください。 詳しくは以下 Bodrum – Font on Behance 丸みのあ