備忘:読みたいWeb上の情報まとめ

備忘

 

心地よいUIの温度 - 言葉と気遣いで高めるUI -

UI&UX / 重要なのは、毎日さわって嬉しい UI UX!

UIデザインとUXの超基礎「UI Design & UX for ENGINEER」

5分でおさらいするモバイルUIデザイン // Speaker Deck

UI/UXデザイナーなら一度は目を通しておきたい「デザイン原則」まとめ | UX INSPIRATION!

iOSデザインガイドライン

Androidデザインガイドライン

ドナルド・ノーマン: 感情に訴えるデザインの3つの要素 | TED Talk | TED.com

シュテファン・サグメイスター 「ハッピーデザインについて」 | TED Talk | TED.com

ジョン・アンダーコフラーが示すユーザインタフェースの未来 | TED Talk | TED.com

アプリデザインのお勉強 UI/UXのお話

ニコニコ超デザイン-Metro考察編-

企画が考えるスマホUIデザイン

エンジニアのためのUIデザイン // Speaker Deck

ITエンジニアに易しいUI/UXデザイン

確実に良くするUI/UX設計

UX / UIデザインって何?

UIデザインの基本

UI設計の土台になる考え方-インテリジェントネット社内勉強会

UXのためのUIデザイン

アプリUI勉強会 in ネットイヤーグループ

女子の心をつかむUIデザインポイント - MERY編 -

スマホサービスにおける、UIデザインのノウハウと実例

UXはじめの一歩

はじめてのUXとUIの話

おかんでもわかるUXデザイン Ver.0.1

0528 kanntigai ui_ux

UXの考え方とアプローチ

[UX]は投げ捨てろ!

ネイティブアプリにおける、UI/インタラクションのトレンド

UXとブランド

なぜUXをデザインしているのか

UXデザイン実践のために押さえておきたい大事なこと 先生:瀧 知恵美

UIの話は会議室でするな

AppStoreとGooglePlayの両プラットフォームに選ばれるUI/UX最適化

UXとUXD~長期的ユーザビリティをどう作りどう測るか?

ShibuyaUX - UX and Analytics

WebSig会議 vol.33:2ndセッション「ハートに響くUIを生み出すためのデザインプロセス」

コンテンツで改善する UI デザインの極意

当たり前を当たり前だと思ってはいけない!スマートフォンUIデザイン

図解で学ぶ「Lean UX」

 

「キャンセルのキャンセル問題から考えるダイアログデザイン」を読んで

goodpatch.com

 

# 記事の要約

アラートの多用には気をつける必要がある。また、アラートの内容が否定語の場合は、そもそもアラートの形式が適切でないと考えるべきである。二重表現は避けるべき。

 

# 感想

言われていることはよく分かる、けれど自分だったら「キャンセルのキャンセル」モーダルを作りうるなと思ってしまった…そもそも判断基準を持っていないから、そういったイケてないUIを作ってしまうのだろう…今回挙げられていた項目

・簡潔で分かりやすく、一貫した文言表現を意識する

この一言に尽きるのでしょうな…

# 今後どう活かせるか?

アプリのUI設計時に参考になりそうな。UI設計のたびにこの条件を満たせているか自分に問う、というのを毎回繰り返し、自然とできるようになっていきたい…!

「原因と結果」の経済学

今回の本

「原因と結果」の経済学―――データから真実を見抜く思考法

「原因と結果」の経済学―――データから真実を見抜く思考法

読んだきっかけ

マネージャーの2017年4Qイチオシ本。施策の振り返り方法について、アウトプットに対して正しく見られるようになりたいと思ったため。

3行まとめ

経済学に収まらず、因果関係の説明パターンについてまとまっている本。ビジネス的な統計学の解説という表現がしっくりくるような気がする。仕事をするときに手元に置いておいて、自分が今から示そうとしている数字がどの方法をもとにして示すものとなるのか、意識的に使っていくのが大切だと思った。

付箋貼った箇所

(中略)私たちが何か行動を起こすときには、けっこうなお金や時間がかかることが多いということを忘れてはならない。因果関係があるように見えるが、実はそうでない通説を信じて行動してしまうと、期待したような効果が得られないだけではなく、お金や時間まで無駄にしてしまう。そのお金や時間をきちんと因果関係に基づいたことに用いれば、よい結果が得られる確率ははるかに高くなるだろう。

p10

感想

本を通読しただけでは、ただ分析の手法にはいろいろあるんだな〜と思う程度で終わってしまう。これだとこの本を読んだ意味はなくて、「今自分がしている分析が妥当といえる理由は何なのか」「多数ある分析手法のうち、この方法でないと分析ができないのか」ということを説明できるためにも、手元において、自分が行っている分析手法がこの本でいうとどれに当たるのか、を説明できるような状態になっていたいと思った。

おまけ

この本で紹介されている内容を深掘りして、センセーショナルに書いた本があったことを思い出した。紹介されている事例についてもっと知ったり現実どうなってるのを知りたい場合は、これも読んだら面白いんだろう。

経済政策で人は死ぬか?: 公衆衛生学から見た不況対策

経済政策で人は死ぬか?: 公衆衛生学から見た不況対策

「見える化」

今回の本

見える化-強い企業をつくる「見える」仕組み

見える化-強い企業をつくる「見える」仕組み

読んだきっかけ

マネージャーの紹介。私の苦手ポイントは「物事を構造化する」こと、それをこれから克服するために、物事を「見える化」しようね、という文脈。

3行まとめ

可視化の重要性について説いた本。具体例をあげつつ可視化によってできることを説明している。見える化することがゴールなのではなく、その結果行動につながることを目的とすべし。

付箋貼った箇所

それぞれの職場において「見える」工夫を行ったうえで、一人ひとりがその 「触覚」を磨き、変化に敏感な人をつくり出すことこそが「見える化」の本来の目的である。究極の「見える化」とは、実際に見えたものだけに頼るのではなく、「見えないものを見る」ことができる人―それを育てることなのである。

P58

感想

なんでも「見えるようにしよう」と、可視化をゴールにしがちだけどそれがゴールではない、という点は、これから業務で意識すべき点だと思った。事例はメーカーがメインだったので、Web系での業務でそのまま移植することはできないと思ったものの、自分たちの見ている数字もより細分化して見たほうが分かることが多いのでは?と問いかけるきっかけになった。既に何個か指標を追加したい、と思っているので、それが実際に活かせるのかどうか見るようにしたい。

スマートフォンのためのUIデザイン 1

この本で学びたいこと

 

スマートフォンのためのUIデザイン

スマートフォンのためのUIデザイン

 

スマートフォンというデバイスにおいて、基本の構造・考え方についてまとめた本。iOS/Androidは問わない、またアプリ/サイトも問わないで、まずは概念について最低限の内容を把握する。

今日読んだ箇所

Chapter 0 はじめに
スマートフォンUIの概要 / ユーザーの操作と環境

Chapter 1 画面パターン
導入画面 / トップ画面 / 一覧画面 / 詳細画面 / 入力・操作画面 / 画面遷移

Chapter 2 基本UIコンポーネント
ヘッダー / フッター / モーダルウィンドウ / ウィンドウシェード / アクションパネル

Chapter 3 ナビゲーションとコントロール
タブ型ナビゲーション / セグメンテッドコントロール / スワイプナビゲーション
ドロップダウン / ドリルダウン / アコーディオン / ダッシュボード
バック/ホーム / 画面アップ/ダウン / ページャー / インフィニットリストページャー
リフレッシュコントロール/ スライドメニュー

Chapter 4 リスト
垂直型リスト / グリッドリスト / カルーセルパネル
タイムライン / カレンダー(日付リスト)

Chapter 5 フォーム
テキストフィールド / スイッチ / ピッカー / スライダー
ドラッグアンドドロップ

Chapter 6 通知とメッセージ
モーダルメッセージ / モードレスメッセージ /ブロックメッセージ
バッジ / バルーンメッセージ

Chapter 7 情報のビジュアル化
インフィニットインジケーター / プログレスバー / ページインジケーター
グラフ / レーティング

Chapter 8 アイコン
家 / 虫眼鏡 / ギア / 星 / アナログ時計 / ピン / 人 / 鉛筆 / ゴミ箱
プラス/ バツ / カメラ / 三連ドット / 連結したドット
シェア / 三連ライン / リフレッシュ

Chapter 9 モーション
スライドレフト/ライト / オーバーレイアップ/ダウン
フェードイン/アウト / 回転 / ズームイン/アウト
シェイク / ウィグル

Chapter 10 ビジュアルデザイン
標準デザイン / スキューモーフィックデザイン / フラットデザイン

 

アウトプット

§1-6[画面遷移図]を参考に、主要導線について画面遷移図を改めて描いた。

機能やシチュエーションを考えると2パターン画面遷移図を作れるように思う。10ヶ月前にも同じものを作成するように指示されて作ったが、作成する目的が分かっていなかったためやたらめったら画面を線で繋いだ図を作ってしまったが、「主要導線におけるCSの流れを整理する」だと下記の画面で十分である、と今なら自信を持って言える。

(めちゃくちゃ各論だったので消しました)

これらの流れについて数字をざっくり掴んでいたいし、CSのセグメント別に動きが変わることを確認できる状態にしておきたい。

※来週どこかでする

感想・その他一言

自分でアプリのUIを考える際に「なんとなく違う気がする」と思いつつ検討してしまっていた項目などあったが、「それが適切でない理由」を文言化して記載されており、今後のUI検討で活かせるであろうと思った。具体例については数を見ていくしかないと思うので、続きの項目については、今まで馴染みがなかったUIに注意して読み進めたい。