デザインを開発するという視点でお伝えするクリエイティブBLOG
Webデザインを構築するのに欠かせないCSS。基礎からアニメーションなどの特殊な効果まで、様々なことが行なえます。今回ご紹介するのは、そんなCSS構築の作業を手助けしてくれる、便利なWebツールまとめ「40 Free Web-Based Tools & Apps for Working With CSS」です。
Palettes | Flat UI Colors 280 handpicked colors ready for COPY & PASTE
オンライン上で手軽に様々な効果や設定を試し、導入することができるツールが40種類紹介されています。その中から幾つかおすすめのツールをピックアップしましたのでご覧ください。
詳しくは以下
Clippy — CSS clip-path maker
Clippyは画像を切り抜くフレームの形を自由に調整することができるWebツールです。星や丸などベースとなる図形を27種類の中から選ぶことが出来、自由に編集できます。
CSS Colour Gradients with GradPad, beautiful CSS color gradient generator for your designs
トレンドのグラデーションをCSSで表現できるWebツールです。背景にグラデーションを使いたいときなど、大きい面積でグラデーションを取り入れたいときに。
Trianglify.io · Low Poly Pattern Generator
流行のポリゴングラフィックをCSSで表現するためのツールです。目の細かさや角度、色味などをカスタマイズでき自由度も高いです。
最適なツールを利用することで、クオリティの高いコーディングを短時間で完結することができます。サイトには他にも活用する機会の多いWebツールが多数紹介されていますので、興味をお持ちになられた方は是非下記リンク先よりご覧になってみてください。
近年ネットワークの発達により、様々な障壁がクリアされ、会社に来て仕事をするということが一部では当たり前では無い世界がやってこようとしています。リモートワークの方法論など話題になり、出社せず自宅に居ながら仕事をするというスタイルが認知されつつあります。そんなリモートワークはデザイナーやクリエイターの方にはより、身近な働き方で実際そのような働き方をしている方も少なからずいるのではないでしょうか？今回ご紹介するのはそんな遠隔とのやりとりで仕事を行う、リモートワークに最適なWEBツールをまとめた「Remote Starter Kit」です。
さまざまな視点から集められたWEBツールはリモートワーカーだけでなく、他の働き方をメインとする方の業務効率化にも最適なものばかり。今回はその中からオススメのツールを3つご紹介しますので、ご覧ください。
詳しくは以下
(さらに…)
徐々に利用され始めてきているCSSの新しい規格CSS3。現状のCSSでは、不可能だった表現がコードのみで可能にしてくれる次世代の規格ですが、今回紹介するのはCSS3を利用してコーディングしていく、または勉強するのに役に立つWEBツールを集めたエントリー「Six Useful CSS3 Tools」。
数値を変えてデザインを確かめていけるものから、グラデーション表現の補助ツールなど様々なWEBツールがまとめられていました。以前Designdevelopで紹介したものもありますが、順に紹介したいと思います。
詳しくは以下
いくつものページをつなげる重要な役割を果たすボタンは、デザインにもこだわりたいもの。そこで今回紹介するのが、表現力の高いボタン素材を手軽に利用できるPhotoshopテンプレート集「35 Free “Call To Action” Button Templates (PSD)」です。
（Nice download button by Roy Pipeloi – Designmoo）
シンプルなデザインはもちろん、クオリティの高いボタンテンプレートばかりが35種類も紹介されています。中でも気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
写真やデザインなど、作品や仕事をオンラインで紹介する上で欠かせないのが、ポートフォリオサイト。今回ご紹介するのは、そんなポートフォリオサイト作りを手助けしてくれるフリーのウェブサイトテンプレート「25 Free HTML Website Templates For Zero-Cost Websites」です。
Apollo: One page HTML template for photographers – Freebiesbug
使いやすくクオリティの高いフリーのウェブサイトテンプレートが25種類まとめられています。中でも気になったテンプレートを幾つかピックアップしてみましたのでご覧ください。
詳しくは以下
選び方でデザインのイメージが変わってしまう程重要な役割を持つフォント。デザイン性の高い種類が多数配布されており、フリーで使用できるものもたくさん存在しています。そんな中今回紹介するのは、人気の高いデザインフォントを集めた「Most Popular Free Fonts In 2014」です。
2014年、人気の高いデザインフォントがまとめられています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
デザインの質感を出す上で汚れた表現というのグラフィックの表現の一つとして可使われますが、photoshopでテクスチャを使ってよりリアルに表現するまでもなくちょっとしたアクセントとして質感を出したい時に便利なのが今回紹介する「50 Stunning Free Grunge Vectors」です。
このエントリーではグランジを表現する時に役立つベクターデータセットが50収録されています。今日はその中から気になったベクターデータをいくつか紹介したいと思います。
詳しくは以下
季節のイメージに合ったデザインに仕上げるために、マッチするフォント選びもクオリティを高めるための重要な要素。そんな時に役立ってくれる、秋の落ち着いた雰囲気を演出するフリーフォントまとめ「Stunning Free Fall Fonts 2018」を今回は紹介したいと思います。
TUESDAY NIGHT – FREE SIGNATURE SCRIPT
かすれ調や手書き風、アンティーク風など秋をイメージさせる魅力的なフォントがまとめられています。気になったものをいくつかピックアップしましたので下記よりご覧ください。
詳しくは以下
Photoshopには様々な機能がありますが、中でも重宝されるのがブラシ機能。難しい表現も可能にしてくれるので活用している人も多いのではないでしょうか。そんな中今回は、写真やデザインにアクセントをつけたい時におすすめのフリーで使えるPhotoshopブラシ「Brushing Up: A Large Collection of Free Photoshop Brushes」を紹介したいと思います。
Ebullient| 9 Painting Brushes by desperatedeceit on DeviantArt
様々なテイストのブラシが紹介されています。中でも気になったものをいくつかピックアップしてみましたので、以下よりご覧ください。
詳しくは以下
軽量で高機能なjavascriptライブラリjQueryですが、今回紹介するのはWEBレイアウトに使えるjQueryプラグインを集めた「15 jQuery Plugins for Better Web Page Element Layouts」です。
最近よく見かける、カラムが自動的に組み変るものだったり、文字の回りこみだったり、カラムの高さを揃えたりと様々なWEBレイアウトに効くjQueryプラグインが集められています。今日はその中からいくつか気になったものを紹介したいと思います。
詳しくは以下
WEB制作の現場で利用されているjQuery。非常に軽量かつ、高機能なjavascriptライブラリで、世界中で様々なプラグインがリリースされていますが、今日紹介するのは2011年にリリースされた、使えるjQueryプラグインをまとめたエントリー「The 50 Most Useful jQuery Plugins from 2011」です。
全部で50ものプラグインがまとめられていますが、今日はその中から特に気になったものを紹介したいと思います。
詳しくは以下
キッズや女性向けのデザイン制作によく利用されるドット柄ですが、配色やパターンによって与える雰囲気も大きく変わります。そんな中今回紹介するのが、どんなデザインにもぴったりな一枚が見つかる、さまざまなドットパターンをまとめた「100+ Free Polka Dot and Circle Patterns for Stylish Designs」です。
Seamless Colorful Grunge Polkadot Patterns | WebTreats ETC
カラフルなドットから、手書き感のかわいいドットまで、さまざまなパターンが紹介されています。中でも気になったものをいくつかピックアップしましたので、下記よりご覧ください。
詳しくは以下
旅行を計画している時に参考にするトラベル系サイト。情報が豊富なだけに、見やすさや分かりやすさには気を配りたいものです。今回はそんな時に参考にしたい、観光と旅行をテーマにしたフリーアイコンセットまとめ「13 Tourism & Travel Icon Set For Free Download」を紹介したいと思います。
Dribbble – Free Circle Icons: Transportation Add-on by Kenny Sing
乗り物や旅行アイテムなど、旅を感じさせてくれるアイコンセットが紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。
詳しくは以下
