iPhone X対応におけるデザイン上の注意ポイント | fladdict
iPhone Xが発表されたわけですが、なにこのデザイナー泣かせの変態端末。 iPhoneのUI設計者グレッグ・クリスティが追い出されて、ジョナサン・アイヴがソフトウェア統括となったのが2014年。 iOS7のフラット化あたりから、どんどんとUI設計が置いてけぼりになった感がありましたが・・・ここにきてまたデザイナー泣かせの豪速球が。 ざっくりデザインガイドラインを読んでの、気になったところメモ。 画面サイズ サイズは従来のベースであった4.7インチの375pt x 667ptから、375 x 812ptに。縦方向に145pt追加された。 想定されるインパクト 表示可能な情報量が増える 縦スクロール系コンテンツのコンバージョンが増加 スクロールで隠れるナビゲーションの必要性が低下 画面上部のボタンのコンバージョンが低下 ゲームなどの全画面イラストに、黒枠が出たり、見切れたりする グラフィッ
UI考 – ざっと見る、じっと見る | fladdict
英文の速読術には、スキミング・スキャニングと呼ばれる技法がある。 スキミングとは「ざっと一覧して、全体を把握する」こと。各章のタイトルや、パラグラフの一文目、最終のまとめなど、要所要所だけをかいつまんでいく読み方だ。 一方、スキャニングは「特定の部分を熟読する」こと。こちらは一転して、一単語ずつ精査していく読み方である。 まず最初に全体をざっと見て（スキミング）、自分に必要な内容があるかをチェックする。その後に、必要な部分だけを選別してじっと見て（スキャニング）いく。英文速読では、この２つの読み方をペアにして扱う。つまり速読術とは全文を素早く読むことではない。細部を無視して、要点だけを拾い上げていく技法なのである。 この英文速読術の技法、スキミングとスキャニングは、画面の情報設計の大きなヒントとなる。情報を効率良く読むテクニックが確立されているのなら、それをロジック化すればよい。ロジックを
GoogleがプロトタイピングツールPixateを買収。無料化される。オススメ。 | fladdict
Googleが、ローカルベースのプロトタイピングツールPixateを買収した模様。以後、Pixateアプリは無料となり引き続き開発が続けられるようです。 2013年頃、Pixateに$600払ってた俺は泣いた。おめでとうございます。 Invisionを主流に百花繚乱の分断化で割と困っていたプロトタイピング業界。Googleがこの分野に手を出したことで変動は起きるのだろうか。 これがプロトタイピングツールの決定版になるとよいですね。高性能だし無料だし。クラウド版も$5だし。 日本でプロトタイピングサービスばパッとしない究極の問題は、サービスがオンラインのことなんですよね。SI系の人たちは「セキュリティ的な事情でオンラインの共有サービスを使えない」という事情がありました。Pixateはローカルアプリなので、その辺の心配をする必要がないのがポイントですね。そのうち大手SIとかでもこういうツールが
よくわかるマテリアルデザインの設計コンセプト | fladdict
iPhoneとAndroidではiPhoneのほうが良くできているが、iOSのフラットデザインとAndroidのマテリアルデザインでは後者の設計が優れている。マテリアルデザインは、デザインとエンジニアリングが高いレベルで融合していて、ロジカルで非常に美しい。 以下、自分の理解をまとめたメモ。 紙とインク マテリアルデザインは「ペーパー」と「インク」のメタファーでできている。 ペーパーの特徴 バーやボタンといった画面上のUIコンポーネントは、バーチャルな紙でできたカードと考える。また、このペーパーは1dpの厚さを持っている。 ペーパーは純白の矩形、あるいはシンプルな円形である。三角や星型といった複雑な形はとらない。そのような複雑な形状や模様はインクが担当する。 現実とことなり、このペーパーは自由に伸縮することができる。 マテリアルデザインにおけるレイアウトは、複数のペーパーを並べたり、重ねた
Apple Watchアプリを作るべきかUIUX評価雑感 | fladdict
事前レビュー「UI考（番外編） AppleWatchについて、あまり語られてない視点」の続き、週末に使ってみた雑感。 通知マシーンとしての素晴らしさ 通知マシーンとしては文句なく素晴らしい。手首に対する自然なノックからはじまる通知と確認のプロセスは、ミニマルで合理的に設計されている。Facebookのメッセンジャーやカレンダーなどとの相性は抜群だった。 全てをぶちこわす致命傷 いっぽうアプリのプラットフォームとして考えた場合、これはまだ実用に達していないと判断した。おそらく一番致命的な問題はレスポンスの遅さだ。 Apple Watchの謳う最大の価値は、「携帯を取り出すより楽」なことと「グランサビリティ（一目瞭然性）」だった。ところが実際触ってみると圧倒的に遅い。これはiPhone本体とのBT通信が全てを台無しにしているためだ。 例えばグランスやアプリを使用する場合を考えてみよう。アプリ利
Googleはどうやってサービスを生み出すのか？ – Google主催のプロトタイピング・ワークショップ | fladdict
＜追記＞オリジナルのデザインスプリント文献翻訳はじめました＜／追記＞ THE GUILDのメンバーで、Google主催のプロトタイピングのワークショップ「デザインスプリント」に参加してくるなど。ご招待いただき多謝でございます。 デザインスプリントとは？ デザインスプリントはグーグルによるデザイン教育メソッドとそのワークショップ。数時間から数日で一気に籠って、商品のコンセプトデザインやプロトタピングを仕上げてしまう高速なデザイン手法です。Googleのベンチャー機関Google Venturesがよく、投資先に行っているものです。 導入事例としては、最近に日本にも上陸したブルーボトルコーヒーのサイトブランディングで行われたのが有名でしょうか。GoogleX内部でも頻繁に行われているようです。本来は5日間でやるこのデザインスプリント、今回は入門編ということで圧縮して2時間で1つの企画を考えます
iOS用のアニメーションエンジンを作ろうと思う その1 | fladdict
iOSのSDKが提供するアニメーションSDKは正直いってショボイ。 UIAnimationは機能が貧弱すぎるし、CoreAnimationは強力なものの手続きが煩雑で使えたものじゃない。JSやAndroidと比べれば悪くはないのだけれども、僕はもともとFlash業界で育ってきた人間だったので、Flashの柔軟な表現力が基準になってしまう。 しょうがないので結局、自分で作ることにした。 GitのリポジトリはGLDTween、ライセンスはMITを予定。 そもそも、なぜiOSのアニメーション系のSDKがショボイのか？というと、これはUIKitの設計のせいだ。 UIKitではViewの座標系が、CGPoint、CGSize、CGFrame、CGAffineTransformなど様々な構造体に分散して保持されている。構造体はNSObjectではないので、配列や辞書に突っ込むことができず、参照ではなく
ナウシカごっこができる！ Terraのサボテン水耕栽培キット | fladdict
Stores.jpで購入した、1012 | TERRAのサボテン水耕栽培キットがついに届きました。Terraはステンドグラスの技法で作成された、手作りのサボテン水耕栽培ケース。この標本感がとってもイカす！ サボテンや多肉植物は、一般的に水をやりすぎると根腐れする・・・ってイメージですが、なんと水耕栽培ができるのだとか。 サボテンの根っ子をちょん切って、根の端っこだけを水につけておく・・・すると、サボテンは水棲環境に適応した新しい根を生やすんだそうです。 世話はとってもシンプルで、水が減ったら交換したり追加するだけ、ノー肥料でいけるというステキ具合です。普通の植物は、「土が感想したら水をたっぷり」みたいな、あやふやなインストラクションで難しいですが、これなら水位を維持するだけなので育てるのも簡単。アプリを使いやすくするのと、植物を枯らすことに定評のある弊社ですが、ここまでシンプルなら頑張れそ
FacebookのニュースアプリPaperのUIと、その背後に見える戦略について | fladdict
Introducing Paper from Facebook on Vimeo. FacebookがリリースしたニュースアプリPaper、さっそくダウンロードして触ってみた。 使ってみた第一印象は、「意欲的な実験作だが、まだ実用品ではない」といった感じだ。 外見や手触りが注目されるPaperだが、しかし僕自身が一番注目しているのは右上のナビゲーションだ。Paperの右上は、「人」「会話」「通知」 というFacebookの基幹アプリとまったく同じ構成なのである。そしてFacebookの同機能にアクセスする。つまり、Paperはニュースアプリの形をしているが、本質的にはFacebookクライアントなのだ。 これは。何を意味するのか・・・ つまりFacebookは今後、様々なコンセプトのFacebookクライアントを複数リリースするということだ。 右上のボタン群が主張するUI上のメッセージは、
アンチソーシャル系の日記アプリ、Livreをリリースしました | fladdict
安藤さん山口さんといっしょに日記アプリ作りましたー。 UIの基礎設計部分となぜか効果音とかを担当。 アンチソーシャル系の１人引日記アプリです。ソーシャル疲れした人、無料なので是非。 株式会社Nagisaの新サービス「Livre」アプリをTHE GUILDで担当しました。 Livreは日々の記録を、自分だけの日記としてプライベートに管理するサービスです。 かんたんな操作でテキスト、スタンプ、写真といった形で日々の記録を残し、タイムライン、カレンダー、アルバムという形で過去の思い出を振り返る事が出来ます。 Credits: Client: Nagisa Inc. Project Management: Masato Yamaguchi (THE GUILD, Alpha Version Inc.) UI Direction: Takayuki Fukatsu (THE GUILD, Art &
スマホUI考（番外編） 顧客やユーザーの要望に全て対応すると、アプリは99%破綻する | fladdict
顧客や上司、ユーザーの場当たりな要望に対応しつづけると、どんなアプリもゴミアプリになる。たとえそれが理にかなった要望であっても。 なぜなら面積の限られたスマホでは「一画面の機能数とボタン数」が、使い易さと品質に深くリンクしているからです。 ということを、エラい人にプレゼンするのがお仕事の今日この頃。でも毎回毎回、同じことを説明するのがシンドイので資料をブログにまとめたいなぁと思うなど。 思考実験として、ここでは架空事例としてTwitterアプリを例に考えてみる。 何かの間違いで、日本の大手メーカーがTwitterを買収すると・・・UIデザイナーが体を張らないと99%ぐらいの確率でこうなるのです。 ここがオリジナル Request1: ダイレクトメッセージをトップ階層に ユーザーからの真っ当な要望。実際にはサービスの本質ではないのですが、要望はかなり多いはず。 ただTwitter社的にはme
開発者必見！ 5秒でわかるフラットデザインまとめ | fladdict
・どこ押せばいいか謎 ・言われてるほど新しくない（スイス系のリバイバル） ・立体より工数低いが、誤摩化しがきかず難易度高い ・でもデザイン料を安くされそう ・日本語だと高確率でダサくなる
相撲を一眼でミニチュアっぽく撮ってみた | fladdict
1月ぐらいに勢いで撮ってみた。 ハッケヨイヨイ ノコッタノコッタ ポイっとな 四股 選手入場的な カメラはCanon 5D Mark3、レンズは例によってTS-E45 F2.8とTS-E90mm F2.8。 俯角25〜45度の見おろしで、被写体をクオータービューの角度で撮りつつ、TSを逆アオリf2.8-5にセッティング。 場内は暗いのでISOを犠牲にしてシャッタースピードを稼ぐ。 iPhoneアプリでとる場合はTiltShiftGenで加工したあとに、Instagramがよいかと。
アプリをiPhone5に対応する場合の地雷ポイント一覧 | fladdict
地雷キャッチャーとして定評のあるfladdictですが、今回も大量の地雷を踏み歩いております。 とりあえず、解決方法を知らないとハマるポイントを色々とピックアップ。自分では直ったけど一般化できてない現象もあるので、間違い勘違い等ありましたら、コメント欄でビシバシご指摘ください。 iPhone5対応すると、iOS4.3以前では動かなくなる 最新のXCodeがarmv6のコンパイルをしてくれないので、ご臨終となります。 公式じゃないほうほうで無理矢理バイナリをビルドすればhogehoge。 サードの静的ライブラリが入ってると、コンパイルできない場合が 最新XCodeからコンパイルに、armv7sという新アーキテクチャが必須となってますが、ビルド済み静的ライブラリにはむろん入っていないのでコンパイルできません。対策は2つあって、ひとつは対応ライブラリが出るまでリリースを見送ること、もう片方はXC
Amazon流の開発術では、まずプレスリリースを作る | fladdict
Amazonでは製品開発をするとき、まず最初にプレスリリースを書くらしい。これは”Working-Backwards“と言うデザイン手法。面白げなので色々と調べてみた。 Working-Backwards法の商品開発では、お客様の視点をスタート地点にするため、開発前にプレスリリースを作成する。プレス内容は、既存プロダクトの問題点と、それを新製品がどう解決するかが中心になる。 プレスがユーザーに響かなかった時点でプロジェクトはボツ。そもそもその商品は作らない。これにより見当違いな商品を作るリスクを、一番最初の段階で低コストに回避できる。 このWorking-Backwards法で書くプレス内容は主に以下のとおり。 見出し 顧客が商品を理解できるタイトル 副題 ターゲット層と、彼らのメリットを1行で。 概要 商品の特徴と利点をまとめる。この段落で全てを理解できるように。 課題 このプロダクトが
Lineを殺すサービスの作り方 | fladdict
別にLine嫌いじゃないけれど、むしろ応援してるけど。でもLineの一人勝ちはあまり面白くない。 というわけで思考実験として、今からLineに追いつくVoIPアプリをどう作るかを考える。 Lineを殺す方法とは、如何にLineの魅力とビジネスモデルを無効化するプロダクトを考えるか？ だと思う。単純にラインよりもいいアプリを作ろうでは、先行者利益を覆すのは難しい。日本のサービスは「いいものを作るぜ！」が多いが、海外のサービスの「現在のビジネスモデルを台無しにするぜ！」というスタイルが有効だと思う。 根本的にLineの本質は、 電話が無料でかけられる！ 電話からの移行がラクチン！ スタンプが楽しい！ の3点だと思う。つまり「速くて安くて美味い」をベースに、ちょっとばっかり優越感を味わったり差別化をしたい人から課金をする・・・というモデルになっている。この3つの魅力のうち1つか2つを、破壊あるい
iCloudハック事件の手口がガード不能すぎてヤバイ | fladdict
GizmodeのライターがiCloudのアカウントを乗っ取られ、iCloud消滅、iPad, iPhone, Macのデータワイプ、Gmail, Twitterの乗っ取りを食らった件について、ハッキングを本人が語ってらっしゃる。 手口としては典型的なソーシャルエンジニアリングによる、複数サイトから得た情報のギャザリングを用いたハック。 だがこのハッキングのプロセスが鮮やかすぎてヤバイ。ツールを一切つかわず電話だけでハッキングしてる。 Twitterアカウントに目をつける 元々クラッカーは、Gizライターの持っていた「３文字のTwitterアカウント」が欲しくてアタックをかけたらしい。 Twitterプロフィールから、本人のウェブサイトへ 本人のウェブサイトからGmailのアドレスを発見 Gmailで「パスワードがわからない」から再発行 再発行メール用のアドレスが画面に表示される。この m*
ミニチュア風コマ撮り動画まとめ | fladdict
自分の作ってるiPhoneミニチュア撮影アプリ、TiltShiftGenの資料メモ。プリプロセス系もポストプロセス系も リリースしたばかりのWindowsPhone版も、日本の写真部門で1位を頂きました。応援してくださったみなさま本当に多謝です。 TiltShiftGenは動画はムリだけど将来用に撮り貯めた資料。 どこかの村の一日。 音楽フェスのミニチュア。とてもにぎやかな感じ。 雪のスキー場 プロレス。 ニューヨークの一日をミニチュア化。 雪に包まれた町のミニチュア。 ビーチのミニチュア化 ビーチのミニチュア化２ ドイツの街。効果音とか細かい実験色々してる。 カリフォルニアの一日。色々細かい実験してる。 パリの軍事パレード モンスターカーのイベントだよ。 海水浴客とか 今もぼちぼちと集めているので、おすすめのものがあったらコメント欄などで教えてください！！
スマホアプリの売り上げと、セールの相関関係レポート | fladdict
Distimoから最新のレポートが出たので、入手して読んでみた。 ざっとまとめ、細かいことは各自Distimoでユーザー登録してレポをDLしてください。 概要 スマホアプリがAppStoreで紹介されたときの効果と、セールの影響力についての概要。おもな発見は以下の通り。 ・セールは、アプリの注目を得るために行われるもっともメジャーな方法。iPhoneのAppStoreでは、すでにDLランキング100位に入っているアプリの場合、セール初日の利益が平均41%増。セール期間中の利益は総額で22%増加。iPadの場合は初日利益は52%増、期間利益は12%増。Androidにでは初日利益7%、期間利益29%。 ・全てのストアでセールによる平均利益は増加しているが、セールを行った30〜50%のアプリでは、逆に利益が低下している。調査では、セールを行う場合、大幅な値下げほど利益を押し上げることが判明。最
スマホUI考3 ～ ジェスチャ入力について | fladdict
スマホUI考１ 〜 ボタンについて スマホUI考２ 〜 フィードバックについて スマホといえばジェスチャー入力、ジェスチャーといえばスマホ。そんなジェスチャーについて、つれづれと。 でも個人的には、ジェスチャーはほとんど要らないと思う。 ジェスチャ全般 ・ジェスチャは補助操作。メイン操作ではない。 ・ボタンでできる操作をプラスアルファで、ジェスチャでもできるようにする。 ・なぜならジェスチャの有無は視覚的にわからない。 ・ユーザーがジェスチャを理解しなくても操作できるのがよい。 ・またジェスチャー時に、画面のかなりの部分が指で隠れる。 ・極論ジェスチャなしでもアプリがリリースできる状態なのがよい。 ・つまり予算や工数があまったときに入れよう。 タップ ・マウスクリックではなくタップ。 ・ボタンの精度は指のサイズに依存する。 ・細かい座標指定はできない。 ・ロールオーバーがない。 ・触ってみ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
