リアルタイムで共同編集ができる新しいデザインツールとして注目を浴びる「Figma」について学べるカリキュラムです。チームでアプリやWebサービスを作っている現場におすすめ。
Flows are just as important to good interfaces as individual screens are. Customers don’t land on screens from out of nowhere. Specific sequences of actions lead customers through your app as they try to accomplish their tasks. But as important as they are, flows are hard to communicate during the design process. Drawing out every state of a flow is too time-consuming. And drawings become instantl
2014.11.19 / UI 画面遷移に疑問を感じたあなたにオススメするUI Flowsというツール Tomohiro Suzuki クライアントやディレクターから渡された画面遷移図を元にワイヤーフレームを作ってみると、後から足りない画面が次々に発見された、または画面内の情報がどこに繋がるのか分からないといった経験はありませんか? この画面遷移図というものは本来は制作範囲の全体像と構造を明確にし、必要な画面というものを洗い出したりするものです。通常のWebサイトであれば、従来のような画面遷移図でも問題ないかもしれませんが、多くのインタラクションが発生するサービスの設計では複雑化しやすく、何度も情報を行き来して確認することになるため時間がかかります。 原因のひとつとして、画面遷移図では画面名のみを記載して繋げていくことになるため、必要な情報が不足していることが挙げられます。その結果、本来で
【参考】untitled - iOS 7 のテキスト入力欄(UITextView)の問題について iOS 7のUITextViewのバグを1行で直す裏ワザ [[NSUserDefaults standardUserDefaults] setBool:NO forKey:@"UIDisableLegacyTextView"]; 解説 iOS 7にはバグだらけのUITextViewのほかに_UICompatibilityTextViewというiOS 6以前のUITextView(と思われる)クラスがあり、 メモ(Notes.app)など同様の不具合が再現しない標準アプリは_UICompatibilityTextViewが使われている。 そしておそらくこのフラグによってUITextViewをインスタンス化したときにどちらが使用されるかが変わる。 以下のようにmain.mあたりで設定すると有効にな
Mac / iOS 開発担当の松本です。 以前同じチームのミヤモトさんが紹介記事を書いていた UIAutomation ですが、使いにくくて使っていませんでした。というのも以前のバージョンはコマンドラインからテストを実行できず、毎回 Instruments を手で起動して、、という残念な状態だったからです。 ところが iOS SDK 5からはコマンドラインからテストを実行できるようになったと言うので再度トライしてみました。 コマンドラインからテストの実行 手始めに下記のハローワールドをコマンドラインから実行してみます。 // hello_test.js UIALogger.logMessage("Hello, UI Automation!"); テストの実行は instruments コマンドで行います。 $ instruments \ -t /Developer/Platforms/iP
iOS7で採用されたフラットデザインっぽいUIを、現行iOS(〜6.x)で実装する際に役立つOSSをまとめました。後半ではiOS7っぽく下のビューをブラーかけて半透過表示するライブラリや、パララックス表示するライブラリも紹介しています。 * English version of this article ※(2013年7月17日追記)9点追加し、カテゴリ毎に分類しました。 総合 FlatUIKit フラットデザインなUIコンポーネント詰め合わせ。ソースをみると、ほとんどのコンポーネントが該当するUIKitコンポーネントのカテゴリやサブクラスとしてつくってあって、使いやすそうです。 FlatUI 同様にUIコンポーネント詰め合わせですが、かなりiOS7に似せてつくられている点が特長です。 UI7Kit iOS5, iOS6 で iOS7 の見た目を実現するUIKitのサブクラス集。 iPho
potatotipsというのはクックパッドさんが開催しているiOS/Android開発者のtips共有会です。 普段は社内のメンバーで定期的に行っているそうなんですが、今回は社外の開発者も含めて開催でした。 持ち時間は1人あたり5分と短かったので、すぐに活用できそうなtipsが多かったように思います。 話したこと iOS 7になってからUINavigationBarのcustomViewが中央寄りになってしまい、 バーの両サイドに配置されたカスタムボタンが押しにくいという問題が起きました。 これだけを理由にUINavigationBarを使うのを辞めるのはもったいないので、 customViewのフレームに影響されずに隅々までタップできるUINavigationBarを実現する方法を考えました。 実装のアイディアは結構単純で、customViewのフレーム外であってもタッチイベントの位置に
ios6 → ios7対応をする際にios6のデザインで対応する際の覚え書き レイアウト崩れ 原因は、ほぼこれ In iOS 7, view controllers use full-screen layout. At the same time, iOS 7 gives you more granular control over the way a view controller lays out its views. In particular, the concept of full-screen layout has been refined to let a view controller specify the layout of each edge of its view. 全体的に上部に寄ってしまっているのを対処 xcode4で作成したアプリをxcode5で見ると全体的に
レイアウトファイルに記述する場合はそれぞれ以下のように行います。 <ProgressBar android:id="@+id/ProgressBarDefault" android:layout_width="wrap_content" android:layout_height="wrap_content"> </ProgressBar> <ProgressBar android:id="@+id/ProgressBarHorizontal" android:layout_width="fill_parent" android:layout_height="wrap_content" style="?android:attr/progressBarStyleHorizontal"> </ProgressBar> <ProgressBar android:id="@+id/Progress
顧客や上司、ユーザーの場当たりな要望に対応しつづけると、どんなアプリもゴミアプリになる。たとえそれが理にかなった要望であっても。 なぜなら面積の限られたスマホでは「一画面の機能数とボタン数」が、使い易さと品質に深くリンクしているからです。 ということを、エラい人にプレゼンするのがお仕事の今日この頃。でも毎回毎回、同じことを説明するのがシンドイので資料をブログにまとめたいなぁと思うなど。 思考実験として、ここでは架空事例としてTwitterアプリを例に考えてみる。 何かの間違いで、日本の大手メーカーがTwitterを買収すると・・・UIデザイナーが体を張らないと99%ぐらいの確率でこうなるのです。 ここがオリジナル Request1: ダイレクトメッセージをトップ階層に ユーザーからの真っ当な要望。実際にはサービスの本質ではないのですが、要望はかなり多いはず。 ただTwitter社的にはme
結論から申し上げますと、「変数の内容を一時的に待避させる」目的*1 以外ではtemp (あるいは tmp) という名前の変数は使いません。 それ以外の用途で temp という名前の変数が使われている場合、そのコードはイケてない可能性が高いです。気をつけましょう。 そもそも temp とはなにか http://ejje.weblio.jp/content/temp http://ejje.weblio.jp/content/temporary 辞書を引いてみると「一時的な」、「臨時の」という意味合いのようです。 変数の名前 変数の名前は「その変数が何者か」という事を *シンプルに* 表している必要があります。 つまり、temp という名前の変数を利用したい場合は、「一時的な」とか「臨時の」とか、という意味合い以外で使ってはならないのです。 以下の2つの簡単なコードを比較してみましょう。 na
WWDC 2013でOS X MavericksやMacBook Airらと一緒に、iOS 7が発表された。フラットデザインになるとかねてから噂されていたし、直前には9to5MacがリークされたiOS 7を元につくったというモックアップを掲載していた。そのデザインは悪い冗談にしか思えなかったが、翌朝WWDCで発表されたiOS 7はその悪い冗談そのものだった。 iOS 7のデザイン変更のきっかけのひとつは、過剰なSkeuomorphicデザインへの批判だと思うけど、おれはiOS 6以前のSkeuomorphicあるいは過剰な装飾が嫌いじゃない。批判されることの多かったNewsstandの木の本棚やGame Centerの緑のフェルトなんかは正直言って結構気に入っていた。無意味な遊び心だけじゃなくそれが何を表してるか明確だし、特に誤解を招く表現でもなかった。それにiOSはシングルタスクでひと
Mark Pospesel (Coding and Other Stuff) Coding, tech, living abroad, travel, hiking, vintage plastic bricks I’ve put a project I call MPFoldTransition up on GitHub. It provides a class you can use to add a fold transition to your application in just a single line of code (in most cases). What is a fold transition? It’s an animation such as shown above (or as popularized by the Clear todo list app)
2013年01月20日 UIの改悪がUXを改善させる場合 Tweet Good UI≠Good UX UIとUXについてはその理解について多くの議論がなされてきた。たとえば、Googleの及川氏は「写真が語るUXとUIの違い」というエントリにおいてコーンフレークの例を元にUIとUXについて説明したが、その後、ERATOの渡邊氏が「1分でわかるUIとUXをわかりやすく説明する写真とお話」というエントリにおいて、ATMを例によりわかりやすい説明を挙げている(次の写真は当該エントリからの引用)。 この例ではたとえUIが素晴らしくても、そのATMは時間がかかるため、長い待ち時間ができ、結果としてUXが損なわれる場合を示している。 しかしながら、実際にはATMの劣悪なUIが悪いUXの原因となっている可能性があり、本当にこのATMのUIは素晴らしいのかという疑問が残る。つまり「Good UI ≠ Go
Evernote クリエイティブディレクター Gabe氏によるデザイントーク「シリコンバレー流UI/UX/Brand Development」に参加してきました。非常に面白い話しが聞けましたのでその内容をまとめました。 先日Evernote クリエイティブディレクター Gabe氏によるデザイントーク「シリコンバレー流UI/UX/Brand Development」に参加してきました。 普段聞くことのできない貴重な話が聞けました。 始めに このエントリーはセミナーで取ったメモを元に僕なりにまとめています。 Gabe Campodonico氏の発言の詳細は安藤日記さんがまとめられてたのでそちらをご覧ください。 安藤日記 Gabe Campodonico氏 Gabe Campodonico氏は、現在Evernoteのクリエイティブディレクターです。 その経歴はポスターや本などのグラフィックデザイ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く