タグ

UIに関するabababababababaのブックマーク (15)

  • Googleマップの新しい外観に元Googleマップデザイナーが苦言

    Googleマップは2023年9月頃から新たな外観のテストを実施しており、すでに新たな外観のGoogleマップを使っている人も多いはず。そんなGoogleマップの新外観について、15年前にGoogleマップのデザインに携わったプロダクトデザイナーのエリザベス・ララキ氏が苦言を呈しています。 15 years ago, I helped design Google Maps. I still use it everyday. Last week, the team dramatically changed the map’s visual design. I don’t love it. It feels colder, less accurate and less human. But more importantly, they missed a key opportunity to…

    Googleマップの新しい外観に元Googleマップデザイナーが苦言
  • 【追記あり】ソシャゲやってる女性プレイヤーに言いたい

    ゲームに関してお気持ちメールの文章長すぎて殆ど効果なくなってます 窓口担当の大半は自分含めて3行以上文章読むと死ぬので3行以内にまとめて欲しい 基カスみたいなスパムとか言い捨てメール以外は全部開発に共有するんだけど、開発の時間も有限なのでお気持ち長文メールは3行以上あるとこっちで勝手に添削して共有するのが基(少なくともうちの会社では) そしてその添削のセンスは窓口担当の気力と知能に依存するので長い文章の意が全然違った形で伝わる事も珍しくない 文章量的には特にシナリオの話だと300文字以内にまとめてくれるとそのまま回しやすいのでそうしてくれると助かる ただUI関係は専門部署にそのまま投げるからいくらでも長文書いて構わない 野郎向けのソシャゲで要望通りやすい傾向あるのは男性向けの場合口調はチンピラみたいなのでも意が明確であることが多いから あと女性向けソシャゲは開発は女性多くとも窓口担

    【追記あり】ソシャゲやってる女性プレイヤーに言いたい
    abababababababa
    abababababababa 2023/11/20
    逆にさ、男性向けのエスカレしてた時、2文字ばつかだった。バカ、カス、アホ、●ね、そっ閉じ。ガチャ爆死しても反射で送らないで欲しい。一時期真剣に受け止めてしまって病んだ。その後増えすぎて中間業者いれた。
  • ゲームを海外展開したいと思っている開発者の皆様へ翻訳者からお願いしたいこと「最初から翻訳を前提にしたUIや言葉回しを考えて欲しい」

    Marco Godano @GodanoMarco ゲームをいずれ海外展開したいと思っている開発者の皆様、翻訳者からの申し出です。 【日語は、異常に文字数効率の高い言語です。】 極めて短いスペースで沢山情報が伝えられます。英語を含めてアルファベットを使う言語ではそうはいけません。 (続↓) 2022-09-30 14:47:09 Marco Godano @GodanoMarco 自然な翻訳にしようと思うも場所が全く足りないなんて日常茶飯事。 っちゅうわけで、日語を元に作ったUIを見た時に、翻訳者達は頭を抱えるしかありません。 「外国語知らないからどの位長くすればいいのかさっぱり」とお悩みなら、まずは「熟語」を広げてみてください。 (続↓) 2022-09-30 14:47:09 Marco Godano @GodanoMarco そうやって広げた言葉の全角文字数を倍にすれば、十中八九

    ゲームを海外展開したいと思っている開発者の皆様へ翻訳者からお願いしたいこと「最初から翻訳を前提にしたUIや言葉回しを考えて欲しい」
    abababababababa
    abababababababa 2022/10/02
    あー。もうなるべく全部記号にしようぜー。
  • 待機状態のUIについて整理してみる(デザイン編)

    Introduction 概要 待機状態 UI のデザインについての記事です。 待機状態 UI というのは、ローディングや情報の処理待ち時に用いられる UIのことです。ここで待機状態の UI と読んでいる理由は、各デザインシステムやガイドラインなどで言い方が違うため、今回はこのように言及させてください。 この記事では、既存のデザインガイドラインや既存のデザインシステムから待機状態の UI の概観、デザインにおいて考慮することをまとめます! ベストプラクティスを提案するわけではなく、作成する際、配慮することを頭に入れて思考できる記事にします。 背景、課題感 WebFront-end における各 UI の実装を行おうと考えているが、実装する際、ビジネス側やデザイン側と実装する UI について話し合って作ることが多いです。 小さなプロジェクトだと、デザイナーがいない事も多く、Front-end

    待機状態のUIについて整理してみる(デザイン編)
  • mouseover 中に表示される DOM のデバッグ | blog.jxck.io

    Update 2024-03-30: Chrome 123 から "Emulate a focused page" が追加された。 これを用いれば良いため、以降の全ての方式は古くなった。 Apply other effects: enable automatic dark theme, emulate focus, and more https://developer.chrome.com/docs/devtools/rendering/apply-effects#emulate_a_focused_page マウスが乗ってないと出ない UI も、そこに Tab などでフォーカスを移し、その状態で Dev Tools の "Emulate a focused page" を有効にすれば良い。 Intro 先日、後輩が「mouseover 中にしか表示されない DOM のデバッグ」に手こずっ

    mouseover 中に表示される DOM のデバッグ | blog.jxck.io
    abababababababa
    abababababababa 2021/08/21
    めっちゃためになった!!!うわー有難い!「Devtools の source tab を開いた状態で F8 を押す」ね~!めちゃ活用します!
  • Web制作者は1冊持っておくとかなり便利!UIに適したさまざまなアニメーションの実装方法が分かる解説書 -動くWebデザイン アイディア帳 実践編

    Webページに動きやアニメーションを加えたい、毎回検索で探している、実装の手順を解説してほしい、そんな時にすぐに役立つコピペで利用でき実装方法もカスタマイズもていねいで分かりやすい解説書を紹介します。 動きやアニメーションのコードはサポートサイトから最新版がダウンロードでき、要素表示、背景の動き、エリアの動き、画像の動き、テキストの動きなど9種類にバリエーションが100個以上あり、「この1冊が丸ごとカバー」の文字通り大全集です。 既視感を覚えた人は、大正解! 「動くWebデザインアイディア帳(紹介記事)」の第2弾で、第1弾は基的な動きでしたが、第2弾の書は実践編として「印象に関わる動き」となっています。 Web制作者は、1冊持っておくとかなり便利だと思います。こういった気持ちいいアニメーションはクライアントからの要望も多く、喜ばれます。

    Web制作者は1冊持っておくとかなり便利!UIに適したさまざまなアニメーションの実装方法が分かる解説書 -動くWebデザイン アイディア帳 実践編
  • 「レンジでチンする」みたいな言い回し 教えて

    まただよ。 「保存アイコンがフロッピーディスクなのは分かりにくい」って、仕様を理解していないから他に何も指摘できないくせに、何かしら仕事の爪痕を残そうと必死なバカが言い出した。 そういうモノなの!アイコンってのは!! 「このマークは保存ですよ。自信がなかったらマウスポインタを暫く載せておけば『保存』って出ますからね」って教えれば、30秒もかからずに覚えられるの!! そもそも、ほとんどの人は研修でWordやExcelを習ってるから、このアイコンが保存だって知ってるの!!!! 「今どきの電子レンジはチンって鳴らないけど、『レンジでチンする』って言いますよね?」っていう喩え話は同意してもらえた。 「スマホにダイヤル付いてなくても『リダイヤル』って言いますよね?」はピンときてなかったみたい。 「テレビも『チャンネル回す』って言いますよね?」もピンときてなかったっぽい。 悔しい。 他に、こういう、最

    「レンジでチンする」みたいな言い回し 教えて
    abababababababa
    abababababababa 2020/09/12
    スルーだねw重要度低って記録に書いとく。■写メの方が携帯のって通じやすい。なぜガラホがあるかといえば多数派に馴染みあるuiに合わせるから。店舗の配置を固定する如くだ。事実上の仕様に合わせるのが良いから。
  • 2020年話題の人気UIデザイントレンド8個まとめ 実例サンプル見本で紹介

    この記事では、2020年にUIデザインで人気のトレンド8個を、サンプル実例を交えながら詳しく紹介しています。 世界中のデザイナー達が参加するデザインコミュニティDribbbleでは、実際のプロジェクトの他に、クリエイティブで実験的な新しいアプローチやスタイルをつかったデザインも多数投稿されています。 では、2020年にかけて話題となっている人気デザイントレンドをみてみましょう。 コンテンツ目次 1. ニューモーフィズム 2. 3Dヒーローイラストレーション 3. モノクロパレット 4. 書体、フォントの多様性 5. 複数レイヤーのスクロールアニメーション 6. モバイルUI向けイラスト 7. インタラクティブなページ 8. 不規則なグリッドレイアウト 1. ニューモーフィズム ニューモーフィズム(英: Neumorphism)、またはソフトUI(英: Soft UI)とも呼ばれているこのト

    2020年話題の人気UIデザイントレンド8個まとめ 実例サンプル見本で紹介
  • Game Graphic Design Advent Calendar 2019 - Adventar

    ゲームのグラフィックデザインに関する記事を書きませんか? UI/UX、情報設計、イラスト、演出、アニメーション、エフェクト、ロゴ、バナー、パッケージ、マネジメント…etc ゲームのデザイン制作に関することであれば何でもOK! 自己紹介や、個人制作物のアピールなんかもしちゃいましょう! ※UIデザインに限定するつもりでしたが、もう少し幅がほしいというご意見をいただいたので「ゲームのグラフィック」というくくりにしました。

    Game Graphic Design Advent Calendar 2019 - Adventar
  • UIのお作法。28個の「〇〇できそう感」をまとめました。|maiokamoto

    UIデザインにおいて「〇〇できそうな感」を出すことは、非常に大切です。予測される動作や意味が、自然に理解できれば、ユーザーにとって優しいデザインになるんじゃないかと思います。アイコン、大きさ、色などなど、デザインは細かい要素の積み重ね。すでに多くのユーザーに浸透し、習慣化されていそうな「〇〇できそう感」を28個まとめました。 1、進めそう感 2、戻れそう感 3、進めそう&戻れそう感 4、開きそう感(ドロップダウン) 5、開きそう感(アコーディオン) 6、開きそう感(モーダル1) 7、開きそう感(モーダル2) 8、カレンダーが開きそう感 9、メニューが開きそう感(ハンバーガー) 10、検索できそう感 11、入力できそう感 12、検索できそう + 入力できそう感 13、パスワード入力できそう感 14、パスワード感(強め) 15、間違えた感(エラー) 16、合ってる感(OK) 17、電話かかる感

    UIのお作法。28個の「〇〇できそう感」をまとめました。|maiokamoto
    abababababababa
    abababababababa 2019/06/11
    めちゃくちゃスッキリまとまっててわかりやすすぎた。
  • 制作者のためのHTML

    主にユーザー側の視点から語られることが多いアクセシビリティですが、制作という側からはどのように捉えることができるのでしょうか。2つの切り口から考えてみます。 # アクセシビリティという文脈において、何のためにHTMLを書くかという話になると マシンリーダビリティのため スクリーンリーダーのアクセシビリティのため というように、ユーザーが利用するため、というところにフォーカスした語られ方が多いように感じています もちろんユーザーのために作るというのは正しいのですが、今回はあえて視点を変えて、制作者自身の作るというところに視点を合わせて話してみたいと思っています 僕がどういうものなのかというと、 # 参照: 全部入りHTML太郎(@_yuheiy)さん | Twitter ツイッターでは「全部入りHTML太郎」という名前でやっています # 参照: シフトブレイン/スタンダードデザインユニット

    制作者のためのHTML
  • 安室透の起爆スイッチがタッチパネルだった

    物理のボタンに対する信仰心が高いという話。 久しぶりにコナンの映画を見てみたら、安室透がスマートフォンのタッチパネルで爆弾の起爆スイッチを押していた。極めて慎重にセッティングされた爆弾を、緊張の面持ちで、つめたいガラスの画面に親指を軽く押しつけていた。 軽くタッチパネルの硝子に触れただけで、その爆弾はスマートフォンから送られた着信を受信し、爆発したのである。 この文章を読んで何がなんだか分からない方は2018年に公開された『ゼロの執行人』をレンタルかBDを購入して観て頂くとして、ともかく、その起爆スイッチを押すシーンというのは、私の中ではこの映画の中では三指に数えられるほどに印象的なシーンだった。 もちろん、20年も前に始まった漫画のキャラクターがスマートフォンを使っている事に驚いているわけではない。最近原作を一から読んでいるけれど、巻が進むにつれ新しい概念を取り入れている大変面白い作品

    安室透の起爆スイッチがタッチパネルだった
    abababababababa
    abababababababa 2019/02/10
    これからスマホネイティブは違和感通じなくなるんだろうなぁ。いい増田でした。ボタン信仰は深いと思う。そういえばスマホでも画面がぷっくり浮かぶデザインが開発中ってあった気がする…実物見てないけど(´・ω・`)
  • 任天堂が新人研修で伝えている、あそび心のデザイン|娯楽のUI 公式レポート #1 | キャリアハック(CAREER HACK)

    [目次] ・「みなさんとクイズをしたいと思います」 ・任天堂流「伝え方」のこだわり ⅰ教えるよりも体験してもらう ⅱファーストインプレッションを大事にする ⅲ体験は面白く ・わかりやすさと高機能を兼ね備えた、UIのデザインプロセス ・「あそび心を伝えるUIデザイン」3つのポイント ⅰUI脳と娯楽脳の二人三脚 ⅱ短所を「娯楽脳」で長所へ変える ⅲ将棋3席 麻雀5席 「みなさんとクイズをしたいと思います」 ※ 2018年4月に開催された「UI Crunch #13 娯楽のUI - by Nintendo -」のレポート記事としてお届けします。 「まずは、みなさんとクイズをしたいと思います」 そんな、あそび心溢れる一言で幕を開けた『娯楽のUI - by Nintendo -』。任天堂で働く現役デザイナーによるデザイン解説セッションだ。 UI/UXデザインチーフである正木義文さんが語ったテーマは「

    任天堂が新人研修で伝えている、あそび心のデザイン|娯楽のUI 公式レポート #1 | キャリアハック(CAREER HACK)
  • 任天堂デザインの輪郭 / UI Crunch #13 娯楽のUI イベントレポート|スワン

    こんにちは、スワンです( 'ω') noteではしばらくご無沙汰してたのですが、今回激戦を極めた「UI Crunch #13  娯楽のUI」に奇跡的にnoteレポート枠で受かったので、花金に早々に仕事を切り上げてご機嫌でイベントに行ってきました。 噂によると倍率40倍近くだったそうで「全盛期の東京芸術大学の受験倍率かよ」って突っ込みたくなりました(笑)ありがたい機会をゲットしたとともにいけなかった方々にこの興奮を還元するべくゴリっとイベントレポートをまとめてみようと思います。 前がき私事ですが、ちょうどこの春で働く環境が変わり、株式会社メルペイでデザイナーとして働くことになりました。社会人になって初めての、自分を取り巻く「場所」や「人」が大きく変わる体験。そしたら、まだ働き始めて当に間もないのだけど「場所が変わるとこんなにも入ってくる情報の種類が変わってくるんだな〜」という予想外の驚きが

    任天堂デザインの輪郭 / UI Crunch #13 娯楽のUI イベントレポート|スワン
  • 会議を可視化・構造化する5つのコツとは? グラフィックレコーディング実践編 | フルスイング - DeNA

    議論や会話をリアルタイムで絵に描き、可視化して共有する手法であるグラフィックレコーディング。その概要やコツを解説する前編に続き、後編ではシステム&デザイン部 デザイン戦略部の和波里翠が実際にどんなことを考えながらグラフィックレコーディングしているのかを、彼女が参加したミーティングの模様をレポートする形でご紹介します。 今回参加したのは、小説やコミックなどの投稿コミュニティサイト「エブリスタ」のUIUX改善ミーティング。参加者は「エブリスタ」のプロダクトオーナー 佐久間亮とデザイナー 玉腰理恵、そして普段はヘルスケア事業のUIUXデザイナーを務めている和波里翠の3名です。和波はいかにして会話の内容を整理し、グラフィックレコーディングに“フルスイング”しているのか。そのノウハウをぜひご覧あれ! 【前編】会議の「伝わらない!」を可視化で解決。描いて語るグラフィックレコーディング ①徹底的に

    会議を可視化・構造化する5つのコツとは? グラフィックレコーディング実践編 | フルスイング - DeNA
  • 1