サイト構築 -実装
デザイナーは持っておきたい！デザインにぴったりなフォントが簡単に見つかる、無料でダウンロードできるモリサワ Font Map
Post on:2020年8月5日
Webデザインや紙デザイン、ロゴ、ポスター、同人誌などにぴったりなフォントが欲しい時、どのように探していますか？ フォントの一覧を順番に見て探すのはなかなか大変です。 そんな時にはフォントを体系的に探せる、モリサワから無 […]
WebページやスマホアプリのUIデザイン・モックアップが簡単に！Adobe XDのプラグイン「Spectrum」が便利
Post on:2020年8月4日
WebページやスマホアプリのUIデザインで、一貫したコンポーネント・テーマ・カラー・タイポグラフィ・アイコンなどを作成・管理できるAdobe XDの無料プラグイン「Spectrum」を設計したAdobeのデザインシステム […]
CSSでさまざまなスタイルのボタンを簡単に実装できる！モジュール式の拡張可能なCSSライブラリ -Knopf.css
Post on:2020年8月3日
Webページやスマホアプリで使用するボタンをモジュール式の拡張可能なCSSで実装されたライブラリを紹介します。 通常のボタンのさまざまなスタイルだけでなく、アイコン付きボタン、ブロック状のボタン、リフレッシュボタン、グル […]
Webページでよく使用されるレイアウトに役立つCSS Gridの実装テクニックのまとめ
Post on:2020年7月30日
CSS Gridを使用して、Webページでよく使用されるレイアウトやコンポーネントの実装で起きる問題を解決する実装テクニックを紹介します。 Modern CSS grid solutions to common layo […]
デザイナーのための言い訳集
Post on:2020年7月28日
デザイナーが困った時、インスピレーションやデザイン、フォント、カラー、デザインツール、プレゼンがうまくいかなった時、メールで問題が発生した時、まだ始めてないのか聞かれた時などに使える（かもしれない）言い訳を紹介します。 […]
CSSで美しいシャドウをつけるbox-shadowの古い書き方とこれからの書き方
Post on:2020年7月27日
CSSで美しいシャドウをつけるbox-shadowの書き方を紹介します。 少し大きめのシャドウを適用し、ネガティブに縮小させることで、通常のシャドウより少しだけ彩度が高くなり、要素がくっきり見えます。 Saturated […]
プレゼンで使ってみたい！横棒グラフのデータ変化をアニメーションで表示するオンラインツール -Bar chart race
Post on:2020年7月27日
SNSやテレビなどで見かける、横棒グラフの変化をアニメーションで表示するオープンソースのオンラインツールを紹介します。 データは.csvにも対応しており、誰でも簡単に利用できます。 値の変化が非常に分かりやすく、プレゼン […]
2020年、知っておくと便利なCSSのプロパティのまとめ
Post on:2020年7月21日
ChromiumベースのEdgeもリリースされ、最近のブラウザ状況は大きく変わってきました。知っておくと便利なCSSのプロパティを紹介します。 一昔前まではJavaScriptでないと実装できなかったもの、CSS Gri […]
CSSでロゴのようにサイズが異なる画像を美しく揃えて配置するスタイルシートの実装テクニック
Post on:2020年7月16日
ロゴ画像のようにさまざまなサイズ、さまざまな形の画像を美しく揃えて配置するスタイルシートのテクニックを紹介します。 CSSのテクニックだけでなく、デザイン上の注意点も解説されており、実装時の参考になります。 Aligni […]
React、Angular、Vue対応、高性能なテーブルを実装できるシンプルで軽量のJavaScriptライブラリ -Grid.js
Post on:2020年7月15日
高性能なテーブルを実装できる、シンプルで軽量のJavaScriptライブラリを紹介します。HTMLテーブル、ページネーション、検索機能、ソート機能、XMLやJSONからインポートなどに対応しています。 React、Ang […]
sponsors
