配色パターン見本40選：ベストな色の組み合わせ確認ツール配色の使用例を確認しよう 気になる配色があれば、見本をクリック/タップしてみましょう。その配色の使用イメージを確認することができます。気に入った色の組み合わせはコピペして使って頂いて構いません。 万人受けする配色 まずはシーン問わず使いやすい色の組み合わせを紹介します。青や橙色などは老若男女問わず受け入れやすい色ですね。
エンジニアのための Figma 知識
本記事の多くは Inspect モードを前提に解説しています。 下記に Dev Mode に対応した解説を書いてみたのであわせてご参照ください。 https://codezine.jp/article/detail/18000 エンジニアにデザインツールの知識・習熟は必要か？ しなくても仕事はできると思うのですが、あるとよりクオリティの高い仕事ができることは間違いありません。 という訳でエンジニアがエンジニアとしての仕事をしていく上で「Figma のこういうことを知っておくと良さそう」という知識をまとめてみました。 ユースケースを考える まず始めにデザインは作らないはずのエンジニアが Figma を使う時にどんなユースケースがありそうかを考えてみます。 デザインを元に実装する時 デザインから何かを生成したい時(コードとか画像とか) 自分でちょこっとデザイン修正しちゃう この辺りがあるかな〜
なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】 - Qiita
なぜエンジニアが作る画面はダサいのか…?「理由」と「対策」を徹底解説【エンジニア向け画面デザイン講座】UXUIDesignUIデザイン画面設計 1.はじめに エンジニアの私がデザインを本気で勉強した結果、デザイナーとエンジニアはそもそも思考が大きく違っているということがわかりました。 今回は「それ」をデザインに苦手意識のあるエンジニア方にも理解してもらえたらと思い、わかりやすくまとめてみました。 2.アプリの画面デザインを考えてみよう まず、こんなアプリを考えてみてください。 フィットネストレーナーが使うアプリ トレーニングルームでお客様とお話しながら使う 端末はタブレット そして 会員の個人情報確認 前回までのトレーニング状況の確認 次回の予約受付 といったことをします。 使える情報としては、こんな感じです。 あなたならどう画面デザインをするか、もしお時間があったら考えてみてください。
「くそダサいデザインの表紙」がダサくなくなるまでの解説がわかりやすくてタメになる…フォントや配色、文字配置など参考になる情報も
デザインtips @tips_bot ゆるく初心者向けのデザイン解説とか書きます。 絵描きさん向けの役立ち情報も多い。なんか思いついた時に自分用のメモも兼ねて投稿しているので、お気軽に〜！
Googleが繰り返すデザイン変更からたどり着いた極意「明白こそが至高」について解説
by Rajeshwar Bachu GoogleはGoogle検索やGmailなどさまざまなプロダクトを作成していますが、そういったプロダクトをデザインする中で得た知見などをまとめるためのデザイナー・開発者たちによる共同プロジェクト「Google Design」が存在します。そのGoogle Designが、「明白なUIこそ至高のUIである」として、ユーザーインタフェース(UI)デザインにおいて重要な要素をまとめて解説しています。 The Obvious UI is Often the Best UI - Google Design - Medium https://medium.com/google-design/the-obvious-ui-is-often-the-best-ui-7a25597d79fd デザイナーはプロダクトができる限り使いやすく、可能な限り誘導的なものになるよ
ウェブ制作がすご楽に！便利な最新オンラインツール33個まとめ
この記事では、日常行っているWebデザインやグラフィックデザインの制作が格段スピードアップする、便利な最新オンラインツールをまとめてご紹介しています。 カテゴリ分けされたこれらのツールやサービスを利用することで、面倒な作業を自動化し、生産性をアップすることができるでしょう。一度使いはじめると「これなしじゃ考えられない。」、そんな便利ツールが揃います。 コンテンツ目次 1. デザインコレクション 2. イラスト系ライブラリ 3. モックアップツール 4. デザインからコードへの変換ツール 5. プロトタイプツール 6. 生産性アップツール ウェブ制作がすご楽！便利な最新オンラインツールまとめ デザインコレクション SVG Arista このツールはCSSコードを使って、アップロードしたSVGファイルのstrokeとfillプロパティのアニメーションを作成するAnimistaのスピンオフ・プロ
プログラマが知っているとよい色(1)使い(JIS安全色) - Qiita
<この項は書きかけです。順次追記します。> This section is about to be written. I will add it little by little. 目次の前に(forward) この記事は、インターンシップの大学生の方に、「ゲームはするよりもゲームプログラムを書く方が楽しい」ということを説明した際に、その説明の一部として書いたものです。ゲームを卒業研究の題材にするなら、ゲームの中での色使いで、人による見え方の違いに配慮した改訂のあったJIS安全色(国際整合：ISO 3864-4:2011(Graphical symbols−Safety colours and safety signs−Part 4: Colorimetric and photometric properties of safety sign materials))を参考にするとよいよとい
任天堂が新人研修で伝えている、あそび心のデザイン｜娯楽のUI 公式レポート #1 | キャリアハック（CAREER HACK）
任天堂の新人研修で語られているのは「あそび心を伝える」という大切さについて。『スーパーマリオメーカー』を例に、UI/UXデザインチーフである正木義文さんが語ってくれた。 [目次] ・「みなさんとクイズをしたいと思います」 ・任天堂流「伝え方」のこだわり ⅰ教えるよりも体験してもらう ⅱファーストインプレッションを大事にする ⅲ体験は面白く ・わかりやすさと高機能を兼ね備えた、UIのデザインプロセス ・「あそび心を伝えるUIデザイン」3つのポイント ⅰUI脳と娯楽脳の二人三脚 ⅱ短所を「娯楽脳」で長所へ変える ⅲ将棋3席 麻雀5席 「みなさんとクイズをしたいと思います」 ※ 2018年4月に開催された「UI Crunch #13 娯楽のUI - by Nintendo -」のレポート記事としてお届けします。 「まずは、みなさんとクイズをしたいと思います」 そんな、あそび心溢れる一言で幕を開け
U-site
システム状態の可視性（ユーザビリティヒューリスティックNo.1） ニールセン博士のAlertbox 7月3日 現在の状態を伝えることで、ユーザーはそのシステムをコントロールできていると感じ、目的達成のための適切な行動がとれるようになり、最終的にはそのブランドを信頼するようになる。 このサイトについて UXリサーチや市場調査の手法やコツ、結果や知見を紹介しています。 詳細 新記事公開は、Twitter・Facebook・RSSで随時、メルマガで月1回通知します。 Twitter Facebook RSS メルマガ 猫をUSEする? 黒須教授のユーザ工学講義 6月24日 読了までに約5分 usabilityの語源に含まれるuseを「使用」や「利用」と訳すのはすこし内容を限定しすぎだと思う。ペットとしての使い道のある犬や猫を飼育することは「使う」ことに入るのか入らないのかという話になる。
デザイン思考の基礎
デザイン思考とは何か。なぜそれに関心を持つべきなのか。ここでは、その歴史と背景に加え、簡単な概要と、6段階のプロセス図を提供する。実践的なユーザー中心の考え方による問題解決型アプローチがイノベーションにつながり、イノベーションを起こせれば、差別化ができ、競争上の強みを作り出せるようになる。 Design Thinking 101 by Sarah Gibbons on July 31, 2016 日本語版2016年11月1日公開 デザイン思考の歴史 デザイン思考が新しいものであるというのはよくある誤解だ。デザインという行為自体は長い間おこなわれてきており、モニュメントや橋、自動車、地下鉄のシステムはどれもデザインというプロセスから生まれた最終製品といえる。そして、昔から、優秀なデザイナーは人間中心の創造的なプロセスによって、意味のある、有効なソリューションを構築してきているからだ。 190
対応製品・ソリューション｜IoTネットワーク「Sigfox」｜KCCS
対応製品 デバイス、モジュール、プラットフォーム、CHIPS、アンテナ、DEVKITなど、Sigfoxに対応した製品をご紹介します。 対応製品一覧はこちら ソリューション Sigfoxに対応したソリューションをご紹介します。 見守り、物流・アセット、環境、設備・社会インフラなど幅広い分野で実用化の段階に入っています。 なお物流ソリューション、三密対策・熱中症予防ソリューション、開封検知ソリューションについては特設サイトもございます。あわせてご覧ください。 ソリューション一覧はこちら
都営地下鉄路線図の大江戸線を丸く表現したひと
都営地下鉄の駅や電車内に掲示してある、大江戸線が楕円で描かれたあの路線図は、東京にお住まいの方であればご覧になったことがあるひとも多いと思う。 今回、その路線図をデザインしたひとに、話をききに行った。
InstagramやAirbnbなどのUIデザインに見る新しいトレンド
ミニマルなデザインがトレンドになってからしばらく経ちますが、次のトレンドはなんでしょう？ ここ数か月、デザインの最先端を行くアプリやサービスの中で、「ミニマルデザイン」を次の段階へと押し進めるものが出てきました。FacebookやAirbnb、Appleは、それぞれのプロダクトをよりシンプルに見せることに対して同様の方向を見据えており、それは、モバイルのデザインにおける「コンプレクション・リダクション」という新しいトレンドを反映したものです。 「コンプレクション・リダクション」とは 「コンプレクション・リダクション」なんて聞いたことがありませんか？ 聴いたことがないのも無理ありません、何しろ私が勝手に名付けたものですから。最近私はフラットデザインやミニマルデザインとは違う方向性を持つものが出てきたことに気付きました。 編注：Complexionは「顔色」「血色」という意味で、Reducti
16種類（45カテゴリ）の業界150サイトの調査から分かるスマートフォンサイトUIの現状10選（スライド付）
2015年5月、スマートフォンによるGoogleの検索数がPCでの検索数を抜いたというニュースがGoogleの公式ブログで発表されました。昨今の私たちは多くの情報をスマートフォンで検索しています。その流れに伴って、現在は多くの企業がスマートフォン用に最適化されたWebサイトを持つようになりました。 我々Web制作者はこの流れの初頭、PCサイト制作で培ったノウハウを元に、手探り状態で制作していたのを記憶していますが、この数年の間で一定の制作ノウハウが蓄積されてきたように思います。 しかしデバイスが多様な進化を遂げる中で、スマートフォンサイトのUI作法も日々刻々と変化し続けています。私たちWeb制作者は一定のノウハウを使い回すことに固執せず、常に新しい動向を自分の目でキャッチして知識を刷新し、日々の業務にフィードバックさせる活動が大切です。 というわけで少々前置きが長くなりましたが、今回は昨今
BASEのアプリにMaterial Designを導入する際にやったこと考えたこと - NOTE - MIFURU
先日 BASEのアプリのリニューアルバージョンがリリースされた 。( Google Playはこちら ) 今までiOSとAndroidのデザインが全く同じでガイドラインに沿ったデザインを行えていなかったので今回のリニューアルを機にMaterial Design（マテリアルデザイン）を採用。そのとき流れやデザインまでのプロセスを簡単にをまとめてみる。 導入までの経緯 BASEではiOSのアプリが先にリリース。ver.3.0.0が出るタイミングでAndroidアプリもリリースしたがiOSと全く同じデザインで実装されていた。当時すでにMaterial Designは発表されはじめ、Google Playでも少しずつMateral Designを採用したアプリが特集されていて本格的に広まっていた。 BASEのアプリのデザインが内製になったタイミングでMaterial Designに変更する話が出て
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
大阪万博のロゴマーク二次創作まとめ【いのちの輝き】
The Blog | Welcome to Adobe Blog
Color, light, and materials - Mixed Reality
TechCrunch
手書き風デザインに使えるベクター素材 8 - NxWorld
