ユーザーに愛されるアプリをつくるための5の掟 〜イノベーションプログラムより〜
あなたのスマホの最初の画面にあるアプリは何ですか？ 毎日頻繁に使う愛着のあるものや、状況に応じて必要なもの。逆にダウンロードしたもののほとんど使わずに画面の隅に眠っているもの。 その差は何でしょう？ 大きな要因の一つは『Usability (使いやすさ)』の違いで説明されます。 今回は弊社が提供しているInnovation Programの中で、サンフランシスコデザイン会社、btrax社のCEO, Brandon K. Hillが行ったワークショップの一つをご紹介します。このワークショップは先日8月7日のオンラインセミナー Vol.2でも取り上げた話題です。数々のアプリスタートアップがひしめくSFのユーザーの感覚を汲み取って、アントレプレナーたちはどのようなアプローチでモバイルアプリをヒットさせているのでしょうか。 1. Usability vs Security （使いやすさ vs セキ
0→1（ゼロからイチ）をデザインすることについての考察
0→1という言葉が好きな、@h0saです。 何もないところから新しいものごとを生み出すことに楽しさを覚えます。 （小さい頃から「塗り絵」は大嫌いで、初めから自分で絵を書くのが大好きでした。） さて、最近自分の「デザイン」に対する価値観を整理しているのですが、なんとなく「0→1」という言葉が頭に浮かんできました。 ビジネスにおいて0→1が語られる文脈には２つのパターンがあると思っています。 パターン１：「-1→0、0→1」 パターン２：「0→1→10→10000」 以下、２つのパターンに対する自分の考えをまとめてみました。 パターン１：「-1→0、0→1」 ひとつめは、「-1→0 は問題解決、0→1 は新しい価値を生み出す」という視点。 言い換えると、「-1→0：課題解決型アプローチ」「0→1：着想育成型アプローチ」です。 このあたりは、以前黒須正明教授が「もっと課題解決型の取り組みを」と題
モーダルを閉じるボタンのUIは右か左か | UXデザイン会社Standardのブログ
モーダルビューを「閉じる」ボタンの位置は右に置くべきか左に置くべきか。iOSにおいてはナビゲーションバーの右と左の2択であるため、逆に迷ってしまいがちなのかもしれません。 よくある話としては「設定ボタンがナビゲーションバーの左にあるのなら、同じように左側に閉じるボタンを配置するべきではないのか…」といったことをよく聞きますが、トリガーとなるボタンの位置はあまり関係なく、その後のモーダルビューでの内容や一貫性によって判断する必要があります。 モーダルとは ボタンの位置を考える前に、まずはモーダルとはどういったものかを紹介します。アプリケーションでのモーダルはユーザーに行動を制限し、特定のタスクに集中させるモードです。もちろんアプリケーションという意味では、ホームボタンを押したりマルチタスクにより他のアプリケーションを使うことができるため完全な制限ではありませんが、現在使用中のアプリケーション
UX TOKYO Jam 2014参加レポート | UXデザイン会社Standardのブログ
7月26日（土）に開催されたUX Tokyo Jam 2014に参加してきました。 120名参加枠がありましたがすぐに売り切れになったこのイベントは昼から夜まで行なわれ、パラレルセッションという同時間に2つのセッションを平行して開催する珍しい取り組みもありました。 弊社からはそれぞれ二人の鈴木が参加し、全てのセッションを体験することができたため、イベントレポートとして簡潔にではありますが記述したいと思います。 （ブログ内の写真は山本郁也さんより提供頂いたものです。） オープニングキーノート 前田 俊幸（UX Tokyo） UX Tokyoのコミュニティの最近の動向と、本イベントの内容の紹介、今後のUXデザインの設計対象のシフトについてのお話を頂きました。 デジタルシフトとパワーシフトについての動向は前田さん自身のボクシングの経験から、現在は「上半身のボクシング」と例え、サービスとの単一の接
Design dot BEENOS vol.2参加レポート | UXデザイン会社Standardのブログ
2014.8.1 / Report Design dot BEENOS vol.2参加レポート Tomohiro Suzuki Design dot BEENOS vol.2に参加してきました。 今回で2回目となるこのイベントは、ゲストとしてCoineyの松本さんをお呼びして開催されました。 まずゲストの松本さんからは「0からつくるUX」というテーマに基づき、Coineyに入ってからら現在までにどのようなデザインをやってきたかについてを、ご自身の体験からお話をいただきました。その後、トークセッションという形で山本さん、坂田さんが加わりCoineyでの取り組みをさらに言及や発展させたお話を聞くことができました。 Coiney（コイニー）- お店のカード決済をスマホでかんたんに 1,スタートアップにおけるブランド体験 Coineyに入った当初、まだなにもない状態でしたが、創業者のビジョンは存在
UX設計の基礎と5つのステップ「ダグ・ディーツが小児患者とMRIにかけたデザインの魔法」に学ぶ | 株式会社LIG(リグ)｜DX支援・システム開発・Web制作
こんにちは。 仕事帰りにGoogleの自動運転車を見かけ、長年携帯電話も持たなかった超アナログな自分がシリコンバレーにいるという、世の不条理さ不思議さに想いを馳せていたら赤信号になり、急ブレーキを踏んでギリギリセーフで助かった、崖っぷちで生きる浦島放浪民のYUKIです。 この記事を読んでいる皆様も、このような危険と冒険に満ちた現代社会を生き延びながら、スリリングな毎日をお過ごしなのだろうと思います。 さて。 これまでにお話してきたのは、「“Amazon”に学ぶ、4つの観点で考察するUXデザイン」と「WEB担当者必見！アクセシビリティで業界を先駆けよう」でした。 どちらかというと左脳寄りの内容が続いたので、バランスを取るために右脳寄りのお話をしたいと思います。 今回は、抽象的で、解釈や意味にも個人差がある【デザインの原点】についてです。 登場してもらう本記事の主役は、GEヘルスケアという医療
UI/UX設計の教科書、About Face 3輪講の資料を公開します - ninjinkun's diary
一昨年に社内で行ったAbout Face 3輪講の資料を公開します。実は今までずっと公開されていたのですが、存在を知られていなかったので、改めて周知します。 About Face 3はUI/UX設計の教科書で、ユーザーストーリーやペルソナなど、基本的な内容が押さえられています。ディレクター、デザイナー、エンジニア、サポート等、プロダクト制作に関わる全員の共通知識として使える内容だと思います。 About Face 3輪講概要 1. ゴールダイレクテッドデザイン 2. 実装モデルと脳内モデル 3. 初心者、上級者、中級者 5. ユーザーのモデリング : ペルソナとゴール 6. デザインの基礎 : シナリオと要求 8. 優れたデザインの総合 : 原則とパターン 10. オーケストレーションとフロー 11. 間接的な操作を取り除く 12. 良き振る舞いのデザイン 13. メタファ、イディオム、ア
デザイナーと一口に言うけれど - LIFULL Creators Blog
Apple原理主義者の大坪です。 最近 「UXとUIは何が違うのか」 といった議論を時々みかけます。それぞれの言葉について、合意のとれた定義がないから正解はないのですが、この問題に対してのあれこれの議論は時として興味深いものになります。 というわけで昨日見つけた記事について。 記事の題名は"Recruiting a Designer? Here's What You Should Know" 「デザイナーを探している人が知っておくべきこと」 デザイナーという言葉はとても幅広いわけです。車などのプロダクトデザインもあれば雑誌のデザインもあり、web、アプリなどのデザインもある。この記事ではweb、アプリなどを対象にしたTech Industory(日本語ではIT業界なのですかね）での様々なデザイナーの役割について書かかれています。 記事中それぞれの「デザイナー」が使っているツールとかもでてい
認知心理学とUIデザインに関するメモ
photo credit: dierk schaefer via photopin cc こんにちは、@h0saです。 約１ヶ月経ってしまいましたが、2014年7月17日に開催された、HCD-Net主催セミナー「認知心理学とUI,UX入門」に参加してきました。 UIデザイン業務に活かせる内容でしたので、ポイントを絞ってメモを残しておきます。 「認知心理学とUI,UX入門」メモ 認知心理学とは ・人の頭の使い方：知覚・理解・記憶・思考・学習・推論・判断・問題解決などの知的機能が研究対象。 ・最近では、感情、感性、熱達、実践等の問題にも取り組むようになっている。 認知情報処理（人の頭の使い方） ・知覚（五感） ↓ ↓←注意 ↓ ・認知 ↓ ・記憶（短期記憶、長期記憶） ↓ ・理解（理解の枠組み＝メンタルモデル） ↓ ・判断 短期記憶 ・短期記憶の記憶容量：7±2単位、保持時間2〜5秒 ・
アジャイル世界でのUXの実践： ケーススタディでの発見
アジャイルチームはアジャイル開発プロセスの実行という点では非常に優れている。しかし、時間に追われるために、ユーザー調査をあきらめたり、結果としてユーザーエクスペリエンスの質を下げてしまうこともある。 Doing UX in an Agile World: Case Study Findings by Hoa Loranger on May 26, 2014 日本語版2014年8月5日公開 アジャイル開発プロセスがプログラマーの間で人気だ。そこで、迅速なプログラミングを追求しつつ、ユーザビリティもあきらめない素晴らしいプロダクトを作るには、どのようにアジャイルメソッドとユーザーエクスペリエンスの手法を融合させると一番良いかをここ数年、調べてきた。以前の調査では幅広い視点について考察した。そこで、今回は少数のプロジェクトを掘り下げ、より深い知見を新コースの「リーンUXとアジャイル」のために集め
オンボーディングをデザインするときのトレンド7つ | Goodpatch Blog
こんにちは！Goodpatchのゆきです。皆さんはサービスのオンボーディングについて考えたことはありますか？オンボーディングとは、新規ユーザーをサービスに適応させるプロセスです。今回はオンボーディングをデザインするときのトレンドについて書かれた、intercomの新規ユーザーのオンボーディングは想像以上に難しいという記事を翻訳して紹介します。 新規ユーザーのオンボーディングは想像以上に難しい どんなサービスについても発展するか衰退するかはサインアップ直後に何が起こるかで決まります。新規ユーザーの中にはようこそと出迎えてくれて、案内をしてくれることを期待している人もいれば、早くどいてくれ、自分で探検したいんだ！という意思のある人もいるでしょう。アクティブユーザーが1000万から1億人いるような人気サイトになると直面するのは、様々なユーザーがいることで期待が幅広くなってしまうという問題です。さ
アプリデザインの参考になるUI/UXデザインギャラリーサイト10選 - 株式会社モンスターラボ
オンボーディングのUXデザインの参考になる海外Webサイト 「オンボーディング」とは、初めてサービスや製品を使うユーザーがヘルプや説明書を読まなくても使っていくうちに操作方法がわかるように設計する手法のことです。 いかに素晴らしいプロダクトであっても、初めて使用するユーザーにストレスを与えてしまい、すぐにアンインストールされてしまっては意味がありません。 オンボーディングのUXデザインで参考にしたいのが、以下の2つのWebサイトです。 アプリデザインまとめ① User Onboarding 「User Onboarding」は海外のアプリや有名Webサービスのオンボーディングについて紹介しているWebサイト。 オンボーディングを画面単位で切り分けて、参考になる点と改善が必要な点をピックアップしています。 サンプルはスライド形式で表示されます。簡単な英語で解説されているので、英語が苦手な人で
User Onboarding | A frequently-updated compendium of web app first-run experiences
User Onboarding is the process of radically increasing the likelihood that new users become successful when adopting your product. Teardowns Let's learn some lessons from how popular web apps do it! Here's the latest: And here are some other recent ones: WordPress QuickBooks Bitcoin » See all teardowns Onboarding Design Articles Never Mix Up Features with Benefits Ever Again… Bulletproof User Onbo
ドロワーというナビゲーションの再考 | UXデザイン会社Standardのブログ
以前Facebookのアプリケーションで採用されたことを皮切りに、ここ数年で多くのアプリケーションで使われることになったドロワーというナビゲーションについての考察です。 最近ネット上でも話題になっており、安易なナビゲーションへの採用が見直されているされているインターフェイスでもあります。しかしドロワーの必要性について疑うことは良いのですが、表面的にただドロワーを使ってはいけないという情報に左右されていては、安易なドロワーはなくなったとしても、次に安易なタブなどが量産されるということが予測できます。 UIに関わるデザイナーとしては、なぜドロワーが適していないのかということと同時に、どのような状況下であればドロワーが適しているのかは考え続ける必要があるでしょう。 ドロワーの歴史 まず名前の由来としては、たしか2013年にAndroidでナビゲーションドロワーのためのフレームワークが公開されたこ
優れたUIデザインを作るために知るべき12のTips | Goodpatch Blog
こんにちは、だいきです。 海外のUIデザインに関する記事「14 Golden Eggs of Good UI Design（直訳: 優れたUIデザインの14の金の卵）」で書かれていたUIデザインに関するTipsがとても勉強になったので、その中からいくつか抜粋したものを翻訳しました！ （この記事はJohannes Thönesというブログの14 Golden Eggs of Good UI Designという記事の抜粋翻訳ブログです。） 1, 先進的な技術を使う理由 photo credit: Carlos Varela via photopin cc HTML5が新しい技術だからといって、それを使う必要性はありません。 新しい技術を使うことが目的になってはいけません。 ユーザーとユーザーが期待している事を考えてください。 どんなUX（ユーザーエクスペリエンス）をユーザーに与えたいですか？
雑誌のように美しいレイアウトを生み出すために、Flipboardが開発したレイアウトエンジン | Goodpatch Blog
はじまり 2010年、私たちはFlipboard Pagesという、Webの記事をiPad向けにマガジンページにするというレイアウトエンジンを作りました。 Flipboard Pagesは、Vanity FairやNational Geographicと言った世界一流の出版社のコンテンツをページ割します。 Pagesは、それぞれの出版社のブランドアイデンティティとカスタムタイポグラフィーを再現する美しいレイアウトを生み出すことが出来ます。限定されたモバイルデバイス（例えばiOS 3.2のオリジナルiPad）でも充実かつ高いパフォーマンスでレンダリングするために、PagesはCSS3、SVG、そしてvanilla JavaScriptを使いました。出版社のレイアウトのためのダウンロードファイルサイズは平均すると、およそレイアウト、スタイリング、フォント、ネームプレートイメージなどで90キロバ
【IMJ】Web業界とHCD
1. Copyright © IMJ Corporation. All Rights Reserved.Copyright © IMJ Corporation. All Rights Reserved. 出版記念イベント 「HCDの国内事例とアプローチ」 2014/07/14 Web業界とUXD/HCD 株式会社アイ・エム・ジェイ 執行役員 玉飼 真一 1 2. Copyright © IMJ Corporation. All Rights Reserved. 2 アイ・エム・ジェイについて 社名 設立 資本金 代表取締役社長 従業員数 事業内容 本社所在地 株式会社アイ・エム・ジェイ 1996年7月4日 43億1,046万円 櫻井 徹 デジタルマーケティング事業 東京都目黒区青葉台3-6-28 住友不動産青葉台タワー グループ従業員数 合計656名 (2014年3月31日現在)
「クックパッドの良心」とも言われるユーザーファースト推進部 池田拓司氏が実現する“ブレない”サービスづくりとは - BRIDGE（ブリッジ）
クックパッドのユーザーファースト推進部 部長でデザイナーの池田拓司さん。多摩美術大学を卒業後、ニフティに入社。その後、はてな を経て2012年にクックパッドへ入社しました。 社内のメンバーから、「新規事業が増える中で、クックパッドらしさを守る“クックパッドの良心”」と表される池田さん。彼が言語化し、社内外に対して守り抜く「クックパッドらしさ」とは。 生活に近いサービスをつくりたい デザイナーとして新卒入社したニフティで3年間働いた後、まだ当時10名ほどだった はてなに転職した池田さん。より生活に近いサービスをつくりたいという思いで、7年間勤めた はてなからクックパッドに転職しました。 2014年4月に「デザイン部」は名前を変え「ユーザーファースト推進部」に。社長直轄の部署であるため、お客様の声が経営陣にも届きやすい体制が出来ています。現在はデザイナーを中心とする8人のメンバーで構成されるチ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Nyle Engineering Blog
PC、スマホの「次」のデヴァイス：MITメディアラボが描くインターフェイス研究の最前線