まぎらわしいサイトデザインでユーザーをだます「ダークパターン」いろいろまとめ
ユーザーをだまして判断を誤まるように誘導するような、悪意のあるウェブサイトのデザインを「ダークパターン」といいます。ダークパターンは、ユーザーのプライバシーを侵害したり、ユーザーにより多くのお金を使わせようとしたりするため、問題視されています。そんなダークパターンに該当するさまざまなケースをまとめたサイト「Dark Patterns Hall of Shame(HOS)」が公開されています。 Collection of Dark Patterns and Unethical Design https://hallofshame.design/collection/ ◆しつこい要求 「しつこい要求」は、アプリやウェブサイトで通知や連絡先へのアクセス許可をユーザーに何度も求めるという手口です。ユーザーは何度も拒否しますが、最終的には根負けして許可してしまうケースがよくあります。 HOSはTik
UIデザインで中央配置がずれてしまう理由と解決方法
UIデザインには、至る所に中央揃えが使用されます。 しかし、アイコンとテキストが美しく揃わない、テキストがボタンの中央からずれている、そんなことはありませんか？ UIデザインで中央配置がずれてしまうときの理由、実装時にデベロッパーができること、デザイナーができること、数字的そして視覚的な調整方法などを紹介します。すぐに実装で試したくなることばかりです。 Hardest Problem in Computer Science: Centering Things by Niki Tonsky 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに フォントにおける中央揃え line-heightにおける中央揃え アイコンにおける中央揃え アイコンフォントにおける中央揃え 中央配置がずれているのは、スキルの問題 水平方向の中央揃え
４年間、7色だけでUIをデザインし続けた話｜コウノ アスヤ
2019年にフリーランスとして独立した時すぐに声をかけていただいて、そこからずっとUIデザイナーとして関わってきた株式会社FLINTERSが今年で設立10周年なんだそうです。それを記念して、なんとメンバーでリレーしながら133日間ブログを書き続けるチャレンジに挑戦中とのこと。今回はその101日目の記事となります。 漫画アプリ「GANMA!」漫画アプリGANMA!僕が関わっているのはGANMA!のスマホアプリです。iOS向けとAndroid向けがあり、その両方のデザインを担当しています。 オリジナルの作品ですと、最近アニメ化された山田くんとLv999の恋をするなどが有名でしょうか。作品自体はいろんな漫画アプリで読めますが、原作はGANMA!発。最新話が最速で読めるのもGANMA!だけです。 GANMA!のデザイナーはずっと僕1人だけなので、僕の思想や判断がけっこう大きめにデザインに反映される
「UIの良さ」ってのはユーザビリティだけじゃないんだよ〜UNDERTALEのUI｜Yamashita Angelica
この記事には、ゲーム「UNDERTALE」のネタバレが含まれます。 ネタバレによってゲーム体験を致命的に損なう可能性が高い作品です。今後プレイする予定のある方は、ぜひプレイ後にお読みください。 UNDERTALE（アンダーテール）とは、「知る人ぞ知る」と言うにしてはあまりにも有名になりすぎたインディーゲームです。2015年にPC向けに開発され、現在はSteam、XBOX、PSVITA、PS4、Nintendo Switch…と、多くのプラットフォームで遊ぶことができます。 ほぼToby Fox氏個人で開発した作品でありながら、各メディアのGOTY（ゲーム・オブ・ザ・イヤー）に多数ノミネートされており、「メタルギアやマリオが出てくる受賞ランキングに個人開発ゲームが入ってるってどういうことだよ！！！！！？？？？！！！！！」と当時せっせとゲームスタジオで働いていた私は卒倒しそうになりました。 こ
三輪士郎氏キャラクターデザインによる新しい"ソウルハッカーズ" 『ソウルハッカーズ2』
『デビルサマナー ソウルハッカーズ』（1997）のリリースから25年。待望の新作『ソウルハッカーズ2』がリリースされた。前作の世界観を踏襲しつつも、まったく新しいキャラクターと世界が織りなす物語がいかにして創造されたのかを紐解く。 ※本記事は、CGWORLD vol.290（2022年10月号）掲載の記事を再構成したものです Interviewee アトラス 写真上段左から プロデューサー＆ディレクター、チーフデザイナー：石田栄司氏 テクニカルアーティスト、リードモーションデザイナー、リードモデリングデザイナー：安本 拓氏 リードフィールドデザイナー：川瀨貴義氏 写真下段左から リードバトルデザイナー：土肥正和氏 エクストラデモデザイナー：山田 亮氏 インターフェイスデザイナー：寺田友紀氏 モデリングデザイナー：杉澤 雄氏 Information 発売・開発：アトラス リリース：発売中 価
人間の危機管理能力に訴えかけている“不快なデザイン”を展示している『不快のデザイン展』が気になる「失敗例じゃなくわざとなのが面白い」
Yoshihiro Shindo @beinteractive Unity / UI / 手品 / 仕事はデジタルゲーム開発です 🐽「レッツプレイ！オインクゲームズ」UIデザイン・演出→ store-jp.nintendo.com/list/software/… 🃏 手品してます→ @flsdsgn youtube.com/channel/UCzGKn… 🎲 ボドゲ作ってました→ @ptsrdlm beinteractive.jp Yoshihiro Shindo @beinteractive 「不快のデザイン展」見てきました。苦さで誤飲を防ぐゲームカード、不穏な音で危険を知らせるチャイム、読みにくくすることで記憶力を上げるフォントなど、五感に訴えかける不快さをどのようにデザインに利用するかという、UI デザイナーが大好物な話が沢山ありました。オススメ。 pic.twitter.co
ブラウザ版はてなブックマークで「マイナス評価」ボタンを試験導入します - はてなブックマーク開発ブログ
いつもはてなブックマークをご利用いただき誠にありがとうございます。はてなブックマーク開発チーム、ディレクターのid:yone-yamaです。 本日よりブラウザ版はてなブックマークで、「マイナス評価」ボタンの試験導入を行います。 この変更は、以下の告知内でも触れている通り、ブックマークコメントの健全化を目的とした施策の一環となります。 bookmark.hatenastaff.com 「マイナス評価」ボタンについて 「マイナス評価」ボタンは、ブラウザ版はてなブックマークのコメント一覧ページに、各ブックマークコメントごとに表示されるボタンです。はてなスターとは異なり、1つのコメントに対して1回のみ押すことができます。 使い方としては、コメントの内容や表現に疑義や違和感があるなど、ご自身にとって望ましくないと感じるコメントに対してご利用いただくことを想定しています。 この「マイナス評価」ボタンは
UIデザインの「あれ」の名前を知ろう｜株式会社ドヴァ
こんにちは。ドヴァ マーケティングサービス部所属デザイナーのマリコです。 WebのUI・UXデザインの仕事をしていると、デザイナー同士なら「ここのデザイン、コレをこうしたい（身振り手振り）」だけでほとんど伝わるけど……、クライアントに説明するときはそのイメージと一緒に、正式名称で正しく伝えるようにしよう、と思うことがよくあります。 でも、パーツデザインの名称って意外と知られていないものが多いので、今回はその一部を紹介します。「これは絶対この名前で、それ以外は間違いです！」というわけではなく、さまざまな呼び方がある場合も多いため、こういう呼び方もあるんだなぁという気楽な感じで読んでいただければ嬉しいです。 『三本線のボタン』⇒ハンバーガーメニューボタン 今や、どのWebサイトでも使われている超定番のナビゲーションメニューボタン。名前のとおり、ハンバーガーのパティとバンズのような形状からこの名
Stable Diffusion web UIのインストールと使い方
今回は、「Stable Diffusion web UI」をWindowsやMacにインストールする方法と、その使い方を紹介します。 Stable Diffusion web UIについて Stable Diffusion web UIは、ブラウザをインターフェースとして利用して、AIによる画像生成を行うことができるツールです。 GitHub[AUTOMATIC1111/stable-diffusion-webui]（https://github.com/AUTOMATIC1111/stable-diffusion-webui） Stable Diffusion web UIでは、次のような画面をブラウザで動かすことができ、かんたんにAIによる画像生成を行うことができます。 この、ブラウザを使うというスタイルのおかげで、Windowsでも、Mac(Apple Silicon)でも、Linu
イラスト画像から逆向きに画像生成AIのプロンプト用にDanbooruタグを見つける「Deep Danbooru」を「AUTOMATIC1111版Stable Diffusion web UI」で使う方法まとめ
Stable Diffusionなどの画像生成AIは、「プロンプト」と呼ばれる文字条件から画像を生成します。Waifu-DiffusionやNovelAIなど、二次元イラストに特化した画像生成AIは、二次元イラストサイトのDanbooruにアップロードされた画像で学習しています。そこで、Stable DiffusionではなくDanbooruのタグで画像を生成する手助けになる機能「Deep Danbooru」が、Stable DiffusionのウェブUIの決定版である「AUTOMATIC1111版Stable Diffusion web UI」で簡単に利用できるようになったので、実際に使ってみました。 GitHub - AUTOMATIC1111/stable-diffusion-webui: Stable Diffusion web UI https://github.com/AUTO
画像生成AI「Stable Diffusion」で自動生成された画像からどのようなプロンプト・呪文だったのかを分解して表示できる「CLIP interrogator」の使い方
2022年8月に一般公開された画像生成AI「Stable Diffusion」を簡単にWindowsローカル環境に導入でき、コマンドラインではなくブラウザ上に表示されるユーザーインターフェース(UI)から操作可能にするツールがAUTOMATIC1111版Stable Diffusion web UIです。AUTOMATIC1111版Stable Diffusion web UIはただ画像を生成するだけではなく、画像生成時に入力する文字列(プロンプト)について複数の組み合わせを一気にチェックしたり、画像生成の条件を複数設定して一度に画像を生成したりするなど、Stable DiffusionのUIとしては決定版といってもいいほど機能が充実しています。そんなAUTOMATIC1111版Stable Diffusion web UIでは、AIで生成した画像を解析してプロンプトを表示する「CLIP
なぜ、ハイパーリンクは青色なのか?
Mozillaブログより。 エリーゼ・ブランチャード インターネットは私たちの生活のあらゆる場面に浸透していますが、デジタルの世界では当たり前のように使われているものがあります。それは、多くのリンク、特にハイパーリンクが青色であることに気づいたことがありますか? 同僚が何気なく「なぜ、リンクが青いのか」と聞かれた時、私は戸惑いました。2001年からウェブサイトを制作しているユーザ・エクスペリエンス・デザイナーの和tがしは、常にリンクを青くしてきました。私は青の特定の色調を提唱してきました。しかし、「なぜリンクが青なのか」と疑問に思ったことはありません。それはただの事実でした。草は緑で、ハイパーリンクは青です。文化的に、私たちはリンクを青色に関連付けているため、2016年にGoogleがリンクを黒に変更したときには、かなりの混乱が生じました。 しかし今、私は「なぜ、リンクが青なのか」と言う疑
Web Content Accessibility Guidelines (WCAG) 2.0
【注意】 この文書は、2008 年 12 月 11 日付の W3C 勧告「WCAG 2.0」 (原文は英語)を、情報通信アクセス協議会の「ウェブアクセシビリティ基盤委員会 (WAIC)」が翻訳と修正をおこなって公開しているものです。この文書の正式版は、あくまで W3C のサイト内にある英語版であり、この文書には翻訳上の間違い、あるいは不適切な表現が含まれている可能性がありますのでご注意ください。 【注意】この文書にはより新しいバージョンが存在します: Web Content Accessibility Guidelines (WCAG) 2.1 W3C 勧告 2008 年 12 月 11 日このバージョン: http://www.w3.org/TR/2008/REC-WCAG20-20081211/ 最新バージョン:http://www.w3.org/TR/WCAG20/前のバージョン:
『聖剣伝説 Legend of Mana』原作フォントへの関心が再燃、当時の開発者から開発秘話が語られる。1文字1文字に込められた“津田イズム” - AUTOMATON
スクウェア・エニックスが2月18日に発表したHDリマスター版『聖剣伝説 Legend of Mana』。リマスター版ではグラフィックを高解像度化。一部の背景やUIも新たに描き直され、作品全体が現世代向けにリファインされている。その美しく描き直された要素のひとつが注目を集めたことから、原作発売から20数年が経った現在、当時の開発者から開発秘話が語られているようだ。 『聖剣伝説 Legend of Mana』といえば、ワールドマップに街やダンジョンとなるオブジェクトを配置し、プレイヤー自らがファ・ディールの世界を構築していく「ランドメイクシステム」が特徴。従来シリーズとは異なるベルトアクション方式のバトルも目玉となる。それらと同様に、きめ細やかなピクセルアートで描かれた、絵本のような暖かみのあるビジュアルも本作ならではの魅力といえよう。 先日公開されたリマスター版のトレイラー内では、ブラッシュ
デザインはすこしの工夫ですごく良くなる！確かなデザイン力が身につく良書 -人を動かすデザイン22の法則
デザインが上手くなりたい、自分のデザインをよくするためにはどうすればよいか、そんな悩みをもっている人に確かなデザイン力が身につく良書を紹介します。 プロのデザイナーによるデザインの思考プロセスが丁寧に解説されており、UIデザイン、グラフィックデザイン、プロダクトデザインの実例を見ながら、しっかりとデザインの理論とテクニックを学べる一冊です。 デザインに使用されたさまざまな工夫がよく分かり、知的好奇心も刺激されます。 本書は当ブログでも大好評だった「デザイン力の基本（紹介記事）」のウジ トモコ氏の新刊です。前書が未の人でも大丈夫、「人を動かすデザイン22の法則」はUIデザイン、グラフィックデザイン、プロダクトデザインで、今すぐに使いたくなるデザインが満載の一冊。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Microsoftが「エクスプローラー」にさらなるテコ入れ ～ファイル詳細パネルが近代化へ
スマホの「フリック入力」から日本が見えてくる【西田宗千佳のイマトミライ】
ControlNet用のポーズを簡単に作れる「Openpose Editor」の使い方【Stable Diffusion web UI】
地味だけど歴史的英断？ Googleの検索結果ページ、連続して読み込まれる仕様に変更へ【やじうまWatch】
「Meiryo UIも大っきらい!!」がWindows 11に対応 ～システムフォントの変更ツール【3月1日追記】／好みのフォントを選ぶだけのシンプルなデザイン。誤検知対策済みバージョンが公開
