« タイムリーなのでメモ。「CSSは進化が早く、中央揃えのテクニックも一昔前のものよりも確実に使いやすくなっています」「要素の幅や高さが可変だったり、要素の数が増えても対応する最新の実装テクニック」。
CSSの中央揃えで、最も万能で信頼できる実装テクニック | コリス
Category Archives: デザイン / UIUX
最近のロゴのデザインに使われている、2021年に注目しておきたいトレンドのまとめ -Logo Design Trends 2021 | コリス
« なるほど。「デザイナーは複雑なパターンや複雑なフォントを削除し、その代わりにさまざまなサイズやデバイスに対応できるミニマルなデザインを選択」。
「WEB屋しか使わない単語だから…」サイトの上にある押すとメニュー出てくる3本線のアイコンは「ハンバーガーメニュー」というらしい – Togetter
« 3本線のヤツ、の方が通る。「一般的な用語じゃ無かった」「使ってる人には全く浸透してない」「点々が9個のをワッフルメニュー」。
最新の手法でブラウザのタブに表示される「Favicon（ファビコン）」を作成するとこうなる – GIGAZINE
« あとで試す。「SVG画像を用いることを推奨」「最新の手法では画像サイズに合わせて大量のファビコンを用意する必要がなく、非常に簡単にファビコンを作成することが可能」。
商用利用OK！2020年にリリースされた無料フォント40 | Webクリエイターボックス
« マメロンは良く見るようになったかも。日本語フォント、ありがとうございます。「どれも無料でダウンロードでき、商用利用可能なものです。みなさんのお気に入りが見つかると幸いです」。
とあるデベロッパーが、JavaScriptだけでどのようにしてAirDropを再現したか | コリス
« 意味がわからないよ…（褒め言葉）。「タップ・クリックするだけで他のデバイスと簡単にファイルを共有できるAirDropをJavaScriptだけで再現したその仕組みを紹介します」。
CSSのスクロールスナップの便利な使い方、実装の注意点を徹底解説 | コリス
« おさえておかねば。「CSSのスクロールスナップについて、基礎知識をはじめ、各プロパティの機能や使い方、スクロールスナップの実際の使用例、実装の注意点などを紹介します」。
【総まとめ】2020年公開のすごいPhotoshopチュートリアル、作り方厳選まとめ – PhotoshopVIP
« すごいね…。「ボタンひとつで完成のお手軽写真やアクション、合成テクニックなど、デザイナーが覚えておくと便利な人気のデザインスタイルのつくり方がずらり揃います」。
UXにおけるビジュアルデザインの5つの原則 ｜ U-Site
« 読んでおかねば。「ビジュアルデザインの原則に従うと、使いやすいレイアウトになることが多い」「ユーザーはデザインが視覚的に魅力的であると感じると、ユーザビリティ上の些細なミスに寛容になる」。
ヴィンテージデザインの時代ごとの使い方や特徴、無料素材のまとめ | コリス
« 勉強になります。「19世紀のヴィンテージスタイルを中心に、その時代ごとのデザインの特徴と使い方を紹介します。合わせて、個人・商用で無料・有料で利用できるデザイン素材・フォントもご紹介」。
ChromeのアップデートでGoogleフォントがページ読み込みのボトルネックになるという指摘 – GIGAZINE
« おさえておく。「ブラウザキャッシュがサイトごとに分離されることになり、同一のリソースをロードする場合でもサイトが異なれば再度ロードが必要になりました」。
2020年のCSSのまとめ、FlexboxやCSS Gridの使用状況、よく使用するプロパティや単位、人気のフレームワークやツールなど | コリス
« CSS、ヤバい（歓喜）。「CSSを10年以上書いてきた人にとって、この2020年は今までとは全く違ったCSSになったと感じた人も多いと思います」。
CSSでテキストが1行に収まるときだけ中央寄せする：Zenn
« どこかで使いたい。「ときどき1行に満たないテキストは中央寄せしたいが、1行以上になる場合は左寄せしたいことがある。CSSだけで簡単に実現できる」「inline-blockの代わりにinline-flexを使ってもOK」。
フォントが大好物な人は要チェック！2020年、日本語の新作フリーフォントのまとめ | コリス
« 日本語フォント、ありがとうございます。マメロン、すごい。「2020年もあと残り1ヵ月、今年リリースされたひらがな・カタカナ・漢字が使える日本語の新作フリーフォントを紹介」。
Webページやスマホアプリでよく使用される代表的な5つのレイアウトをCSS Gridで実装するテクニック | コリス
« どこかで試す。いろいろとやってみたい。「CSS Gridを使用すると、今まで少し複雑だったレイアウトもシンプルなコードで簡単に実装できます」。
サイトの利用規約に要約をつけてUXを向上する | UX MILK
« 確かに。「サイトの利用規約は、もっと理解しやすくあるべきです。そうしなければ、ユーザーがサイトを間違った方法で使ったり、法律に違反したり、知らないうちに他のユーザーに損害を与えたりすることがありえます」。
複数のアイコンプロジェクトから、使用するアイコンだけをアイコンフォントやSVGのセットにできる無料ツール | コリス
« メモ。「例えば、Bootstrapからホームとアローだけをセットにするとか、BootstrapのホームとMaterial Designのアローをセットにするとかも簡単」。
Responsive Height Design -レスポンシブを高さの観点から、Webサイトやスマホアプリの実装で役立つテクニック | コリス
« あとで確認する。「レスポンシブを高さの観点から考慮した、Webサイトやスマホアプリの実装で役立つCSSのテクニックを紹介します」。
Adobe Photoshopで目映いばかりの金ピカを手に入れろ！あらゆる被写体をゴールドにする無料アクション | コリス
« 自宅が金の茶室に…。「数クリックとしたのは被写体の選択操作で、金ピカにするのはわずか1クリック。簡単に、目映いばかりの黄金エフェクトを楽しめます」。
CSS GridをChrome デベロッパーツールで検証、デバッグする方法を解説 | コリス
« あとで確認する。「このガイドでは、Chrome デベロッパーツールでWebページ上のCSS Gridを検証し、レイアウトの問題をデバッグする方法を解説します」。
最近のアイコンが似通ってきている問題 | デザイン会社ビートラックスブログ
« 前半の議論も良いけど、後半のデザイン機軸の変遷まとめもありがたい。「現在のグラデーションデザインにたどり着くまでにどのようなデザインスタイルがあったのかをさくっと振り返ってみる」。
CSSの変数（カスタムプロパティ）便利な使い方を詳しく解説 | コリス
« 頭の整理に。「カスタムプロパティの基礎知識、便利な使い方を詳しく解説。Webページやスマホアプリのレイアウト、コンポーネントなど、実際の使用例がたくさんあるので、実用的なテクニックが満載」。
Googleが提供しているサービスのアイコンが統一性のあるデザインに変更された結果「視認性なんとかして」「アイコンの意味が」と嘆くみなさん – Togetter
« 老眼に厳しい…。「キャプションも途中で省略されちゃうから余計わからんやん」「slackあったら気づかないのでは」。
iOS 14のデザインテンプレート・UI要素が揃ったAdobe XD用の素材がApple公式からリリース | コリス
« メモ。「素材はAdobe XD用だけでなく、Photoshop用やSketch用も揃っており、9月に新しくなったSF Symbols 2もダウンロードできます」。
デザイナーのノブ「足らんのよ解像度が」「CMYKで作業せえ！」「リッチブラックのリッチが過ぎる！」 – Togetter
« すごい。脳内再生の度合いがヤバい。「めちゃくちゃ脳内でノブさんが喋りよる」「首がもげそうなほど頷いている」「エンジニアのノブもあらわれそう」。
無料でブラウザから3Dモデルが簡単に作れる「SculptGL」を使ってみた – GIGAZINE
« これが無料で使える時代、すごいね。「3Dオブジェクトを彫刻のように削ったり膨らませたりできる」「無料かつアカウント登録やソフトウェアのダウンロードなしで使用できるウェブアプリ」。
Photoshopが進化！新しいCC 2021の便利な新機能まとめ（空を置き換え、ニューラルフィルター） – PhotoshopVIP
« やってみたい。「今回は、新しくなったPhotoshop CC 20201を実際に使いながら、チェックしておきたい便利な新機能をまとめてご紹介」。
アクセシビリティを意識したUIライティング | UX MILK
« 勉強になります。「動作を表すマイクロコピーではなく、『決める』『選ぶ』『考える』のように、インターフェイスに関係ない行動を説明するような、デバイスを選ばない言葉を使ってみてください」。
iPhone 12で、ビューポートのサイズの種類が増えすぎ！デバイスの複雑さがUIの設計にどのように影響するのか | コリス
« おさえる。「ビューポートのサイズの種類が増え、多くの解像度、アスペクト比、断片化が進むデバイスの複雑さがUIの設計にどのように影響するのか」。
Web制作の面倒な作業におさらば！便利な最新オンラインツール30個まとめ – PhotoshopVIP
« 便利そうなのでメモ。「これらのツールやサービスを利用すれば、これまで面倒だった作業も手軽に、そして短時間で行うことができ、普段のワークフロー改善にもつながります」。