• Category Archives: デザイン / UIUX

面倒な配色もこれなら簡単に!多くの人に見やすいUI用のカラースケールを生成する無料ツール -Geenes | コリス

面倒な配色もこれなら簡単に!多くの人に見やすいUI用のカラースケールを生成する無料ツール -Geenes | コリス
«  良さげ。「最近増えてきた同系色のカラーでホワイトやブラックを加えたりリーダビリティやコントラストなどのアクセシビリティもチェックすることができます」。
    

独学でUIデザインを勉強する方法を自分の経験をもとに考えてみた|Sano Aoi / デザイナー|note

独学でUIデザインを勉強する方法を自分の経験をもとに考えてみた|Sano Aoi / デザイナー|note
«  これはありがたいまとめ。「内容は初心者にわかりやすいというのを大事に、かなり簡素化して書いております。とりあえず4STEPにわけてみました」。
    

HTML標準仕様の策定についてW3CとWHATWGが合意 今後はWHATWGのリビングスタンダードが唯一のHTML標準仕様に – ITmedia

HTML標準仕様の策定についてW3CとWHATWGが合意 今後はWHATWGのリビングスタンダードが唯一のHTML標準仕様に - ITmedia
«  覚えておく。「W3CはHTMLとDOMに関する標準策定をやめ、今後はリビングスタンダードがHTMLとDOMの唯一の標準となります」。
    

SVGやCanvasで実装した平らな要素を3Dモデルでレンダリングできる超軽量JavaScriptライブラリ -Zdog | コリス

SVGやCanvasで実装した平らな要素を3Dモデルでレンダリングできる超軽量JavaScriptライブラリ -Zdog | コリス
«  どこかで試したくなるヤツ。「レンダリングされた形状は3D空間に存在するかのようにクリックやドラッグなどで操作ができます」。
    

モバイルコマースを成功させるWebデザイン6つのヒント スマホから買い物をする時代に売上げを伸ばすには|SeleQt

モバイルコマースを成功させるWebデザイン6つのヒント スマホから買い物をする時代に売上げを伸ばすには|SeleQt
«  頭の整理に。「視覚的に魅力的なオンラインショッピングの体験を求めている」「セキュリティとユーザーエクスペリエンスを常に意識してください」。
    

失敗をきちんとデザインするということ | UX MILK

失敗をきちんとデザインするということ | UX MILK
«  大事。「これらの会社は、自分たちのすべての経験を考え抜き、何かがうまく行かないときにはユーザーをサポートしたいと思っています」「もしユーザーに失敗させてしまったら、その影響を最小限にすることを考えるのがよい」。
    

2019年最新版!最近見かけるロゴのデザインに使われているトレンドのまとめ -2019 Logo Trends | コリス

2019年最新版!最近見かけるロゴのデザインに使われているトレンドのまとめ -2019 Logo Trends | コリス
«  おさえねば。「デザインの引き出しを増やすためにもトレンドを押さえておくことは大切。タイポグラフィ、カラー、形など、基本となる要素が詰まった最新のトレンド」。
    

ブサイクなUIデザインを劇的に改善するための10のチェックリスト|Taiki IKEDA|note

ブサイクなUIデザインを劇的に改善するための10のチェックリスト|Taiki IKEDA|note
«  ありがたいまとめ。「基本的には数字で結果が出ればそれが正義なのですが、『なんか胡散臭そう』という印象を与えないためにもある程度はUIビジュアルの質は担保しておきたい」。
    

私があえて紙でワイヤーフレームを描く理由 | UX MILK

私があえて紙でワイヤーフレームを描く理由 | UX MILK
«  今でもこの点で紙は最強やと思っとる。「紙のワイヤーフレーミングは、チームメンバーやステークホルダーを含め、優れたデザインを作成するためのパワフルで作業時間の短縮が可能な、とっかかりやすいスキルです」。
    

[CSS] 両端に余白があるコンテナをページの中央に配置する古い実装方法と最近の実装方法 | コリス

[CSS] 両端に余白があるコンテナをページの中央に配置する古い実装方法と最近の実装方法 | コリス
«  勉強になります。「ここ数年で増えてきたレイアウトです。この内側のコンテナを実装するさまざまな方法、それぞれの利点と欠点、解決方法を紹介します」。
    

グラフィックデザインの2019年最新トレンド15選 デジタルアートで好まれる手法とは?|SeleQt

グラフィックデザインの2019年最新トレンド15選 デジタルアートで好まれる手法とは?|SeleQt
«  なるほど、わからん。「2019年のグラフィックデザインのトレンドを短い言葉で説明すると『退屈と落胆の反意』でしょう。一言で言うなら、印象です。 トレンドは明るさ、そして驚きです」。
    

CSSでアニメみたいに文字や画像を真っ二つ、斜めに斬るスタイルシートのテクニック | コリス

CSSでアニメみたいに文字や画像を真っ二つ、斜めに斬るスタイルシートのテクニック | コリス
«  コリスさんのナチュラルなコメントが良い。るろ剣は偉大。飛天御剣流デザインとか。「左上からなので天翔龍閃とは違うのですが、袈裟斬りの感じがかっこいいです」。
    

使える最新フリーフォント素材56個まとめ 2019年5月度 – PhotoshopVIP

使える最新フリーフォント素材56個まとめ 2019年5月度 - PhotoshopVIP
«  日本語フォント、ありがとうございます。「2019年に人気トレンドとなっている高級感のあるセリフ書体や、万能サンセリフ書体、(中略)ブラシフォントなどフリーフォントが揃います」。
    

UXデザイナーがゲームのUIから学べること | UX MILK

UXデザイナーがゲームのUIから学べること | UX MILK
«  ちょうど先週のランチで話題になったトピック。「ゲーム業界の数十年に及ぶユーザーフレンドリーなUIへのこだわりが、UIを学びたいと考える人に多くの教訓を提供する先進的なUIを生み出すための土壌となったのです」。
    

Chrome、Safari、Firefox、Edge 各ブラウザごとのデフォルトのスタイルシート、user agent stylesheetのまとめ | コリス

Chrome、Safari、Firefox、Edge 各ブラウザごとのデフォルトのスタイルシート、user agent stylesheetのまとめ | コリス
«  大切!「そのページを表示するブラウザが各HTML要素にデフォルトでどのようなスタイルが適用されているか知っておくのは大切」。
    

最近のWebページ用にCSSリセットの効果的な使い方、Normalize CSSとReset CSSそれぞれの利点を取り入れる | コリス

最近のWebページ用にCSSリセットの効果的な使い方、Normalize CSSとReset CSSそれぞれの利点を取り入れる | コリス
«  ありがとうございます。「2大CSSリセットとも言えるNormalize CSSとReset CSSの特徴、それぞれの利点を取り入れて安心して使用」。
    

Adobe、プログラミング向け無料フォント「Source Han Mono(源ノ等幅)」をリリース – 窓の杜

Adobe、プログラミング向け無料フォント「Source Han Mono(源ノ等幅)」をリリース - 窓の杜
«  一般で使いたい。「立体と斜体の2スタイル、日本・中国・台湾・香港・韓国の5言語、7つのウェイトをサポートした70のフォントから成るOTCとして公開」。
    

Webデザイナーの制作現場で役に立つ18の無料ツール | UX MILK

Webデザイナーの制作現場で役に立つ18の無料ツール | UX MILK
«  ですよね。「たくさんの便利なデザインツールがある中では何かをゼロから作り出すほうが難しいと言えます。ですが、短期間に仕事を終えることが求められるこの世界で役立つツールを利用しない手はありません」。
    

東急、東武、JR東でフォントの旅を始める – ITmedia

東急、東武、JR東でフォントの旅を始める - ITmedia
«  いつも勉強させてもらってます。「デザインの豊富さと複雑なしくみに改めて驚かされる。同時に、運行管理や保守という点からだけでなく『フォントやデザインのメンテナンス』という点でも考えさせられることが多い」。
    

美しく見える構図の法則 2019年度版 人々の心を惹きつける写真編集9つの極意|SeleQt

美しく見える構図の法則 2019年度版 人々の心を惹きつける写真編集9つの極意|SeleQt
«  頭の整理に。「これらの構成テクニックを組み合わせて、それがどのように作用するかぜひあなたの目で確かめて下さい。より有意義にするために写真編集を使うのも一つの方法です」。
    

デザイン的に合う色の組み合わせを指定されたカラーをベースに生成する無料ツール -Color Designer | コリス

デザイン的に合う色の組み合わせを指定されたカラーをベースに生成する無料ツール -Color Designer | コリス
«  ありがとうございます。「色の組み合わせを簡単に自動で生成できるオンラインツール。カラーのセンスがなくても、デザイン的に合った組み合わせが分かります」。
    

浮世絵や日本画も!世界の名画500万枚を無料ダウンロードできる美術館サイト総まとめ【2019年版】 – PhotoshopVIP

浮世絵や日本画も!世界の名画500万枚を無料ダウンロードできる美術館サイト総まとめ【2019年版】 - PhotoshopVIP
«  これはありがたいまとめ。「著作権の消滅したパブリックドメインの作品が中心なので、クレジット表記なしで無料ダウンロード、二次創作での利用が可能です」。
    

モバイルデザインのために再確認すべきヒューリスティック原則 | UX MILK

モバイルデザインのために再確認すべきヒューリスティック原則 | UX MILK
«  大事。「つねにユーザーのニーズから始めてください。ユーザーが何を必要としているのかわからないと、正しいプロダクトを作ることはできない。リサーチし、データを分析し、ユーザーと会話してください」。
    

便利だが仕事が奪われてしまうかも?AIによって生成された架空の人物の顔写真を、素材サイト「写真AC」が無料素材として提供開始!写真素材ガチャを楽しむ人も – Togetter

便利だが仕事が奪われてしまうかも?AIによって生成された架空の人物の顔写真を、素材サイト「写真AC」が無料素材として提供開始!写真素材ガチャを楽しむ人も - Togetter
«  なるほど。「実在しない人の顔写真なので後から写真使用の許可を撤回されるといったトラブルがない」。
    

[CSS] position: sticky を使用して、スクロール時に画像をズームさせるページのレイアウトを実装する方法 | コリス

[CSS] position: sticky を使用して、スクロール時に画像をズームさせるページのレイアウトを実装する方法 | コリス
«  どこかで使う。「スティッキーヒーローセクションとは、画像などをスクロールした際に固定し、その固定された画像の上にスクロールさせるコンテンツ要素」。
    

レスポンシブ スマホ対応の軽量で読み込みが早いCSSフレームワーク20選 デザインの大枠はこれで完成|SeleQt

レスポンシブ スマホ対応の軽量で読み込みが早いCSSフレームワーク20選 デザインの大枠はこれで完成|SeleQt
«  便利そうなのでメモ。「いくつかはモジュラーアプローチを使用しているので、特定のプロジェクトに必要なアイテムだけを選ぶだけでいいのです。是非つかってみてください」。
    

Remove.bgからWin、Mac、Linux対応のアプリがリリース!複数画像の切り抜きもドラッグ&ドロップでまとめてできる優れモノ | コリス

Remove.bgからWin、Mac、Linux対応のアプリがリリース!複数画像の切り抜きもドラッグ&ドロップでまとめてできる優れモノ | コリス
«  な、なんだってー。「単体アプリなのでブラウザもPhotoshopも不要。しかも、複数の画像を背景だけを画像から切り抜くこともできます」。
    

意匠法改正が変えるWebサイトリリース・リニューアルのプロセス | Web担当者Forum

意匠法改正が変えるWebサイトリリース・リニューアルのプロセス | Web担当者Forum
«  覚えておかねば。「その9つの要件をクリアできるWebデザインをできるデザイナーは少ないと考えます。だからこそ、意匠権を獲得できるだけのデザインをできるWebデザイナーの価値が上がります」。
    

【第3弾】少しのコードで実装可能な15のCSS小技集 | Webクリエイターボックス

【第3弾】少しのコードで実装可能な15のCSS小技集 | Webクリエイターボックス
«  これはありがたいまとめ。「これまではJavaScriptで実装していたものがCSSだけで実現できるようになったりと、進化が凄まじいです。初心者さんからベテランさんまで要チェック」。