1 ：名無しさん：2024/05/04(土) 12:34:56.78 ID:abcdefgh
Webデザイナーの皆さん、集まれ〜！
愚痴や面白い経験、役に立つ知識を自由に語るスレです。
みんなで楽しく情報交換しましょう！
2 ：名無しさん：2024/05/04(土) 12:36:12.34 ID:ijklmnop
1 スレ立て乙です！
最近クライアントから無茶な要求されて大変だったわ…
みんなはどうやって乗り切ってる？
3 ：名無しさん：2024/05/04(土) 12:37:45.67 ID:qrstuvwx
2
クライアントとの信頼関係がカギだよね。
要求の背景をしっかり聞いて、代替案を提案するのがいいと思う。
でもストレス溜まるよな〜
4 ：名無しさん：2024/05/04(土) 12:39:23.45 ID:yzabcdef
最近はパララックスデザインが流行ってるみたいだけど、
実装するの難しくない？コツとかあったら教えて欲しい！
5 ：名無しさん：2024/05/04(土) 12:41:56.78 ID:ghijklmn
4
ライブラリ使えば意外と簡単だよ。
オススメはrellaxってやつ。jQueryベースだから使いやすいし。
6 ：名無しさん：2024/05/04(土) 12:43:12.34 ID:opqrstuv
フォントのデザインって難しいよな…
可読性とデザイン性のバランスがなかなか取れない。
みんなはどんなフォント使ってる？
7 ：名無しさん：2024/05/04(土) 12:44:45.67 ID:wxyzabcd
6
日本語はNoto Sans JPがいいよ。Googleが出してるフリーフォントだから使いやすい。
英語はLato使ってる。これも良い感じ。
8 ：名無しさん：2024/05/04(土) 12:46:23.45 ID:efghijkl
最近のトレンドって何かある？
ちょっと変わったデザインに挑戦してみたいんだけど。
9 ：名無しさん：2024/05/04(土) 12:47:56.78 ID:mnopqrst
8
ニューモーフィズムが流行りだしてるみたいだね。
背景とUIの境界をぼかして立体的に見せる手法らしい。
やりすぎると見づらくなるから程々に使うのがコツかも。
10 ：名無しさん：2024/05/04(土) 12:49:12.34 ID:uvwxyzab
みんなイラストとか使う？自分で描いてる？
ストックサイトだと微妙なのしかなくて困る…
11 ：名無しさん：2024/05/04(土) 12:51:45.67 ID:cdefghij
10
シンプルなものならクリエイティブ コモンズの素材サイト使ってる。
商用利用OKのイラスト結構あるよ。
クオリティ求めるなら料金払ってでもストックサイト使った方がいいかも。
12 ：名無しさん：2024/05/04(土) 12:53:23.45 ID:klmnopqr
最近はダークモードが主流になってきたね。
でも色の選定が難しい…
アクセントカラーとかどう決めてる？
13 ：名無しさん：2024/05/04(土) 12:55:56.78 ID:stuvwxyz
12
HSLカラーモデル使うと良いよ。
色相は固定して、彩度と明度だけ変えると統一感出せる。
色のコントラストに気をつければ見やすいUIになるはず。
14 ：名無しさん：2024/05/04(土) 12:57:12.34 ID:abcdefgh
レスポンシブデザインあるある言いたい。
ブレイクポイントの設定が多すぎて管理が大変！
みんなはメジャーな解像度だけにしてる？
15 ：名無しさん：2024/05/04(土) 12:59:45.67 ID:ijklmnop
14
最近はレンジでブレイクポイントを指定するのが主流みたい。
min-width と max-width でレンジ指定すれば、
いちいち解像度指定しなくて済むよ。
16 ：名無しさん：2024/05/04(土) 13:01:23.45 ID:qrstuvwx
デザインツールは何使ってる？
Adobe XDとSketchどっちがいいんだろ。
17 ：名無しさん：2024/05/04(土) 13:03:56.78 ID:yzabcdef
16
クライアントの環境に合わせるのがベストだけど、
自分はFigmaがおすすめ。
ブラウザベースだからOSに依存しないのが良いよね。
18 ：名無しさん：2024/05/04(土) 13:05:12.34 ID:ghijklmn
最近はアクセシビリティに配慮したデザインが求められるようになってきたよね。
WAI-ARIAとかちゃんと対応できてる？
19 ：名無しさん：2024/05/04(土) 13:06:45.67 ID:opqrstuv
18
正直まだ完璧には対応できてないわ…
でもウェブアクセシビリティ方針作ったり、チェックリスト作ったりして改善に努めてる。
知見共有できたら嬉しい。
20 ：名無しさん：2024/05/04(土) 13:08:23.45 ID:wxyzabcd
デザインとコーディングどっちが好き？
自分はデザインの方が性に合ってる気がする。
21 ：名無しさん：2024/05/04(土) 13:10:56.78 ID:efghijkl
20
どっちも好きだけどコーディングかな。
自分の手でデザインを実現するのが楽しい。
でもデザイナーの気持ちを理解するのは大事だと思ってる。
22 ：名無しさん：2024/05/04(土) 13:12:12.34 ID:mnopqrst
みんなポートフォリオサイトとか持ってる？
どんなデザインにしてる？
23 ：名無しさん：2024/05/04(土) 13:14:45.67 ID:uvwxyzab
22
シンプルが一番だと思う。
あとはレスポンシブ対応は必須。
スマホでも見やすいデザインを心がけてる。
24 ：名無しさん：2024/05/04(土) 13:16:23.45 ID:cdefghij
UIアニメーションのおすすめライブラリってある？
ちょっとリッチな演出をつけたいんだけど。
25 ：名無しさん：2024/05/04(土) 13:18:56.78 ID:klmnopqr
24
GreenSockが定番だね。高機能だし。
あとはAnime.jsも軽量でいい感じ。
jQueryより直感的に書けるのがいいところ。
26 ：名無しさん：2024/05/04(土) 13:20:12.34 ID:stuvwxyz
デザインの勉強ってどうしてる？
本読んだりサイト見たりしてるけど、なかなか上達しない…
27 ：名無しさん：2024/05/04(土) 13:22:45.67 ID:abcdefgh
26
実際にデザインするのが一番だと思う。
あとはデザイナーが発信してるnoteとかブログを読むのもおすすめ。
現役の人の考え方が勉強になるよ。
28 ：名無しさん：2024/05/04(土) 13:24:23.45 ID:ijklmnop
次のトレンドって何だと思う？
ちょっと先の未来を予想するの楽しいよね。
29 ：名無しさん：2024/05/04(土) 13:26:56.78 ID:qrstuvwx
28
VRとARがもっと普及してくるんじゃないかな。
没入感のあるUIデザインが求められそう。
勉強しておかないとね。
30 ：名無しさん：2024/05/04(土) 13:28:12.34 ID:yzabcdef
チーム開発ってどうしてる？
デザインの共有とかコミュニケーションが大変…
31 ：名無しさん：2024/05/04(土) 13:30:45.67 ID:ghijklmn
30
デザインシステムを導入するのがいいと思う。
コンポーネントやルールを共有できるし、統一感も出せる。
Storybookとかおすすめ。
32 ：名無しさん：2024/05/04(土) 13:32:23.45 ID:opqrstuv
みんなデザイン以外の趣味とかある？
仕事のインスピレーションになったりする？
33 ：名無しさん：2024/05/04(土) 13:34:56.78 ID:wxyzabcd
32
音楽かな。曲を聴いてるとデザインのアイデアが浮かんだりする。
あとは美術館巡りとか。アートからインスピレーション得るのおすすめ。
34 ：名無しさん：2024/05/04(土) 13:36:12.34 ID:efghijkl
UIデザインで気をつけてることってある？
使いやすさとかわかりやすさを意識してるんだけど。
35 ：名無しさん：2024/05/04(土) 13:38:45.67 ID:mnopqrst
34
ユーザーの目的を考えることかな。
何をしたいのか、どういう動線になるのかを意識してる。
あとはUIのヒエラルキーを整理するのも大事。
36 ：名無しさん：2024/05/04(土) 13:40:23.45 ID:uvwxyzab
最近のWebフォントの動向って何かある？
選択肢が増えすぎてて迷っちゃう…
37 ：名無しさん：2024/05/04(土) 13:42:56.78 ID:cdefghij
36
可変フォントが注目されてるみたい。
一つのフォントファイルでウェイトとかが変えられるらしい。
使う側としては管理が楽になりそう。
38 ：名無しさん：2024/05/04(土) 13:44:12.34 ID:klmnopqr
CSSアニメーションで凝ったことしたことある人いる？
パフォーマンスとの兼ね合いが難しくて。
39 ：名無しさん：2024/05/04(土) 13:46:45.67 ID:stuvwxyz
38
will-changeっていうプロパティを使うといいらしいよ。
事前にブラウザに変更を知らせるみたいな感じ。
でもGPUにも負荷かかるから過度に使うのは避けた方がいいとか。
40 ：名無しさん：2024/05/04(土) 13:48:23.45 ID:abcdefgh
デザインで行き詰まったときってどうしてる？
クライアントの要望に答えられなくて悩んでる…
41 ：名無しさん：2024/05/04(土) 13:49:56.78 ID:ijklmnop
40
一人で抱え込まずにチームで相談するのがいいと思う。
みんなで知恵を出し合えば道が開けるはず。
クライアントともしっかりコミュニケーション取るのが大事だね。
42 ：名無しさん：2024/05/04(土) 13:52:12.34 ID:qrstuvwx
デザインのプレゼンってどうしてる？
クライアントへの説明が苦手で…
43 ：名無しさん：2024/05/04(土) 13:53:45.67 ID:yzabcdef
42
ロジックを大事にしてる。
なぜそのデザインなのか、根拠を示すことを心がけてる。
あとはクライアントのビジネスゴールとつなげて説明するのもポイント。
44 ：名無しさん：2024/05/04(土) 13:55:23.45 ID:ghijklmn
wireframeとprototype、みんなはどっち重視してる？
自分はプロトタイプ派だけど。
45 ：名無しさん：2024/05/04(土) 13:57:56.78 ID:opqrstuv
44
両方大事だと思うけど、wireframeで基本設計してからかな。
でもプロトタイプは動きが見られるからわかりやすいよね。
フィードバックももらいやすい。
46 ：名無しさん：2024/05/04(土) 13:59:12.34 ID:wxyzabcd
デザイナーとエンジニアの協業ってどうしてる？
コミュニケーションギャップを感じることがあって。
47 ：名無しさん：2024/05/04(土) 14:01:45.67 ID:efghijkl
46
お互いの領域を理解し合うことが大切だよね。
勉強会とか交流会を開くのもいいかも。
あとはデザインの意図をしっかり伝えるのも大事。
48 ：名無しさん：2024/05/04(土) 14:03:23.45 ID:mnopqrst
アクセス解析とかデータ分析ってどうしてる？
デザインの改善に生かしたいんだけど。
49 ：名無しさん：2024/05/04(土) 14:05:56.78 ID:uvwxyzab
48
Google Analyticsが定番だけど、
最近はHotjarとかも使ってる。
ヒートマップとか見れるし、ユーザーの動きがわかりやすい。
50 ：名無しさん：2024/05/04(土) 14:07:12.34 ID:cdefghij
デザインのトレンドをキャッチアップするのって大変だよね。
みんなどうしてる？
51 ：名無しさん：2024/05/04(土) 14:08:45.67 ID:klmnopqr
50
海外のデザインメディアをチェックしてるよ。
Smashing MagazineとかWeb Designer Depotとか。
あとはSNSでデザイナーをフォローするのも良いと思う。
52 ：名無しさん：2024/05/04(土) 14:10:23.45 ID:stuvwxyz
プロジェクトの納期が厳しいときってどうしてる？
作業効率を上げる工夫とかある？
53 ：名無しさん：2024/05/04(土) 14:12:56.78 ID:abcdefgh
52
タスクを細分化して優先順位をつけるのが大事だね。
あとはテンプレートとかコンポーネントを再利用するのも有効。
チームで助け合うのも大切だと思う。
54 ：名無しさん：2024/05/04(土) 14:14:12.34 ID:ijklmnop
デザインのインスピレーションってどこから得てる？
なかなかアイデアが浮かばなくて…
55 ：名無しさん：2024/05/04(土) 14:15:45.67 ID:qrstuvwx
54
Pinterestとかドリブルとかで参考になりそうなデザイン集めてるよ。
でもパクリはNGだからアレンジは必要だけどね。
あとは日常生活の中からヒントを得るのもおすすめ。
56 ：名無しさん：2024/05/04(土) 14:17:23.45 ID:yzabcdef
SVGアニメーションに挑戦してみたいんだけど、
おすすめのチュートリアルとかある？
57 ：名無しさん：2024/05/04(土) 14:19:56.78 ID:ghijklmn
56
CSS-TricksにSVGアニメーションの記事があったはず。
あとはcodropsも参考になるよ。
基本はSVGにCSSアニメーションを適用する感じかな。
58 ：名無しさん：2024/05/04(土) 14:21:12.34 ID:opqrstuv
ミニマルデザインとかフラットデザインって廃れた？
最近あまり見ないような気がして。
59 ：名無しさん：2024/05/04(土) 14:22:45.67 ID:wxyzabcd
58
廃れたというよりは進化した感じかも。
フラット過ぎず立体感を出すのが主流になってきてる気がする。
あくまでシンプルさは大事にしつつ、メリハリをつけるみたいな。
60 ：名無しさん：2024/05/04(土) 14:24:23.45 ID:efghijkl
デザインの受賞歴とかコンペ入賞歴ってどう思う？
クライアントからの評価には関係ある？
61 ：名無しさん：2024/05/04(土) 14:26:56.78 ID:mnopqrst
60
あくまで参考程度かな。
受賞歴よりも実績の方が大事だと思う。
でもモチベーションアップには良いかも。
62 ：名無しさん：2024/05/04(土) 14:28:12.34 ID:uvwxyzab
スクロールアニメーションのベストプラクティスってある？
やりすぎると鬱陶しい気もするんだけど。
63 ：名無しさん：2024/05/04(土) 14:29:45.67 ID:cdefghij
62
あくまで脇役に徹するのがポイントかな。
メインコンテンツを引き立てる程度に留めるのがいいと思う。
あとはスクロールジャックはやめた方が無難。
64 ：名無しさん：2024/05/04(土) 14:31:23.45 ID:klmnopqr
Webの可読性を上げるコツってある？
文字量が多いサイトだと特に悩む…
65 ：名無しさん：2024/05/04(土) 14:33:56.78 ID:stuvwxyz
64
文字サイズ、行間、字間を適切に調整するのが基本だね。
あとは１行の文字数を60〜75文字に収めるのがベスト。
見出しやリストを使って情報を整理するのも大事。
66 ：名無しさん：2024/05/04(土) 14:35:12.34 ID:abcdefgh
動画コンテンツのデザインで気をつけてることある？
最近動画需要が高まってきてて。
67 ：名無しさん：2024/05/04(土) 14:36:45.67 ID:ijklmnop
66
字幕の読みやすさはチェックした方がいいかも。
あとはスマホでの視聴も想定してサイズ感も大事。
自動再生はユーザーを不快にさせるから控えめに。
68 ：名無しさん：2024/05/04(土) 14:38:23.45 ID:qrstuvwx
デザインの差別化って難しいよね。
似たようなサイトが多くて。
69 ：名無しさん：2024/05/04(土) 14:39:56.78 ID:yzabcdef
68
ターゲットユーザーを明確にするのが大切だと思う。
誰に向けてデザインするのかを意識する。
あとはブランディングカラーとかで個性を出すのもアリかも。
70 ：名無しさん：2024/05/04(土) 14:41:12.34 ID:ghijklmn
BEMとかOOCSSとかのCSS設計、みんなどう思う？
使い勝手良さそうだけど導入が難しい…
71 ：名無しさん：2024/05/04(土) 14:43:45.67 ID:opqrstuv
70
最初は大変だけど長期的に見るとメリットが大きいと思う。
運用もしやすいしメンテナンス性も上がる。
チームで導入するなら命名ルールをしっかり決めるのが肝心。
72 ：名無しさん：2024/05/04(土) 14:45:23.45 ID:wxyzabcd
ユーザーテストって自分でやってる？
どんな風にフィードバック得てる？
73 ：名無しさん：2024/05/04(土) 14:46:56.78 ID:efghijkl
72
可能な限りやるようにしてるよ。
社内でモニター集めてもらったりクラウドソーシング使ったり。
あとはユーザーにアンケート取るのも有効。
74 ：名無しさん：2024/05/04(土) 14:48:12.34 ID:mnopqrst
フォームのUXデザインのコツってある？
入力項目が多いと離脱しそうで。
75 ：名無しさん：2024/05/04(土) 14:49:45.67 ID:uvwxyzab
74
入力項目は必要最低限に絞るのが鉄則だね。
あとはプログレスバーを表示して進捗を可視化するのも良い。
バリデーションはリアルタイムにするのがベスト。
76 ：名無しさん：2024/05/04(土) 14:51:23.45 ID:cdefghij
デザインの教育とか新人育成ってどうしてる？
マニュアル作ったりレビューしたり大変…
77 ：名無しさん：2024/05/04(土) 14:52:56.78 ID:klmnopqr
76
デザインシステムを整備するのがいいと思う。
コンポーネントライブラリとかスタイルガイドとか。
あとはOJTで先輩がサポートするのが理想かな。
78 ：名無しさん：2024/05/04(土) 14:54:12.34 ID:stuvwxyz
みんなデザインする時の音楽とかある？
作業用BGMを探してるんだけど。
79 ：名無しさん：2024/05/04(土) 14:55:45.67 ID:abcdefgh
78
Lofiヒップホップとかおすすめ。
あとはカフェの環境音とか。
集中力が上がるし、雑念も払拭できる気がする。
80 ：名無しさん：2024/05/04(土) 14:57:23.45 ID:ijklmnop
マイクロインタラクションの事例って何かある？
ちょっとした動きでも印象変わるよね。
81 ：名無しさん：2024/05/04(土) 14:58:56.78 ID:qrstuvwx
80
ボタンのホバーエフェクトとかが分かりやすいかな。
あとはスクロールするとヘッダーが隠れたりとか。
ローディング画面のアニメーションなんかも良い例だと思う。
82 ：名無しさん：2024/05/04(土) 15:00:12.34 ID:yzabcdef
ユーザーの「察する」能力ってどこまで期待できる？
UIの説明とかどこまで必要なのか悩む…
83 ：名無しさん：2024/05/04(土) 15:01:45.67 ID:ghijklmn
82
ユーザーの知識レベルによるけど、基本的にはシンプルな方がいいと思う。
アイコンとかは説明なしでも分かるようにするのが理想。
どうしても説明が必要なら、ツールチップとかを使うのがいいかも。
84 ：名無しさん：2024/05/04(土) 15:03:23.45 ID:opqrstuv
インタラクションデザインの参考になる本とかある？
もっと勉強したいんだけど。
85 ：名無しさん：2024/05/04(土) 15:04:56.78 ID:wxyzabcd
84
「インタラクションデザインの教科書」がおすすめ。
あとはアラン・クーパーの「コンピュータは、むずかしすぎて使えない！」も名著。
海外だと、”About Face: The Essentials of Interaction Design”も良いよ。
86 ：名無しさん：2024/05/04(土) 15:06:12.34 ID:efghijkl
エラーメッセージのコピーライティングって悩むよね。
かといって開発に丸投げというわけにもいかないし…
87 ：名無しさん：2024/05/04(土) 15:07:45.67 ID:mnopqrst
86
ポジティブな言葉選びを心がけるのが基本かな。
あとはユーザーが取るべきアクションを明示するのが大事。
単に「エラーが発生しました」じゃなくて、次に何をすればいいかを伝えるイメージ。
88 ：名無しさん：2024/05/04(土) 15:09:23.45 ID:uvwxyzab
みんな営業職とかマーケ職とかと上手くやってる？
デザインの重要性を理解してもらうの大変…
89 ：名無しさん：2024/05/04(土) 15:10:56.78 ID:cdefghij
88
デザインの要素が収益にどう貢献してるかを可視化するのが肝心だね。
データを使って説明するのが一番説得力ある。
あとは良好な人間関係を築くこと。飲みに行くのも大事w
90 ：名無しさん：2024/05/04(土) 15:12:12.34 ID:klmnopqr
プロトタイピングツールは何使ってる？
Figmaが主流？
91 ：名無しさん：2024/05/04(土) 15:13:45.67 ID:stuvwxyz
90
うちはAdobeXDだね。
Photoshopとかとの連携が良くて使いやすい。
でもFigmaも良さそう。今度触ってみようかな。
92 ：名無しさん：2024/05/04(土) 15:15:23.45 ID:abcdefgh
チームでデザインルールを決めるコツってある？
なかなか全員の意見がまとまらなくて…
93 ：名無しさん：2024/05/04(土) 15:16:56.78 ID:ijklmnop
92
デザインシステムを一緒に作るのがいいと思う。
ワークショップ形式でみんなの意見を吸い上げるイメージ。
あとはベンチマークして他社の良いとこ取りするのもアリ。
94 ：名無しさん：2024/05/04(土) 15:18:12.34 ID:qrstuvwx
デザイン思考って実践してる？
どんなプロセスでやってる？
95 ：名無しさん：2024/05/04(土) 15:19:45.67 ID:yzabcdef
94
共感、問題定義、アイデア出し、プロトタイピング、テストが基本だね。
でもプロジェクトによって適宜アレンジしてる。
大事なのはユーザー視点に立つことかな。
96 ：名無しさん：2024/05/04(土) 15:21:23.45 ID:ghijklmn
デザインQAってどうしてる？
チェック項目とかまとめてる？
97 ：名無しさん：2024/05/04(土) 15:22:56.78 ID:opqrstuv
96
社内でチェックリスト作ってるよ。
レスポンシブの表示確認とか、アクセシビリティチェックとか、各ブラウザチェックとか。
あとは第三者に見てもらうのも大事。自分だと気づかないこともある。
98 ：名無しさん：2024/05/04(土) 15:24:12.34 ID:wxyzabcd
デザインの最新トレンドをどうやってキャッチアップしてる？
なかなか時間が取れなくて…
99 ：名無しさん：2024/05/04(土) 15:25:45.67 ID:efghijkl
98
良いデザインを集めたギャラリーサイトとかを見るのがおすすめ。
Awwwards、CSS Design Awards、One Page Loveとか。
あとはカンファレンスに行くのも刺激になるよ。
100 ：名無しさん：2024/05/04(土) 15:27:23.45 ID:mnopqrst
今日はいろいろ勉強になった！
みんなもデザインライフを楽しんでー！
101 ：名無しさん：2024/05/04(土) 15:28:56.78 ID:uvwxyzab
100
そうだね！また情報交換しよう！
素敵なデザイン作ってお客さんを幸せにしようぜ！
102 ：名無しさん：2024/05/04(土) 15:30:12.34 ID:cdefghij
デザイナー万歳！！！
以上、Webデザイナーの集いスレでした。
みなさんの活発な意見交換、ありがとうございました！
今後ともよろしくお願いしますー。
コメント