• Category Archives: デザイン / UIUX

著作権フリー素材がスゴすぎ…広重や夢二も全部無料 国立国会図書館の試み|まいどなニュース

著作権フリー素材がスゴすぎ…広重や夢二も全部無料 国立国会図書館の試み|まいどなニュース
«  ありがとうございます。「美術館や書籍で鑑賞するイメージがある日本画や伝統文様を身近な日用品にアレンジできる!?利用登録も申請もなしで誰でも利用できる」。
    

Webデザインの有料学習サイトが無料化 IllustratorやPhotoshop入門などが見放題 – ITmedia

Webデザインの有料学習サイトが無料化 IllustratorやPhotoshop入門などが見放題 - ITmedia
«  興味深い試み。「無料公開を決めたのは同サービスの運営から手を引くため。現在は全レッスンの無料公開と共に、有料サービスの利用者に対して返金対応を行っている」。
    

無料&面倒な操作なしで写真の切り抜きが簡単にできる「PhotoRoom」を使ってみた – GIGAZINE

無料&面倒な操作なしで写真の切り抜きが簡単にできる「PhotoRoom」を使ってみた - GIGAZINE
«  便利そうなのでメモ。「モバイルアプリだけでなくウェブアプリ版もあり、ユーザー登録なしでも使えるツールとなっています」「画像をアップロードしてわずか数秒で切り抜きは完了」。
    

全ての都立校でAdobe導入 デザイン、Webページ、動画などの製作に活用 – ITmedia

全ての都立校でAdobe導入 デザイン、Webページ、動画などの製作に活用 - ITmedia
«  三つ子の魂作戦。「東京都立の小中学校、高等学校、特別支援学校などで、デジタルツールを活用した表現力やコミュニケーション力を身につけるための教育環境整備の一環として導入」。
    

コピペできる!Webサイトがかっこよくなる最新HTMLスニペット38選 – PhotoshopVIP

コピペできる!Webサイトがかっこよくなる最新HTMLスニペット38選 - PhotoshopVIP
«  あとで試す。「CSSのあまり知られていない小技テクニックから、2022年のWebデザイントレンドを意識したスニペットや、魅力的なアニメーションなどがずらり揃います」。
    

これだけは押さえよう!住所フォームの作り方 – ケンオールブログ

これだけは押さえよう!住所フォームの作り方 - ケンオールブログ
«  ありがたいまとめ。見直してみる。「入力フィールドを少なくする」「何をどう入力したらいいかユーザーに伝わるよう、ラベルに適切な名前と例を表示する」「可能な限り柔軟に入力を受けつける」。
    

無料で商用利用可能なフラットデザインのイラストを好きな配色でゲットできる「IRA Design」 – GIGAZINE

無料で商用利用可能なフラットデザインのイラストを好きな配色でゲットできる「IRA Design」 - GIGAZINE
«  あとで試す。使いたい。「ウェブサイトや資料などで簡単なイメージイラストを使いたい時に、30種類のイラストを自分で配色を決定してダウンロードできる」。
    

CSSの便利ツールが登場! レスポンシブ対応のフォントサイズを超簡単に定義できる -Modern Fluid Typography Editor | コリス

CSSの便利ツールが登場! レスポンシブ対応のフォントサイズを超簡単に定義できる -Modern Fluid Typography Editor | コリス
«  どこかで試す。「font-sizeの最小値と最大値とその間の値を流動的にするclamp()を使用すると簡単に定義できます」。
    

2022年、Webデザインの新しいトレンド「クレイモーフィズム」のスタイルをさまざまな要素に適用できるCSS | コリス

2022年、Webデザインの新しいトレンド「クレイモーフィズム」のスタイルをさまざまな要素に適用できるCSS | コリス
«  どこかで試す。「クレイモーフィズムはデザインの新しいトレンドで、クレイ粘土みたいなもこもこの質感にシャドウを加えてフラットなデザインに奥行きを与えます」。
    

2021年にCodepenで話題!コピペ可なHTMLスニペット ベスト100発表 – PhotoshopVIP

2021年にCodepenで話題!コピペ可なHTMLスニペット ベスト100発表 - PhotoshopVIP
«  ありがたいまとめ。「2021年に特に人気の高かったHTMLスニペットをランキング形式でのまとめが発表されていたので、その中でも実用性の高いHTMLスニペットを中心に紹介しています」。
    

Web制作を変える!2021年の便利オンラインツール・ベスト100選 – PhotoshopVIP

Web制作を変える!2021年の便利オンラインツール・ベスト100選 - PhotoshopVIP
«  便利そうなのでメモ。「2021年に公開された便利なWebオンラインツール・ベスト100個+をまとめてご紹介」「カテゴリごとに整理しているので目的にあったツールを探してみましょう」。
    

新しい日本語フォントがたくさんリリースされてる!2021年、日本語の新作フリーフォントのまとめ | コリス

新しい日本語フォントがたくさんリリースされてる!2021年、日本語の新作フリーフォントのまとめ | コリス
«  日本語フォント、ありがとうございます。「2021年フォント界の大きなニュースは、Google Fontsに大量の日本語フォントが追加されたことです」。
    

Adobeが誰でもデザイン系コンテンツをサクッと作成できる「Creative Cloud Express」を発表したので使ってみた – GIGAZINE

Adobeが誰でもデザイン系コンテンツをサクッと作成できる「Creative Cloud Express」を発表したので使ってみた - GIGAZINE
«  便利そうなのでメモ。「無料プランではクラウドストレージの容量が2GBに、利用できるコンテンツの種類は数千種類に制限されています」。
    

世界一のパッケージを決める!ペントアワード2021受賞作品まとめ – PhotoshopVIP

世界一のパッケージを決める!ペントアワード2021受賞作品まとめ - PhotoshopVIP
«  日本のもあります。見ることしかできんけど見るのは好きです。「パッケージを破くと、水しぶきが飛んでいるように見えるユニークなツナ缶のパッケージ」「岩手初!東北初のクラフトコーラ」。
    

モダンCSSでよく使用されるレイアウトを実装するまとめ | コリス

モダンCSSでよく使用されるレイアウトを実装するまとめ | コリス
«  どこかで使う。タイムリーかもなのでメモ。「CSSの実装はデバイスベースからコンテンツベースに移行しているのが現状です。これからのプロジェクトに役立つCSSのテクニックを解説します」。
    

わずかな時間で驚くほどWeb制作がはかどる最新オンラインツール43個まとめ – PhotoshopVIP

わずかな時間で驚くほどWeb制作がはかどる最新オンラインツール43個まとめ - PhotoshopVIP
«  便利そうなのでメモ。「コピペで利用できるお手軽CSSツールやSVGツール、コード知識不要のノーコードツール、色に困ったときに便利な配色ツールなど」。
    

【CSS】box-shadowでリアルな影を作成できる便利ツールまとめ – PhotoshopVIP

【CSS】box-shadowでリアルな影を作成できる便利ツールまとめ - PhotoshopVIP
«  どこかで使う。「今回は、手軽な設定のみで、魅力的なドロップシャドウを作成できるオンラインツールをまとめてご紹介。簡単なクリック操作で、本物そっくりなリアルな影を作成できますよ」。
    

まだ使ってる?今は非推奨となったJavaScriptの書き方 | Webクリエイターボックス

まだ使ってる?今は非推奨となったJavaScriptの書き方 | Webクリエイターボックス
«  var、お前だったのか…。「varは、同じ変数名が複数あってもエラーとして検知されなかったり、ブロックスコープに対応できないなど、意図しないバグが発生しやすい仕様となっています」。
    

CSSでメディアクエリはもう必要ないかも -メディアクエリなしで実装するテクニックのまとめ | コリス

CSSでメディアクエリはもう必要ないかも -メディアクエリなしで実装するテクニックのまとめ | コリス
«  どこかで使う。「サイトやアプリをレスポンシブ化するためにメディアクエリに頼っているのであれば、新しい流動的なアプローチで実装ができないか検討する時期かもしれません」。
    

任意のWebサイトで画像が最適化されているかを調べるCloudflare製のチェックツール「Image Optimization Test」 | かちびと.net

任意のWebサイトで画像が最適化されているかを調べるCloudflare製のチェックツール「Image Optimization Test」 | かちびと.net
«  あとで試す。「画像の総重量、ページロード時間、LCPや、ファイル形式をavifに変える事でどれくらい軽量化できるかなどを提示」。
    

ブラウザで編集できる「Photoshop」と「Illustrator」登場 コロナ禍でもコラボしやすく – CNET

ブラウザで編集できる「Photoshop」と「Illustrator」登場 コロナ禍でもコラボしやすく - CNET
«  へー。「web版はベータ版の位置付けで、共有や閲覧、レビュー、簡単な編集などがウェブブラウザから可能。アプリのダウンロードや起動不要で、基本的な編集はできる」。
    

Adobe、Webベースのチーム管理「CC Web」複数人でファイル共有や編集が可能に – ITmedia

Adobe、Webベースのチーム管理「CC Web」複数人でファイル共有や編集が可能に - ITmedia
«  2022年から順次提供予定とのこと。「制作物をリアルタイムにチームと共有、簡単な編集作業をWebブラウザで行える。全てのCreative Cloudツールで作成したデータに対応」。
    

よくあるWeb制作の試練をCSSで解決!スゴ技テクニック40選まとめ – PhotoshopVIP

よくあるWeb制作の試練をCSSで解決!スゴ技テクニック40選まとめ - PhotoshopVIP
«  どこかで使う。中央寄せは永遠の課題。「ここで紹介されているCSSテクニックを利用すれば、これまで頭を抱えていた問題や課題も、一発で解決できるかもしれません」。
    

リンクやボタンなどに使えるピュアCSSアニメーションのコレクション・「Annimay」 | かちびと.net

リンクやボタンなどに使えるピュアCSSアニメーションのコレクション・「Annimay」 | かちびと.net
«  どこかで使う。「52種のアニメーションと12のループアニメーションが用意されています。この手のスタイルシートはいくつもあるので選択肢の一つとして覚えておく感じでしょうか」。
    

Figmaでデザインする時に作業効率がアップする便利なテクニックのまとめ | コリス

Figmaでデザインする時に作業効率がアップする便利なテクニックのまとめ | コリス
«  便利そうなのでメモ。「これらのテクニックのほとんどは、デザインシステムや巨大なデザインファイルを扱う場合に理想的ですが、Figmaでの日常的な作業にも適しています」。
    

CSSのaspect-ratioプロパティがすべてのブラウザにサポートされました、画像をアスペクト比で実装する今までとこれからの実装方法 | コリス

CSSのaspect-ratioプロパティがすべてのブラウザにサポートされました、画像をアスペクト比で実装する今までとこれからの実装方法 | コリス
«  あとで試す。「aspect-ratioプロパティを使用することで、レスポンシブ対応の画像をアスペクト比を維持したまま簡単に実装」。