その場で最適解を出すデザインは破綻する | ベイジの日報
デザインしていく中でデザインルールがバラバラになったことはないだろうか。 私の課題として、そのパーツ単位では見やすく、使いやすいものを考えられても、サイト全体で見た時にUIのデザインルールがバラバラになってしまう事がある。 その場ごとに最適解を出すデザインとは 例えばリンクの横にアイコンを配置する場合のデザインルール。 リンクが縦に並ぶとテキストの長さにバラつきがあるので、矢印は左にあった方が見やすい（アイコン左のルール） 外部リンクマークは一般的に右側が多く見られるので右側が自然（アイコン右のルール） アコーディオンの「+」アイコンは右に配置し縦が揃っていたほうが見やすい（アイコン右縦揃えのルール） ボタンは矢印が右にある方が見やすい（ボタン系は右にアイコンのルール） お問い合わせのメールアイコンはテキストの左側が見やすい（文字の左側にアイコンルール） …この様にその場その場で最適解を出
値段の「¥マーク」を小さくしたら購入率が大きく改善された。機能は「体験」で成果が激変する。10周年の「メルカリ」に聞く新機能の開発の裏側。3つの成功施策。｜アプリマーケティング研究所
値段の「¥マーク」を小さくしたら購入率が大きく改善された。機能は「体験」で成果が激変する。10周年の「メルカリ」に聞く新機能の開発の裏側。3つの成功施策。 10周年を迎えた「メルカリ」さんを取材しました。 株式会社メルカリ Product Manager 塚本 佳実さん、UX Design Manager 宮本 麻子さん「メルカリ」について教えてください。塚本： 「メルカリ」は、国内最大手のフリマアプリです。2023年の7月にサービス開始からちょうど10周年を迎えました。 直近のアクティブユーザー（MAU）は2,200万人以上に、四半期のGMV（流通金額）は2,500億円以上に到達しています。 累計だと30億品以上が出品されていて、販売の速度でいうと「1秒間に7.9個の商品が売れている」というデータもあります。 この10年間でのトレンドの変化としては、取引されている「ブランド」にも変化が出
UIデザインで、なぜダークモードにおけるグレースケールは難しいのか、人がカラーとコントラストを知覚する感じ方
ライトモードだといい感じのグレースケールが、ダークモードにすると特に暗いグレーあたりのコントラストが低くなることがあります。 これは人がカラーとコントラストを知覚する感じ方に関係があります。どのようなメカニズムでそう感じるのか、ダークモードでもいい感じのグレースケールにするにはどうすればよいのかを解説します。 Darkmode by Dan Holick 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 ダークモードのグレースケールを作成するのが難しいのは、なぜだと思いますか？ それは、人がカラーとコントラストを知覚する感じ方に関係があります 👇
【まとめ】2022年に話題になったWebサイト - Qiita
はじめに としが明け、2023年になり、2022年を振り帰ったり、今年の目標を立てている頃でしょうか？ みなさんは2022年どんな1年でしたか？ この記事では、2022年に話題になったWebサイトをまとめて、 みなさんの振り返りや今年の目標や勉強することの参考にしてみてはいかがでしょうか？ POLA https://www.pola.co.jp/wecaremore/mothersday/ 母の日に合わせて公開された↑この特設サイトは、スクロールに合わせて、だいぶスムーズに花がアニメーションしていくサイトです。 一回サイトに訪れると、その没入感にサイトから抜け出すタイミングがなくなるでしょう。 Pokémon Online Gallery https://onlinegallery.pokemon.co.jp/ja/ ポケットモンスター スカーレット・バイオレットの発売を記念して公開された
もっと早くデザイナーに声をかけろ
SIerのインハウスデザイナーとして働いてるんだけど、うちの会社の業務フローがクソすぎてストレスが溜まっている。 あの、PMのみなさん、ていうか我が社の開発標準つくってるみなさん。 外部設計とか機能設計とか、「設計」ってついてる工程にデザイナーをアサインしてください。 デザインって「設計」っていう意味なので。 別に、知識マウントとか偉ぶってるとかでもなんでもないです。 外部設計も機能設計も社内のエンジニアがエクセルで作っているけど、なんでデザイナーを呼んでくれないんですか？ あなたたちがやってるそれ、デザインですよね？ そのくせエンジニアは、自分が設計書を作っていても「デザイン」をしているという自覚は全くない。 それどころか「自分にはセンスが無いから〜！」と変にデザイナーを持ち上げてくるんだけど、あなたたちのやってることもデザインですよ。 なのに、自分たちだけですっかり外部設計とか機能設計
高齢者向けサービスにおけるUIデザイン｜『高齢者のためのユーザインタフェースデザイン』の書評
現在、本業・副業ともにWEBデザイナーとしてデザイン・コーディングをしているゆるけーです。 本業で携わっているWEBサービスが割と高齢者向けのサービスで、ITリテラシーやUIが今の自分と考え方が異なるよなーと思っているなか、『高齢者のためのユーザインタフェースデザイン』という書籍に出会いました。 高齢者関係なく普通にアクセシビリティの観点でも重要な視点がたくさんあり、とてもいい書籍だったので、ざっくり大事だと思った箇所を抜粋しつつ自分で探した事例等をざっと記事にまとめていきますー。 視覚 高齢者になると視力が低下する傾向があります。ただ、視力の低下＝フォントを大きくするだけではありません。 視力の低下は老眼や光覚の減少などより複雑です。 主な視力の低下の具体例は以下のような点。 老眼：近く・遠くのものの焦点が合わない 周辺視野のぼやけ：画面の端に気づきにくい 中心視野の損失：画面の中央が暗
"牛乳パック"どっちが好きですか？｜内田 広由紀｜視覚デザイン研究所
一部内容修正につきまして 今回の記事も多くの反響をいただき沢山の方に読んでいただいたことを大変感謝しております。 このシリーズの趣旨は、デザインの過程をわかりやすくし多くの人にとって役立つスキルにすること、またジャンプ率などの「視覚スケール」を知って有効活用していただくことにあります。「視覚スケール」は商品パッケージから建築物のような大規模なものまで一貫して使える便利なツールです。 「視覚スケール」を説明するため、アンケートの方法や脳が選択するしくみについて、皆様に不安や誤解を招いてしまう表現があったと思います。これらを踏まえ、一部内容を加筆修正させていただきました。（記事での主張に関しての変更はありません。） 当室ではこれからもご意見・ご質問などをなるべく反映させながら、わかりやすい記事を作りたいと考えております。どうぞよろしくお願いいたします。 こんにちは。 絵本と美術書の出版及び、デ
「排除ベンチ」抵抗した制作者が突起に仕込んだ「せめてもの思い」
「さすがに、必要ですよね」 そもそもベンチがない問題 「恐れていることが本当に起きるか」を知る まちなかで見かけるベンチに、仕切りや手すりのような突起がついていることは「当たり前」の風景になっています。そんな「排除ベンチ」の一つが、先日、ツイッターをきっかけに形を変えました。〝突起〟が動いたのです。当初から〝突起〟に抵抗していたというベンチの制作者。実は、ベンチにある仕掛けをしていました。「みんな排除に慣れてしまっている」。制作者の言葉から、公共空間の過ごし方について考えます。 可愛らしいデザインで〝排除〟 7月8日。東京都中央区の京橋に設置されたベンチに、作業員が集まりました。木製のベンチを１台１台裏返し、ベンチの座面を３つに区切っていた「突起」のボルトを外し、突起を動かしました。
「開け口」から切るとレシピも切れちゃう…食品パッケージの“モヤッ”に共感続々 キユーピーに理由を聞いてみた｜FNNプライムオンライン
食品パッケージの「なんで？」が話題 インスタント食品や料理の素などのパッケージについている「開け口」の表示。それに従ってビリッと袋を開け、さあ作り方を読もうとパッケージを裏返してみると、レシピの部分がちょうど破れて読めない！ 誰もが一度は体験した事があるだろうそんな現象について、Twitterユーザーのオヨネ（@Dq4O4ne）さんが投稿した画像が共感を集めている。 「なんなん、なんであけくちの下に作り方書くん？なんなん？」 オヨネさんが投稿したのは、キユーピー株式会社が販売している「キユーピー3分クッキング 野菜をたべよう！チャウダーの素」を「あけくち」に従って開けたところ、パッケージ裏面に記載された必要な野菜の分量やレシピがちょうど真っ二つに切れてしまったという写真だ。 この記事の画像（5枚） この投稿には「わかる！ちょうどいい位置にある」「他のメーカーでもある、なんでなんだろう」の声
シャニマスのチェックボックスから見る色弱者の世界｜謝罪Ｐ
先日のアップデートでシャニマスのUI周りに色々と手が加えられた。 その中でも個人的に嬉しかったのは、ソートに関連するチェックボックスのON/OFFが見やすくなっていたことだ。 大多数のユーザーにとっては「まあ確かにね」くらいのものかもしれない。しかし私は「これでようやくまともにソート機能が使える」とひそかに歓喜した。一部のユーザーも共感してくれるのではないだろうか。 なぜなら私の目に映った変化は以下のようなものだったから。 チェックの光沢の有無でかろうじて判別していた（ひよこ鑑定士か？）この見え方の差異は、私が『色覚マイノリティ』、いわゆる『色弱者』であることに起因する。 『色弱者』って何？光（色）を感じる視細胞が何らかの原因により欠損、または十分に機能しないことによって色の見え方が一般とは違う人のことを、本記事では『色弱者』という呼称で表記する。 日本人男性の5％、女性の0.2％がこの色
新聞広告,KINCHO,金鳥,大日本除虫菊株式会社
日々状況が変わる毎日です。だれも、先のことはなにも想像できない2020。 この広告の掲載日に、世の中の空気はどうなっているのか、人々の気分はどんな調子なんだろうかと考えあぐねて、 いろんなバリエーションを用意しました。 ※縦読みすると？ 広告する製品は、キンチョウの まったく新しいゴキブリ駆除剤「ゴキブリムエンダー」です。 お部屋にたった数プッシュ（6畳なら4プッシュ）するだけで、 部屋中のゴキブリをまるごと退治できるその効果はまるで 「くん煙剤」の威力。煙じゃないのに煙の効きめ。 革命的な新製品、キンチョウ「ゴキブリムエンダー」の広告です。
北欧のUXデザイナーが日本の文化から学んだこと
Usable MachineのUXデザイナー/Design Matters。デザインと技術に関して書くことが大好きなデザインオタクです。 日本人は、複雑なデジタルテクノロジーを使いこなし、伝統文化からインスピレーションを引き出すことの本当の意味を理解していると言えます。私たちは北欧のデザイナーとして、日本のデザインと文化から学ぶべきものを見つけたいと思いました。そこで私たち、Design MattersのJulieとMichaelは、デジタルデザインの新しい視点を見つけるために東京に５日間、滞在してみることにしました。 日本はデザインの文化においてクオリティの高さは良く知られていて、特にテクノロジーの分野で高い評価を得ています。しかし、日本のデジタルプロダクトと非デジタルプロダクトのデザインはまったく異なることに気が付きました。インテリアデザインを始めとした日本の非デジタルデザインについて
デザインを「見る」訓練をしている話。4つのステップと勉強法｜せんざき｜n2p designer
どうもご無沙汰しておりますせんざきです。 最近、デザインを見る訓練をすごく重視してやっています。 このテーマは、タイトルだけ書いておいて、まだ書く時じゃないなあと思いながら温めていたものです。 正直まだ、書く時じゃないなあという感じもするのですが、どういうことなのか言語化できそうな段階まで来たので、メモがわりに書き起こしていこうと思います。 はじめにまず、「デザインを見る訓練ってなんやねん」っていう話をします。 本当にここ数ヶ月、デザイナーにとっての見る力の大切さを日々感じているんです。 このツイートは、見る力について書いていて、結構反響があったものです。 原研哉さんが運営してる低空飛行っていうサイトがあるんですけど、ここの写真や映像、iPhoneで撮ってるらしい、、 目が良ければiPhoneでもこんなに綺麗に撮れるんだなあhttps://t.co/S7WBO3JSG8 pic.twitt
デザイナーがスタートアップをつくり、EXITするということ
2012年に日本初のフリマアプリ『フリル』をつくって6年、2016年に楽天にEXITしてもうすぐ2年が経とうとしている。少し時間ができたので、その間に学んだ色々なことを書き残しておこうと思う。 まずは僕自身の経験を通して、デザイナーが「スタートアップを創業する」というキャリア選択について記したい。これは起業を勧めるものではなく、あくまで個人的な手記ではあるけれど、学生や若手デザイナーの参考になれば嬉しい。 目次1. 新しいキャリアの選択肢 2. スタートアップの魅力 3. 創業時に必要なこと 4. どんなことをやっていくのか 5. EXITのあとで思うこと この記事は移転しましたnoteから独自ブログに移行しました！記事の全文は👇のページでお読み頂けます。
UI/UXデザイナーを目指す若手に知っておいて欲しいこと｜坪田 朋
最近増えているスタートアップで働きたいデザイナー向けの記事です。自分の経験から勧めたい・知っておいて欲しい事をまとめました。 作業環境はケチらないで投資する学生でも本気で勉強すれば1年以内にその投資を回収できるので、PCはケチらずにハイスペックなMacBook Proを買った方が良い。 稀に安いからと言う理由で、MacBook Airや旧スペックのPCで作業している人を見かけるけど、若い時ほど本質的な勉強に時間を裂いて欲しいし重い環境で作業し続けるのは効率が悪くインターンの @reo も古いPCで効率悪かったので、新品のMacBook Proを付与して、まともなソフトウェアセッティングとショートカットを教え込んだ。 ちなみに、僕がデザイナーにiMacではなく、Macbook Pro＋外部ディスプレイを勧める理由は、キーボードとトラックパッドが近いと手を動かす量が減って作業効率が良いのと、仕
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
デザイナーの業務改善
未経験から100話でキラキラWEBデザイナーを諦めるかけだしちゃん完結「最初からずっと不穏だ…」
業務系システムは『イケてるフラットデザイン』だと使いにくい？現場が本当に必要だった物との比較
UXPin | The Full-Stack UX Design Platform
JRと東京メトロの運休告知のデザイン、何故あれだけわかりやすさに差が出てしまったのか？その考察がおもしろい！
