フロントエンドエンジニアの多くの方は、自分が利用するエディタというのを決めているとは思いますが、緊急の時だったり、どうしても自分のPCが手元に無い環境でコードを書かなくてはいけないなんて事も極稀ではありますがあると思います。今回紹介するのはそんな、もしもの時のためのHTML、CSS、JSが同時に編集できるシンプルなオンラインエディタ「playcode.io」です。
この「playcode.io」非常にシンプルなツールで順番に左からコントロールパネル、HTML・CSS・Javascript、HTMLプレビューと並んでおり、結果を見ながらコーディングすることが可能です。
詳しくは以下
WEBを制作する際に非常に便利なのがアイコン。細部のクオリティを高めてくれたりユーザーインターフェイスを補完してくれたりと様々な役割を担っていますが、今回紹介するのはWEBで使えそうなミニアイコンを1000個セットにしたアイコンセット「Free Farm-Fresh Web Icons」です。
システム的なアイコンから、ユーザーサイドなものまで様々なアイコンがセットで公開されています。アイコンの配布サイズは16×16px、または32×32pxで個別もしくは1000個セットでダウンロードすることができます。下記に収録されているアイコンの一部を紹介したいと思います。
詳しくは以下
デザイン背景やパーツの背景となるパターンにこだわることで、デザインの質の向上につながりますが、一つ一つの素材を一から制作していくには、膨大な時間と手間がかかってしまい、作業効率が落ちてしまうということも多いかと思います。そこで今回紹介するのは、数あるパターンの中からストライプのパターンをまとめた「400+ Free Photoshop Stripe Patterns」です。
Stripes Collection by ~photoshop-stock on deviantART
カラフルなものから上品なパターン、またシックなものまで、400ものストライプパターンが紹介されています。中でも特に気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
いつものデザインにマンネリ気味、ひと味違った要素が欲しい。今回はそんな時に是非活用してほしい、8つの新しい個性的なフォント「8 Fresh Free Fonts for your Designs」を紹介したいと思います。
どのフォントも特徴がありクオリティが高い、デザインに効果的にアクセントを付けることができそうなものばかりが集められています。中でも気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
毎日無数のwebサイトが立ち上がっており、自由な発想から生まれるさまざまなデザインが注目を集めています。そんな中今回は、サイトとユーザーの直接的な繋がりとなる問い合わせフォームのデザインに力を入れているサイトを集めた「30 Inspiring Examples of Contact Forms」を紹介したいと思います。
手書き感のあるフォームデザインから、さまざまなアイテムをモチーフにしたフォームデザインまで、たくさんの種類が紹介されています。中でも気になったののをピックアップしましたので、下記よりご覧ください。
詳しくは以下
ゆらゆらと揺れ立ち上るスモーク(煙)は、決められた形がない分、作り出すのには高い表現センスが必要となってきます。そんな中今回は、スモークを簡単かつ手軽に作成できるPhotoshopブラシをまとめた「15 Free Abstract Smoke Brushes」を紹介します。
Abstract smoke by ~L4byrinth on deviantART
リアルなスモークを再現できるブラシが豊富に紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
クリスマスを間近に控え準備をされている方も多いかと思います。そんな中今回紹介するのは、クリスマスシーズンに最適なパターン集「100+ Seamless Christmas Patterns for Your Holiday Artworks」です。
(Transparent Christmas Patterns by ~slavetofashion69 on deviantART)
クリスマスをイメージさせる柄やモチーフ、カラーリングのパターンが100以上収録されており、さまざまなシーンで活用することができそうです。いくつかピックアップしてみましたので、下記よりご覧ください。
無料版として利用することができるフリーフォントは非常に便利な存在であり、デザイン性が高いものも数多く展開されています。そんな中今回紹介するのは、スタイリッシュなデザインのフリーフォント17種「17 New Stylish Free Fonts For Designers」です。
Harlott (Free Font) | artimasa
洗練された印象のデザインフリーフォントが紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
外へ出かける事なく服や家電、食品に至るまで、何でもネット上で買い物ができる時代。そんな中今回は、ショッピングサイトを運営する中で活躍してくれそうな素材「10 Free Open Source Responsive Pricing Table Designs」の紹介をしたいと思います。
オープンソースのプライステーブルデザインで、10種類ほどまとめられています。気になった素材をピックアップしてみましたので、下記よりご覧ください。
詳しくは以下
様々な表現を簡単にしてくれるphotoshopブラシ。様々なphotoshopブラシが公開されていますが、今回紹介するのは割れたガラスを表現するphotoshopブラシ「High-Res Photoshop Brushes for Creating Broken Glass Effect」です。
上記の通り、14個のひび割れたガラスのブラシがセットになっています。割れ方もそれぞれで、弾痕みたいなものから、派手に割られたものまで、様々なものが公開されています。
詳しくは以下
デザイン制作をしていると一日に何度もさまざまなフォントを試したり、イメージに合わせたフォントを作成したりと、毎日何パターンものフォントと向き合っている方も多いと思います。今回はそんなフォントの中からストライプ模様のフォントばかりを集めた「35 Eye-catching Designs of Striped Font」を紹介したいと思います。
PAWLUK ZIBRA font by Pawluk Ivan – FontSpace
可愛らしい雰囲気のフォントからデジタル感のあるフォントまで、さまざまなフォントが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下