Adobe XDがどんどん便利になってる！Web制作に使える無料素材のまとめ
先週のCreative Cloudアップデートで、Adobe XDが正式版としてリリースされました。Adobeユーザーはもちろん、Windowsがメイン環境の人にもUI/UXデザインの本命と言えるでしょう。 昨日のAdobe Creative Cloud道場のライブ動画ではAdobe XDの近い将来の機能として、タブレット用のレイアウトを作成したら、人工知能Adobe Senseiでスマホ用の複数のレイアウト候補を自動作成し、あとはそこから選び出せるようになるとのことです。作業には時間をかけず、クリエイティブに時間をかけることができますね。 Adobe XDでWebサイトやスマホアプリを制作する際に役立つ、ユーザーフローやワイヤーフレーム、グリッド、スタイルガイド、UIコンポーネントなどの無料素材を紹介します。
ダミー画像生成の真打ちとも言える高性能がすごい！オンラインなのにオフラインでも利用できてしまう -satyr.io
ダミー画像の無料サービスはいくつかありますが、真打ちとも言える高性能なダミー画像が利用できる無料オンラインサービスがリリースされました。 ダミー画像はレスポンシブ対応、可変画像や高さが不揃いの画像にも対応しています。しかもオンラインなのにオフラインでも利用できてしまう優れものです。
進化が止まらない！CSS3アニメーションを簡単に利用できるスクリプトやスタイルシートのまとめ
スクロールをトリガーに要素をアニメーションで表示したり、ページを表示した時にちょっとしたエフェクトを加えたり、ボタンのホバー時に気持ちいいアニメーションを加えたり、CSS3のアニメーションを簡単に加えることができるリソースを紹介します。 Story Box Story Box -GitHub スクロールをトリガーに54種類のアニメーションを簡単に実装できるjQueryのプラグイン。アニメーションは非常に軽快で、デモ：ユニークの派手なアニメーションでも快適です。 ScrollMagic ScrollMagic -GitHub Appleのプロダクトページのように次々に要素を表示したり、簡単にパララックスを加えたり、特定の要素をスクロール時にピンで留めて表示したりなど、スクロール系のエフェクトは全部できてしまう感じです。 スマフォなどレスポンシブ対応はもちろん、水平スクロール、無限スクロール、
最新版！WordPressのブログやサイトの運営に役立つプラグインのまとめ
WordPressのデザイン、記事の投稿、コンテンツ配信、検索エンジン最適化、メンテナンス、バックアップ、セキュリティ、パフォーマンス、アンケート、ショッピング機能など、ブログやサイトの運営に役立つWordPressのプラグインを紹介します。 WordPress Plugins We Use プラグインは、海外のWeb制作系ブログ「CSS-Tricks」で実際に利用されている厳選プラグインで、それをなぜどのように使用しているのか非常に参考になりました。 CAPTCHAはコメントではなく、管理画面のログインに使用しているとか、なるほどと思いました。 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様に許可を得て翻訳しています。 コンテンツ配信 検索エンジン最適化 メンテナンスとセキュリティ パフォーマンス デザインと記事の編集 パーミッションとモデレーション 販売 使
Bootstrapで日本語をより美しく表示させることにこだわった無料のテーマ -Honoka
Bootstrapは人気のフレームワークですが、日本語のコンテンツを表示するために最適化されているとは言えません。フォント指定・文字サイズをはじめ、日本語をより美しく表示するためのさまざまなアプローチを取り入れたテーマ「Honoka」を紹介します。 単に使用するだけでなく、他のものでも日本語を美しく表示させるのに役立ちます。 Honoka Honoka -GitHub 日本語フォントは、たくさんのフリーフォントがあります。 2017年用、日本語のフリーフォント 259種類のまとめ Honokaの特徴 Honokaのデモ Honokaのアプローチ -Bootstrapでの日本語表示最適化 Honokaの利用方法 Honokaの特徴 Honokaは、Bootstrapでより美しく日本語を表示させることにこだわったオープンソースのテーマファイルで、これをベースにWebサイトを作成したり、既にBo
Photoshopでアクションが使えない・途中で止まる場合の対処方法
Photoshopのアクションが英語版だと、使えない、途中で止まってしまうことがあります。その際の解決方法を記したので、困った時は参考にしてください。 英語版のアクションが途中で止まってしまう！ 更新 2020/11/11: CC 2021のリリースに合わせて、記事をアップデートしました。 英語版のアクションが途中で止まってしまう原因 PSDファイルを直す方法 PhotoshopのUIを英語に変更する方法 アクションを直す方法 英語版のアクションが途中で止まってしまう原因 Photoshopで英語版のアクションが途中で止まってしまう原因は、アクションが名前ベースで操作が設定されている場合です。例えば、あらゆる被写体をゴールドにする無料アクションで紹介したアクションを例に見てましょう。 Gold Effect.atnを実行、途中で止まってしまう このアクションの場合の原因は、 アクションでは
この作りこみはスゴすぎ！！ガーリーにかわいくデザインされたテクスチャ素材 -Missesglass
細部まで徹底的に作りこまれた、かわいくてキレイにデザインされたコラージュのテクスチャ素材を紹介します。素材の利用にあたっては、個人のみ無料で利用できます。 作者の方は、2015年3月で制作作業の休止宣言をしました。いつか再開したら嬉しいですね。 ※ダウンロードは、当面はこのまま続けるとのことです。
ガーリーなデザインにぴったり！かわいいフォントに飾り罫がセットになった無料素材 -Marema
かわいくデザインされたレトロ風のフォントとそれにぴったりなグラフィックエレメントや飾り罫がセットになった素材を紹介します。 通常は有料ですが今週末まで無料なので、ダウンロードはお早めに！
商用利用無料のおすすめフォント！視認性の高いシンプルなデザインが美しいフォントとかわいいフォント -GidoleとGidolinya
視認性が高く、シンプルですっきりしたデザインの「DIN」にインスパイアされて作成された商用でも無料で利用できるフリーフォント「Gidole」と「Gidolinya」を紹介します。 Gidoleはすっきりしたデザイン、Gidolinyaはカーブを緩くしたかわいいデザインです。
ブックマークしておきたい、Bootstrapの商用利用無料のテーマがダウンロードできるサイトのまとめ
コーポレートサイトやスモールビジネスから、ランディングページ、プロダクトページ、ポートフォリオやギャラリーなど、BootstrapをベースにしたWebページが簡単に作成できる無料のテーマがダウンロードできるサイトを紹介します。 テーマとして利用するだけでなく、制作のインスピレーションにもいいですね。 Peter Finlan 縦長ページにかっこいいスクロールエフェクトやアニメーションを加えた今時のWebページが実装できます。デザインも非常にかっこいいものが揃っています。
背景に使える！最近増えてきた新しいパターン素材のまとめ
背景にパターンやテクスチャを効果的に使うと、デザインの単調さが解消され、Webページ全体に厚みを加えることができます。 そのパターンも最近のトレンドでは新しいものが少しずつ増えてきました。幾何学パターン、イラスト、ローポリ、地紋、ラインやドットを使ったパターン素材をSubtle Patternsから紹介します。 Subtle Patterns Subtle Patternsは専用のプラグインを使うと、便利です。 Subtle Patterns PS Plugin Photoshop CS5+ から CC2014対応で、パネルからパターン素材が1クリックで利用できます。 $11.99と有料ですが、Subtle Patternsの新作素材をすぐに利用できるだけでなく、検索機能やお気に入りの登録もできるのでかなり重宝しています。 Subtle Patternsの新作を中心に人気のパターン素材を紹
ベビー服、ほ乳瓶、ベビーカー、クマちゃんなど、赤ちゃんグッズのかわいい無料アイコン素材
25 FREE Babies Icons ダウンロードできるアイコンのフォーマットは、2種類。 .psd .ai PhotoshopでもIllustratorでもOKです。
商用利用無料の飾りや小物のベクター素材が満載！ハロウィンのかわいいアイテムが揃った素材 -Halloween Vector Pack
商用利用無料の飾りや小物のベクター素材が満載！ハロウィンのかわいいアイテムが揃った素材 -Halloween Vector Pack
[JS]HTMLは汚さずに、テキストにちょっと面白いさまざまなアニメーションを適用できるスクリプト -LetterFX | コリス
Effect -LetterFx LetterFXの使い方 Step 1: 外部ファイル 当スタイルシート・スクリプトとjquery.jsを外部ファイルとして記述します。 <head> ... <link href="jquery-letterfx.css" rel="stylesheet" type="text/css" /> </head> <body> ... <script src="http://code.jquery.com/jquery.min.js"></script> <script src="tuxsudo.min.js"></script> <script src="jquery-letterfx.js"></script> </body> Step 2: HTML アニメーションを適用するテキストはp要素などで実装し、classやidなどを付与しておきます。 <p
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[CSS]2013年、素敵なアイデア満載のスタイルシートのテクニックのまとめ
デザインが楽しくなる良フォントがたくさん！ダウンロードしておきたいフリーフォントのまとめ -2015年2月
商用利用無料、漢字も使えるニコニコ動画のロゴっぽいかわいい日本語のフリーフォント -ニコモジ・プラス
ガーリーなかわいいフォントからシンプルなものまで、高品質な新作フリーフォントのまとめ -2014年10月
商用利用無料！漢字も使えるまるまる太ったかわいいフリーフォント -にくまるフォント
これ便利でいいね！WebページのUIエレメントのサイズやマージンが簡単に計れるChromeの機能拡張 -Dimensions
