いま『ビッグオー駆動型開発』とよばれる開発手法が、業界の一部で注目を集めている。 その理由は非常にシンプルだ。『ビッグオー』は非常に安価で簡単な手法でありながら、従来の開発手法に比べ劇的にUIやUXを改善できるためである。 製品コンセプトのような上流から、ボタンのレイアウトといった下流工程、さらにはグロースハックやプロモといったリリース後のフェイズまで一つの手法でユーザビリティを評価できる。この汎用性がビッグオー駆動開発の大きな特徴であり、導入時の利点となる。 今回はこのビッグオー、の概要と具体的なやり方について論じたい。TwitterのUI拡張予言以来、久しぶりのUI系エントリである。 ビッグオー駆動開発とは何か？ ビッグオー駆動開発は、正式には『OKAN Driven Development（オカン駆動型開発）』とよばれる開発手法である。 これは自分のオカンを指標とすることで、低コスト

顧客や上司、ユーザーの場当たりな要望に対応しつづけると、どんなアプリもゴミアプリになる。たとえそれが理にかなった要望であっても。 なぜなら面積の限られたスマホでは「一画面の機能数とボタン数」が、使い易さと品質に深くリンクしているからです。 ということを、エラい人にプレゼンするのがお仕事の今日この頃。でも毎回毎回、同じことを説明するのがシンドイので資料をブログにまとめたいなぁと思うなど。 思考実験として、ここでは架空事例としてTwitterアプリを例に考えてみる。 何かの間違いで、日本の大手メーカーがTwitterを買収すると・・・UIデザイナーが体を張らないと99%ぐらいの確率でこうなるのです。 ここがオリジナル Request1: ダイレクトメッセージをトップ階層に ユーザーからの真っ当な要望。実際にはサービスの本質ではないのですが、要望はかなり多いはず。 ただTwitter社的にはme

・どこ押せばいいか謎 ・言われてるほど新しくない（スイス系のリバイバル） ・立体より工数低いが、誤摩化しがきかず難易度高い ・でもデザイン料を安くされそう ・日本語だと高確率でダサくなる

Kindleストアを見て思った。無理だ。 3〜5年のタームで見た場合、出版社がどんなに足並みをそろえて防衛線を貼っても、電子書籍の価格を維持することは難しい。 なぜならば電子書籍ストアにおいて、最大のライバルは同業者ではないからだ。 電子書籍の最大の特徴は、「印刷、複製のコストが０になったこと」だ。これは参入障壁の劇的な低下と同義であり、3種類の危険な新規プレイヤーを呼び寄せる。 新しいプレイヤーの参入 出版のコストが限りなく０に近づく時、新たに参入してくるプレイヤーとは誰か？ では、その新規プレイヤーは何なのか？ まず第一に「ギャンブルのできる、失うもののないプレイヤー」、そして第二に「金銭的な利益を求めないをプレイヤー」、そして第三の、最大の競合が「書籍以外に収益モデルのあるプレイヤー」の参入である。 第一の「失うもののないプレイヤー」とは、いわゆるインディペンデントや新規参入の出版社

thefuture.fmいいですね。アプリもシンプルだけど使いやすい。最近の作業BGMはもうこれ一本。 theFuture.fmは、DJ主導の音楽ストリーミングサービス。 一見すると普通の聞き放題系だけれども、面白いのはDJが自分でミックス作ってアップするという点。 ビジネスモデルというか、音楽製作者達への還元方法も独特。 ミックスを投稿すると、theFuture.fmの謎の解析エンジンがミックス内に含まれている楽曲を自動で検出、iTunesへの購入リンクをページ内に表示するという仕組みになっている。 DJに楽曲申請の負荷がかからないため、良質のミックスがガンガンあがってくるわけです。投稿者に優しいサービスは、流行する最低要素だと思うのでステキです。 DJ達はガンガン自作ミックスを作って自分達の名前を上げ、音楽がかかればかかるほどミュージシャンの曲は売れ、リスナーはタダで聞き放題という仕組

有名アプリなんでしょうかね、Skala Preview。いままで知りませんでした。 Skala Previewを使うと、Mac上の画像やPhotoshop画面やクリップボードの画像を、iPhone上でピクセルパーフェクトで表示できます。 Mac / iPhone 用アプリ。 使い方も簡単で、MacとiPhoneで両方立ち上げれば適当に同期してくれます。フォトショッパ—マジ感涙！ 昔はイラレ画像をDropboxとかメールで転送してたのですが、Skalaを使えば直接見れる。UIもシンプルで綺麗。まだiPhone5には対応してませんが、はやく対応して欲しいなぁ。これは便利！ ついでに、普段使ってるものをつらつら。大分定番ですが。 IconKit Store 大きいアイコンを作れば、自動でiPad用やiPhone用などすべてのアイコンをリサイズして準備してくれる。 ReSizer Store iP

Page Layersは、すごいウェブのキャプチャアプリ。なんとキャプチャするサイトを、DIVやIMG要素ごとにレイヤー分割したPSDにしてくれるのだ！ これは素敵と言わざるをえない。 ビデオをみれば使い方は一目瞭然。URLを入力して保存ボタンを押すだけで、なんでも構造化したPSDにしてくれる。 Mac専用アプリで、AppStoreで$28.99。これは買いだと思います。 Web関係者は必須的な。

Amazonでは製品開発をするとき、まず最初にプレスリリースを書くらしい。これは”Working-Backwards“と言うデザイン手法。面白げなので色々と調べてみた。 Working-Backwards法の商品開発では、お客様の視点をスタート地点にするため、開発前にプレスリリースを作成する。プレス内容は、既存プロダクトの問題点と、それを新製品がどう解決するかが中心になる。 プレスがユーザーに響かなかった時点でプロジェクトはボツ。そもそもその商品は作らない。これにより見当違いな商品を作るリスクを、一番最初の段階で低コストに回避できる。 このWorking-Backwards法で書くプレス内容は主に以下のとおり。 見出し 顧客が商品を理解できるタイトル 副題 ターゲット層と、彼らのメリットを1行で。 概要 商品の特徴と利点をまとめる。この段落で全てを理解できるように。 課題 このプロダクトが

別にLine嫌いじゃないけれど、むしろ応援してるけど。でもLineの一人勝ちはあまり面白くない。 というわけで思考実験として、今からLineに追いつくVoIPアプリをどう作るかを考える。 Lineを殺す方法とは、如何にLineの魅力とビジネスモデルを無効化するプロダクトを考えるか？ だと思う。単純にラインよりもいいアプリを作ろうでは、先行者利益を覆すのは難しい。日本のサービスは「いいものを作るぜ！」が多いが、海外のサービスの「現在のビジネスモデルを台無しにするぜ！」というスタイルが有効だと思う。 根本的にLineの本質は、 電話が無料でかけられる！ 電話からの移行がラクチン！ スタンプが楽しい！ の3点だと思う。つまり「速くて安くて美味い」をベースに、ちょっとばっかり優越感を味わったり差別化をしたい人から課金をする・・・というモデルになっている。この3つの魅力のうち1つか2つを、破壊あるい

スゴイ。ヤバい。 Adobe Shadowは、Adobeのラボがリリースした、スマホコンテンツの開発支援ツール。 何ができるかというと、PCのブラウザで表示したURLのコンテンツを、iPhoneやiPadで同時に表示してくれる。 PCでサイトをリロードするだけで、iPhoneやiPadでも自動でブラウザがリロードされて、表示を検証できる！！ iPhoneやiPadはURLの入力が面倒だし、PCで作業する度にデバイスを移動するのが大変だった。 Adobe Shadowを使うと、PCでリロードするだけで、全環境で表示の確認がすぐできる。これは作業がはかどる。 使い方 Mac / PC に Adobe Shadowをインストール ブラウザ（Chrome)にAdobe Shadowの拡張をインストール iPhone, iPad, android, kindleに Adobe Shadowアプリをイ

百式の田口さんに教えていただいた、Bufferというサービスがとても便利。最近ヘビーユースです。 Bufferは呟きをTwitterやFacebookに、時間を分散して投稿してくれるサービス。朝おきて、気になった記事をブックマークレットで適当に登録しておけば、いい感じにばらけてTweetをしてくれるのです。僕はミーティング参加中なのに、2chブログを勝手につぶやいてくれたりとか。 iPhoneアプリもあるし、Chrome拡張もあって、拡張をいれるとTwitter本家のページにもBufferボタンがついたりとか細かいところも便利。特にクローム版のインストールをお勧めします。 お仕事でTwitter使う人は、Bufferに色々つっこんどけば寝てても、他の仕事しててもいい感じに運営されるのでとっても便利かもしれません。 締め切りなのに僕が呑気に呟いていたら、全部バッファーのせいです、僕が遊んでる

Gumroadというサービスがすごい熱い！ Gumroadは誰でも簡単にデータを販売できるようにするサービス。 FacebookやTwitterのタイムラインに、GumroadにアップしたデータのURLを貼るだけで、世界中にコンテンツを販売できるみたい。（2/14日現在、日本からの過剰すぎるアクセスでGumroadが不安定です） 何ができるの？ Gumroadを使えば、たとえばイラストレーターやミュージシャンが、そのまま作品をダイレクトにタイムラインで発表して販売できます。手数料はたったの5%（正確には5%+30セント）。Appleの30%や出版社の90%に比べると驚異的なお値段です。個人のクリエイターがクレジットカード決済でデータを販売できる…というのは、なにやら仕事のスタイルそのものが変わりそうです。 さっそく実験で、写真を１枚アップロードして$2で売ってみたら10$32ほど枚売れまし

家中の照明や音響やプロジェクターを、iPhoneから一括コントロールできるようにしてみた。 予想以上にやばい。超便利すぎて死ねる。 どうやるん？ Glamo iRemocon と Unity Remote、Griffin Beacon という3つのチョイスがある。 実L5Remoteというもう１つのチョイスもあったのだけど、これはわが家では動かなかったので割愛。 Glamo iRemocon 価格：26880円 純粋スペックなら神いわゆるゴッド。高いが神。 iPhoneとWIFI通信し、ほぼすべての赤外線リモコンを学習可能。スキンもカスタマイズ可能もでき、そのうえ自宅外からの遠隔制御までできる。家への帰り道でエアコンをオンできるのが強力。マクロ機能やタイマーもサポート。エアコンが動くのが素敵。弱点は本体をケーブルで無線ルーターにつなげなければならないこと、あとUIカスタマイズがPCのWeb

ミニチュア（ジオラマ）風写真を簡単に撮れるようになるチュートリアル。 わりと質問が多いので作ってみた。 必要なもの アプリはTiltShift Generator (85円) を使います。 また補助ツールにinstagram等のフィルター系アプリを１つ用意します。 ロケーション ミニチュア風写真では「どこから撮るか」がとても大事です。まずは高い所に行きます。 初心者へのお勧めは、歩道橋や高層レストラン街。 高さの目安は、撮りたいものによって決まります。 ・2〜5階：　人 ・5〜10階：　家や工事現場など ・10〜20階：　野球場等の大きめの施設 ・20〜40階：　町並み ・40階〜：　ビル群や東京タワー、巨大ランドマーク 下記は「5階以上で気軽にミニチュア写真を撮れる自作マップ」。大きく表示 より大きな地図で ミニチュア写真ロケハン を表示 渋谷Qfront2階、スターバッックス。 渋谷駅

スマホUI考１ 〜 ボタンについて スマホUI考２ 〜 フィードバックについて スマホといえばジェスチャー入力、ジェスチャーといえばスマホ。そんなジェスチャーについて、つれづれと。 でも個人的には、ジェスチャーはほとんど要らないと思う。 ジェスチャ全般 ・ジェスチャは補助操作。メイン操作ではない。 ・ボタンでできる操作をプラスアルファで、ジェスチャでもできるようにする。 ・なぜならジェスチャの有無は視覚的にわからない。 ・ユーザーがジェスチャを理解しなくても操作できるのがよい。 ・またジェスチャー時に、画面のかなりの部分が指で隠れる。 ・極論ジェスチャなしでもアプリがリリースできる状態なのがよい。 ・つまり予算や工数があまったときに入れよう。 タップ ・マウスクリックではなくタップ。 ・ボタンの精度は指のサイズに依存する。 ・細かい座標指定はできない。 ・ロールオーバーがない。 ・触ってみ

UIについて徒然と考える自分用メモ、２回目はフィードバック。ユーザーに「何かがおきたよ！」と如何に明解に知らせるか？１回目はこちら 随時増えたり減ったりするよ。自分の主観だから間違ってることもチラホラあるかもよ。 振り返ってみてTiltShiftGenでは、遷移系のフィードバックは少なめにして、情報系のフィードバックを多めに調整してたんだなぁとシミジミ。多分、ブラーの処理が重かったからだと思う。隙をみてバージョンアップしたい。 一般論 ・フィードバックとは？ ユーザーの操作に対して、結果を返すこと。操作の実感。 ・フィードバックのないアプリは痛覚の無い人間。 ・物理的なフィードバックもソフトウェア的フィードバックもなければ、ユーザーは何がおきているか知覚できない。 ・何かが起きたら必ずユーザーに通知する。 ・適切なフィードバックが行われるとユーザーは快感を感じる。 ・新雪に足跡をつけたり、

SuperPopCamとか作ったときに、体系的な資料欲しいなぁーとか思ってたことのまとめ。 色々と自分の中の考えをまとめるためのメモ。世の中のアプリは機能を半分にして、減った予算分をUIの練り込みにつぎ込んだ方が絶対よいアプリになると思う。 書いてる作業が一番考えまとまるので、ちょぼちょぼあげていこうかと、まずはボタンから。 指の大きさの制約を受ける ・Webとスマホを比較した場合、最大の違い。 ・ピクセル単位でクリック位置を制御できるマウスポインタと違い、指は大雑把にしかタップ位置を指定できない。 ・このためAppleはボタンの最小サイズとして44pxというガイドラインを作っている。 ・視覚的に44px以下のボタンも実際のヒットエリアは大きめにする。 ・またこれに留まらず、ボタンとボタンの間のマージンは空けられるだけ空けた方が安全。 ・つまるところ「カッチリ」つめたボタンレイアウトのグラ