デザインレンズ @Design_Lens_RES
デザインを見る解像度を上げる。 「なんか良い」を、なんとなくで終わらせない。 Design, with a clearer lens. note.com/design_lens Joined September 2026-
Tweets42
-
Followers2
-
Following23
-
Likes10
「編集」も「共有」も「削除」も、 全部同じように見せる必要はない。 よく使う操作は見つけやすく。 低頻度な操作は、必要なときに。 何個あるかより、どれを先に見つけてほしいか。 操作の見せ方を1枚にまとめました。
余白をそろえたのに、まとまりが見えない。 同じ要素でも、距離を変えると「何がセットか」が変わります。 近い関係は近く、別のまとまりは離す。 note「Webデザイン違和感図鑑」の、近接と余白の階層を扱う図解を更新しました。 note.com/design_lens/n/…
入力エラー、いつ伝える？ 「すぐ出す」か「Submit後」か、だけではなく、 その時点で判断できるかから考える。 入力 → 判定 → Feedback → 修正 → 完了まで、 1枚にまとめました。
パスワードの「確認用でもう一度入力」、 実はなくてもいい。 GOV.UK Design Systemでは確認用の入力欄を設けず、 表示／非表示の切り替えや、貼り付け、パスワードマネージャーを使いやすくする考え方。 こういう「当たり前だと思ってたUI」を見直すの、面白いですね。
生年月日の入力、投票ではBが多い結果でした。 では、なぜ？ 調べてみると、同じ「日付」でも 生年月日とホテル予約では、選び方が少し違います。 投票結果を入口に、条件を変えながら考えてみました。
Loading UI、どれを使う？ Loading Indicator / Skeleton / Progress Bar / Inline Loading / Full-screen 迷ったときの考え方を、1枚にまとめました。 待ち時間より、「何を待っているか」から考える。 ※ Step Progressは似ていますが、Loadingではなくユーザー自身の手順として分けています。
入力漏れがあるとき、どっちの方が分かりやすそう？ A / Bで教えてください。 投票はリプに置いてます ↓
投票ありがとうございました。 今回は B：直接入力する が多い結果でした。 調べてみると、Carbon Design Systemでも、生年月日のような覚えている日付にはSimple date inputが使われています。 一方、予約のように曜日や他の日との関係を見ながら選ぶ場合はCalendar picker。 「日付だからCalendar」ではなく、その日付をどう知っているかで選ぶ。 ホテルの宿泊日で同じ投票をしたら、また違う結果になったかもしれません。
生年月日を入力するなら、どっちの方が楽そうですか？ A / B、直感でお願いします。 投票はリプに置いてます ↓
配送方法が3つなら、どっちの方が選びやすそう？ A / Bで教えてください。 投票はリプに置いてます ↓
投票ありがとうございました。 今回はかなり僅差でした。 Bは本文幅を少し絞り、1行を短くしたレイアウトです。 長めの文章では、行が長くなりすぎないよう本文幅を調整する考え方があります。 一方で、Aを選んだ方と差がほぼないのも興味深い結果でした。 「本文は狭いほど読みやすい」という単純な話ではなさそうです。 文字サイズや文章量、画面サイズが変われば、また違った結果になったかもしれません。 投票結果も参考にしながら、もう少し調べてみます。
パッと見、どっちの方が読みやすそうですか？ A / B で教えてください。
フォームUI、どれを使う？ 「1つ選ぶ」 「複数選べる」 「ON / OFFを即時反映」 「覚えている日付」 見た目ではなく、選び方から整理すると判断しやすくなります。 迷ったとき用に、6つを1枚にまとめました。
投票ありがとうございました。今回はBが優勢でした。 Bのゆとりのある配置は、こちらも読みやすく感じました。皆さんの反応も参考になります。 文章量や写真の見せ方が変わるとどう感じられるのか、これからも比べながら考えていきたいです。
2児のパパ系Web�... @techresearchlab
3K Followers 6K Following AI・Mac・ガジェット・技術ネタ🚀を毎日1記事ブログで発信してます！ エンジニアの人からちょっとPC作業する人向けに、なるべく便利な情報を届けていきたいです (^_^) AI速報やエンジニアあるあるもブログで発信してるんですが、最近これが人気みたい✨ web系エンジニア11年目/立教大学卒/バスケ好き
Web Design Museum @WebDesignMuseum
212K Followers 4 Following Web Design Museum exhibits thousands of screenshots and videos of websites, apps, software, and Flash games from the 1990s to the late 2000s.
𓂃 *ꫂ ོ𓂃 @auroraakiss
43K Followers 1K Following Lost in vintage dreams 𓂃 *ꫂ ོ𓂃 ♡ Timeless dresses • Eternal elegance • Forgotten grace Old soul collecting moments from another era ✧
Sci-Fi Archives @SciFiArchives
124K Followers 351 Following The Best of Science Fiction For Promotion - DM or Email: [email protected]
Ramin Nasibov @RaminNasibov
871K Followers 79K Following Branding & Visual Identity Designer ✦ Available for new projects: [email protected]
UX Collective @uxdesigncc
274K Followers 3 Following Curated stories on user experience, usability, and product design. By @fabriciot and @caioab.
A List Apart @alistapart
118K Followers 360 Following Since 1998, the design magazine for people who make websites.
Smashing Magazine �... @smashingmag
810K Followers 2K Following An online magazine for designers and web developers. Questions? We've got your back: @SmashingSupport, @SmashingConf. Curated by Iris, Vitaly and the team.
monopo @monopo_jp
4K Followers 272 Following 東京発、ロンドン、サイゴン、ニューヨーク、パリにオフィスを構えるグローバルクリエイティブエージェンシー。 For EN tweets 🌏 → @monopo_en
MDN Web Docs @MozDevNet
49K Followers 5 Following The official MDN Web Docs account. We deliver the best web docs around.
Deque Systems @dequesystems
8K Followers 1K Following Leader in #accessibility for web & mobile apps. Makers of axe. Hosts of #axecon. We’ve got audits, training & tools to make your site better & compliant.
Nielsen Norman Group @NNgroup
113K Followers 41 Following User advocates offering evidence-based user experience (UX) research, training, consulting. Visit our website for free UX articles. #nngux
せきゆおう🇯�... @wurst_design
27K Followers 964 Following 日本人｜Webデザインと実装の橋渡しや効率化が得意なWebクリエイター｜Web制作アンケートもよく取ります｜Voicyパーソナリティ｜2023年Coloso講座リリース、上半期カテゴリ別BEST講座｜朝までマークアップ、CSS Nite単独出演｜ギークリ2025東京出演｜きのこの山派｜Amazonアソシエイト参加中
深津 貴之 / THE G... @fladdict
234K Followers 1K Following THE GUILD。 noteのCSOと弁護士ドットコムCXO、AIまわりの設計等をやってます。 書き物 → https://t.co/9ZbQ0hsMAr
sogitani / baigie inc... @sogitani_baigie
103K Followers 6K Following 採用マーケティングに強いベイジの代表。NTTデータ→制作会社2社→フリーランス→起業。採用、マーケティング、コンテンツ、SNS、デザイン、組織デザイン等、幅広いテーマで活動。登壇執筆多数。2022年4月福岡移住。イエベ春。
Designship @Designship_jp
7K Followers 0 Following 一般社団法人デザインシップの公式アカウント。日本最大級のデザインカンファレンス https://t.co/SAqezd8Ol6 / フリーランス集団のデザインスタジオ https://t.co/hEgbWtR89G などを運営しています。
Takram @Takram_ja
16K Followers 104 Following Takramは、世界を舞台に活躍するデザイン・イノベーション・ファームです。未来をつくる人や組織のパートナーとして、プロダクトからサービス、ブランド、アイデアまで、デザインの力で変化を生み出していきます。
Studio | Web制作を... @StudioDesign
22K Followers 3K Following Studioは、コードを書かずにWebサイトの構築・公開・運用が完結するノーコードWeb制作プラットフォーム。 Agentic Web Platform → @StudioDrop_ クリエイターのための次世代フォトストックサービス → @StudioStock_
Goodpatch Inc. @GoodpatchTokyo
18K Followers 191 Following 「デザインの力を証明する」東証グロース上場のデザインカンパニー、グッドパッチの公式アカウントです。 @ReDesigner_jp @ReDesigner_St @strap_app @GoodpatchAW @studiodetails @MutureCorp @pand_design_ @layermate_ai
Figma Japan @FigmaJapan
25K Followers 86 Following デジタルプロダクトを共に創る人々のためのデザイン＆開発プラットフォーム。日本語でFigmaの情報を発信します！ ✉️ 製品や広報に関するお問い合わせフォームからYou might like
