私がWEBデザイン制作の参考になりそうだと思うサイトを61個挙げてみた。
日本デザインスクールでは年間1500名ほどの受講生を、未経験からWEBデザイナーに育ててきました。受講生を指導する中でよくあがってくるのが「参考がなかなか見つからない」というお悩み。 私も受講生にお伝えすべく、これまで100サイト近くの「参考になりそうなギャラリーサイト」を見てきました。 そこで今回は、これまで見てきたギャラリーサイトの中で、みなさんのデザイン制作のお役に立ちそうなサイトを全部で61個ご紹介していきます。 全てのサイトを おすすめ度 サイト内検索の可否 いいね/保存機能の有無 ランキング機能の有無 掲載サイト数 を基準にランクづけし、おすすめできるサイト順に載せているので忙しいという方は、とりあえず上から順にチェックしていただければ大丈夫です！みなさんのデザイン制作に活かしていただけると嬉しいです。 【全サイト徹底比較】超参考になるおすすめギャラリーサイトTOP38 ちょう
マネジメントの「もぐら叩き」からいかに抜け出すか。ミドルマネージャーが心得ておくべき「問いのデザイン」の新原則とは？｜安斎勇樹
経営層の方針をチームに伝え、実行に移すミドルマネジメントの現場において、「問い」のデザインがますます重要になってきていると感じます。 本記事では、2023年10月に開催し、大変好評だったウェビナー「チームを覚醒させる「問い」のデザイン：新時代のミドルマネジメントの真髄」の内容より、「問い」を活用したミドルマネジメントの新原則について、ケーススタディとともにご紹介します。 『問いのデザイン』の大幅アップデートを目指して2020年に刊行した『問いのデザイン』の出版から4年近くが経ち、内容の改訂を検討しはじめています。特に組織の課題解決を担うミドルマネジャーに向けてコンテンツを肉付けし、アップデートに取り組んでいるところです。 きっかけは、2023年10月に開催したウェビナーでした。2023年6月にはじめて開催した一般向け大型ウェビナー「新時代の組織づくり」が非常に好評だったことを受け、その第二
テーブル・DB設計するときの極意 - Qiita
はじめに 「テーブル・DBを設計するときのさいきょうの極意」を完全に理解したので 初心者（私）向けに共有する記事です。 どうぞ揉んでいただければ幸いです。対戦よろしくお願いします。 さいきょうの極意 初心者が「テーブル・DB設計して」と言われると、 「アソシエーションってあったよね・・・バリデーションも？中間テーブルを使うときと使わないときと・・・」と大変に混乱し、何から手をつけていいかわからなくなります。 そんなあなたにこれ！ テーブル・DB設計は「属性」と「関係」の２つだけ 「属性」は必要なものを書くだけ 「関係」は 1:1 / 1:N / N:N しかない（しかも、ほとんど 1:N） これが極意だ！！！ 一般的な、「ユーザーがいて、投稿ができて、コメントといいねができるサービス」で考えてみましょうか。 users / posts / comments / likes のテーブルが必要
知識０から、ちょっとUIデザインに詳しくなるnote｜やました
前回は、「UIデザインってそもそも何なの？」という概論的な説明と、UIデザイン未導入の組織の中でみんなでデザインを始めてみるための施策（プロトタイピングとユーザビリティ評価）を話しました。 今回はサービス、プロダクト開発において、デザイナーではない人でも知っていて損はないUIデザインの重要ポイントについて説明します。主に以下の３つのテーマについて順番に議論をしていきます。 デバイスやソフトによるUIの違い ユーザーにかかる身体的・認知的負荷を理解する UIの重要概念（ナビゲーション、インタラクションなど）を知る 「ちょっと」と銘打っておきながらめちゃくちゃ長いnoteになってしまったので、気になる項目だけ読むか、何回かに分けて読んでいただくことをおすすめします、。 ※どこか内容に間違ってる部分やご意見ありましたらコメントいただけたら嬉しいです。 デバイスやソフトによるUIの違い皆さんがお使
2023 - Most Viewed Decks
Here are the 25 most viewed decks of 2023: わかりやすい説明のための 10 の鉄則 / 10 golden rules for easy-to-understand explanations by @e869120 私考える人、あなた作業する人」を越えて、プロダクトマネジメントがあたりまえになるチームを明日から実現していく方法/product management rsgt2023 by @moriyuya 解像度を上げる 🔬/ Increase resolution by @tumada セキュリティ研修【MIXI 23新卒技術研修】/ Security training [MIXI 23 new graduate technical training] by @mixi_engineers ソフトウェアの内部品質に生じる様々な問題は組織設計に
『はじめよう！ 要件定義』（とそのシリーズ）を読んで、はじめよう！UIデザイン｜金 成奎
『はじめよう！ 要件定義 ～ビギナーからベテランまで』はそのタイトル通り、ソフトウェア開発に携わるエンジニアやPM向けに、要件定義の進め方について優しく解説してくれる書籍です。かわいいイラストと平易な文章がとっつきやすく、するすると読めてしまいますが、要件定義って何をどうやったらいいの？とお悩みの方に対して、まずはこれだけやっておくべき基礎知識を得ることができる、とてもわかりやすい内容になっています。 そしてそして、ここからが本noteの主な趣旨ですが、この3部作はデザイナー目線で読み解くと、極めて明瞭で本質的で実践的な、ユーザー体験設計とUI設計の進め方について学べるデザイン教則本と言えるのです。 以下、その理由と、本シリーズを使ってUIデザインを進めていく方法を実例を踏まえて解説していきます。 要件定義とはUI・機能・データを決めることいきなり『はじめよう！ 要件定義 』のキモ・コンセ
｢センス｣は生まれ持った才能ではない…センスのいい人が日常生活の中で実践している2つの習慣 デザインの制作意図は6パターンに分類できる
センスを身につけるための2つの能力 街中にある看板や企業のポスター、道路の標識、電車内の広告、商品パッケージ、WEBサイト……私たちの身の回りには、ありとあらゆるところに数えきれないほどのデザインが溢れています。普通の人にとっては「オシャレだなぁ」とただ眺めるだけでスルーしてしまうもの、あるいは「煩わしい」と感じるものかもしれません。 一方で、プロのデザイナーにとってはデザインセンスを養う教材のひとつとなっています。日常生活で目にするデザインには、ひとつひとつに制作者の意図やこだわり、伝えたいメッセージが込められているからです。 デザインを意識的に「見る力」、そのデザインが施された意味を想像・考察して「言語化する力」を身につけることでセンスが磨かれ、実践の場で活かせるようになります。 「赤色」に着目したときに見える世界 それでは一度、この記事を読んでいる画面から目を離して辺りを見渡してみて
Figma でデザイン、そのままデモ、そのまま実装！ - Qiita
みなさん、デザインツールの Figma を使っていますか？ 私はまだ「使っている」と言えるほど使えていません というわけで勉強会を開催して勉強します Figma とは 公式の紹介文は以下のとおりです デザインの追求からプロトタイプ作成、制作物のコーディングまで、Figmaはチームがコラボレーションして製品開発するためのプラットフォームです 本記事のタイトルと同じように、「デザインからデモ・実装までチームで製品開発できる」旨が書かれています まさにその通りで、ブラウザ上で UI をデザインし、そのまま動かしてみることができ、最終的にはコードの生成までできてしまうツールです Figma の人気 2022年に世界中のデザイン関係者を対象としたアンケートでも Figma は圧倒的な人気です いずれのランキングでも2位の10倍以上の得票数になっています メインで使っている UI デザインツール第1位
タスク指向のデザインはなぜ生まれるのか？
『タスク偏重のデザインはなぜ生まれるのか？』の続きです。 簡単だから 画面を見て悩むデザイナーが「全体はよくわからないから別にしてこの中だけ作るか」と言いながらボタンの先に画面を連ねようとしている オブジェクト指向のUIにするには手順を解体し、オブジェクトを中心に構造化する必要があります。重複しているものはマージし、必要に応じて新しいオブジェクトを定義したり新しいイディオムを検討することもあります。 （例:「簡単に新規作成する」という機能に対して複製、テンプレート、マスターというイディオムを検討する） これらはそれまで作ってきたものとうまく整合するようにしなければいけませんし、整合しないならどこをやめたら全体としてひとつの形にできるのか考えることになります。これは大変です。 対してタスク指向のUIデザインは簡単です。 新しいタスク用に新しい入り口を作って、必要な入出力を線形に並べ、例えばウ
たのしいドメイン駆動設計: 序 / Enjoy domain driven design : ZYO
自分の開発に対する姿勢を根本的に変えたドメイン駆動設計(DDD)。ぜひみんなにもその面白さを知ってもらいたい！と思い社内向け資料を作成、さらにSpeakerDeckにて公開としました。 たのしんでご覧ください！ 関連note記事はこちら：https://note.com/jgc_parallel/n/n17db4b63affe
無料なのに多機能すぎるカメラアプリ「Blackmagic Camera」登場 iPhone用、10bit 4K ProRes対応
豪Blackmagic Designは9月15日、オランダ・アムステルダムで開催中の「IBC 2023」において、iPhone用のカメラアプリ「Blackmagic Camera」を発表した。同社の動画用カメラと同じようなプロ向けの機能がiPhoneでも利用できる。すでに提供を開始しており、無料でダウンロード可能だ。 Blackmagic Cameraは、10bit Apple ProResで4Kまでの収録に対応。同社製カメラと同じシステムをベースにしており、UIなどもプロユース向けに最適化している。画面には、ステータス、収録パラメーター、ヒストグラム、フォーカスピーキング、録音レベル、フレームガイドなどを表示可能。3D LUTを追加してモニタリングすることもできる。
スライド資料のデザインが劇的に良くなる！現場で学んだフォント・色の選び方｜fuyuna blog｜デザイン・ライフスタイル・キャリアについて書くデザイナーのブログ
「作りたい資料に適したフォントがわからない」 「どの色を選べばいいかわからない」 「スライド資料のデザインをもっと洗練させたい」 スライド資料をデザインするとき、こんな悩みを持つ方は多いのではないでしょうか？ スライド資料の印象は使用する「フォント」と「色」によって大きく変わり、うまく活用すれば見る人の心を動かし、行動を促す資料を作成できます。 そんな効果的な資料を作成するには、フォントと色の基本知識が必要不可欠です。それぞれについて学ぶことでデザインセンスが高まり、あなたのスライド資料に適した色とフォントを、効率よく選べるようになるでしょう。 ということで、この記事ではスライド資料のデザインに役立つ「フォント」と「色」の基本知識から、適切な種類を選ぶポイント、もっとデザインを学びたい方におすすめの書籍まで、フォントや色に関するノウハウをたっぷり紹介していきます！ デザインに苦手意識がある
テスト設計チュートリアル/Test Design Tutorial
テスト自動化の成果をどう評価し、どう次につなげるか/Test Automation Next Step
デザインシステム入門！Web制作初心者が知るべき基本原則とFigma活用法
この記事について この記事は、スマートフォン時代のWebデザインスクール や Web制作の基礎から学べる「Webコーディングスクール」 の資料制作をお手伝いして頂いているemiさんによる寄稿記事です。 emiと申します。USAGI DESIGN emi.というサイトでWebデザインやコーディング練習用のデザインデータを配布しています。Webデザインをメインにストックイラストレータ、グッズデザインなどしております。 私が最近学んでいること、「デザインシステム」について書きたいと思います。 なぜデザインシステムを学んでいるのか。ですが、デザインの制作時にFigmaを使う機会が増えて、今までPhotoshopやXDで作業していたときよりも、コンポーネントを意識するようになったからです。 まだWeb制作を学び始めたばかりだから、デザインシステムとか難しそう。と思っている人もいるかもしれませんが、学
UIデザインに必須の16の論理ルール！ デザインは細部のちょっとした作り込みが使いやすさを決める
UIデザインはシンプルで論理的なルールを理解することで、情報に基づいたデザインの意思決定を効率的におこなうことができます。UIデザインをより使いやすく改善する16の論理ルールを紹介します。 長い記事なので、時間がある時にゆっくりご覧ください。 16 little UI design rules that make a big impact by Adham Dannaway 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに 1. スペースを利用して関連要素をグループ化する 2. 一貫性を保つ 3. 見た目が似ている要素は同じように機能するようにする 4. 明確なビジュアルヒエラルキーを作成する 5. 不要なスタイルを削除する 6. カラーは意図的に使用する 7. インターフェイス要素のコントラスト比が3:1であることを確
世界を変えるはずだった 「デザイン思考」とは 何だったのか？
Design thinking was supposed to fix the world. Where did it go wrong? 世界を変えるはずだった 「デザイン思考」とは 何だったのか？ 企業や自治体から一時注目を浴びた「デザイン思考」の輝きは近年、失われつつある。組織内での「イノベーション劇場」が常態化し、多くの課題が大量の付箋では解決困難であることが明らかになった今、デザイン思考のアプローチにもイノベーションが求められている。 by Rebecca Ackermann2023.04.07 409 96 2011年のことだ。カイル・コーンフォースがアイディオ（IDEO）のサンフランシスコ・オフィスに初めて足を踏み入れたとき、まったく新しい世界に迷い込んだように感じた。当時、非営利団体「エディブル・スクールヤード・プロジェクト（Edible Schoolyard Projec
これでUIデザイン用のSVGアイコンに困らない！ 1,700種類以上が揃った商用利用無料、改変・再配布可の太っ腹ライセンス- MingCute Icon
WebサイトやスマホアプリのさまざまなUIデザイン用に、シンプルで洗練されたデザインのSVGアイコンが完全無料で利用できるMingCute Iconを紹介します。 このアイコンの特徴は、小さいサイズでもくっきり見えること。1,700種類以上のアイテムが揃っており、すべてSVGアイコン、そしてWebフォントとして利用できます。 MingCute Icon MingCute Icon -GitHub MingCute Iconの特徴 MingCute Iconのダウンロード MingCute Iconのアイコン MingCute Iconの特徴 MingCute Iconは、Webサイトやスマホアプリ用にシンプルで洗練されたデザインのアイコンです。すべてのアイコンは、24x24のグリッド内に設計されており、アウトラインと塗りつぶしの2スタイル、2pxのストロークとなっています。アイコンのフォー
CTO から見た，なぜスタートアップ
初期のソフトウェア設計は壊れがちなのか - Speaker Deck
Speaker Deck This deck requires a password Password
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Genius by Diagram
「わかりやすさ」を デザインする情報アーキテクチャ必修入門 / Introduction to IA for "Design for Understanding"
