iPhone Dev Sap勉強会で発表した「iPhoneアプリのUIデザイン - NoteCubeの場合」の資料を公開しました。 - らっこのじゆうちょう
5月10日の「iPhone Dev Sap勉強会 May, 2014」で発表した「iPhoneアプリのUIデザイン - NoteCubeの場合」のスライドを公開しました。 iPhoneアプリのUIデザイン - NoteCubeの場合 from Daigo Wakabayashi NoteCubeというメモアプリを制作する際に、UIについてどのように考えてデザインしたかについてお話しました。 https://itunes.apple.com/jp/app/notecube-shinpurude-shiiyasuimemoapuri/id657311491?mt=8&uo=4&at=11ldBU アプリのUIについては、いろいろと思うところや伝えたいこともあるので、次回7月のDevSap勉強会でも何かお話したいなーと思っています。
勝手にリデザイン：新宿高層ビルの館内施設案内板
勝手にリデザイン：新宿高層ビルの館内施設案内板 新宿のとある高層ビルの館内案内標識が話題に。後学のために、仕様・問題点を整理、改善案の作成を行ってみました time2011/09/08 hatenabookmark- Twitterで、あるサイン（案内板）のことが話題になっていました。新宿のあるビルの案内図のようですが、わかりづらいことが問題になっているようです。 …確かにこれはわかりません。トイレを探している時に遭遇したら結構辛いと思いますね。でも、なぜわかりにくいのか、どういう改善案が考えられるのか、もう少し考えてみることにしました。 仕様 まず、この図から読み取れる情報だけでは何が「正解」かわからないので、実際の現場に足を運んでみました。 そして、館内をぐるっと見学してみて、大体の施設の配置を把握してきました。（ちなみに、ビルの中をウロウロしてると普通に不審者だと思うので、警備員の方
#19 「iOS6のカスタムUIAcitivityのつくりかた」 tech.kayac.com Advent Calendar 2012 - KAYAC Engineers' Blog
突然ですが、tech.kayacの読者の皆様方におかれましては、自社でWebサービスを運営している方、及びそのサービスのクライアントとしてのネイティブiOSアプリをリリースされている方はかなり多いのではないのでしょうか。 そんな独自サービス／アプリを、もっと多くの人に使ってもらえるきっかけとなる（かもしれない） UIActivity という iOS 6 の新機能について書かせていただきます。 あ、申し遅れました、入社３年目にして初めて投稿する、ツツミ（@shu223）と申します。ひたすらiOSアプリをつくり続けております。 UIActivityとは？ iOS 6 から入った、こんなやつです。 FacebookやTwitterに投稿したり、テキストをメールで送信したり、写真アプリに画像を保存したりと、とにかくアプリやサービス連携の総合受付みたいなUIです。 実装は超カンタン この UI、UI
デザインの仕事にある成熟と熟練
デザインの意味とは … といった禅問答のような質問をときどき耳にします。語源まで辿って「記号を表す」といった説明をする人もいれば、「設計をする」と応える方もいます。装飾という意味合いをデザインから離す人もいますが、装飾もデザインの一部として捉えることもできます。 デザインの定義は読者ひとりひとりに委ねますが、デザインを学習したい場合「人それぞれだから頑張って」で済ますわけにはいきません。デザインの『入り口』が必要ですし、どこへ向かっていくのかという目的地も必要だと思います。 デザイナーの成熟度は、以下のような UI を見たときの反応で判断することができます。 あるサイトの UI を基にしてつくったスケッチ デザイナーによって、この UI に対するリアクションは異なります。大きく分けると 4 つあります。 見た目を変えたい インプットフィールドの見た目が良くない。タイポグラフィの選択が良くな
開発者は必見? GoogleがAndroidアプリのUXアンチパターン動画を公開 - すまほん!!
数多のアプリが氾濫する Android アプリですが、過去に開発の経験がある方・現在進行形で開発中の方……数多くいらっしゃるかと思います。 そんな方に是非、ご覧頂きたいのが Google が Youtube にて公開している ANDROID DESING in ACTION UX アンチパターンです。ご存じの通りアンチパターンとは「べからず集」のことで「これは駄目だからこうして欲しい」といったことがわかりやすく紹介されています。 動画の内容としては、ダイアログの表示方法、ボタンの位置、タッチフィードバック……etc 開発者の方はそのまま知識を吸収することができますし、開発者ではない方も「へー」と思えること間違いなしです。
横野 巧也 | 私としごと | WEBデザイナー・音楽・編集…クリエイティブの求人 CINRA.JOB
国内最大級のイラストコミュニケーションサービス「pixiv」。そのUIデザインを手がけるのが横野巧也さん。高校卒業後すぐにアニメーション制作会社へ就職するも、すぐに帰省。そのままニートとなり、気づけばインターネットの世界へ……。以後10年間、インターネットにどっぷり浸かった日々を過ごしてきた横野さんだが、ピクシブに入社してからは、リアルな世界に面白さを感じるようになってきたのだとか。一体、何が横野さんを変えたのだろうか。 インタビュー・テキスト：村上広大 撮影：すがわらよしみ 高卒・未経験で飛び込んだ、アニメ制作の世界。そしてニートになる。 ―現在、ピクシブでUIエンジニアをされているということですが、もともとイラストが好きだったりしたんですか？ 横野：小さい頃から絵を描くのが好きで、小学生のときも漫画家になりたいと言っていたんです。親にダメもとで「漫画を描くようなペンが欲しい！」って言っ
フラットデザインの制作に活用したい PSD UIキット「15 Latest PSD Flat UI Kits for Designers」
TOP > Design > フラットデザインの制作に活用したい PSD UIキット「15 Latest PSD Flat UI Kits for Designers」 現在主流のフラットデザイン。シンプルなデザインが特徴ですが、これまでに制作したことがない方にとっては、コツをつかむまでに時間を要することもあるのでは？今回はそんな制作シーンに活用したい、PSD UIキット「15 Latest PSD Flat UI Kits for Designers」を紹介したいと思います。 （EAMEJIA | Premium and free graphic design resources | Flat UI Kit PSD） フラットデザインテイストの、さまざまなwebデザインで利用できるUIがセットになって紹介されています。 詳しくは以下 Free Spark Flat UI Kit
The ustwo™ Pixel Perfect Precision Handbook 2 日本語版
『Pixel Perfect Precision™ Handbook 2』（以下PPP™）は、ウェブサイトなどのデジタル環境用のデザインをする上での基本原則と、実践ですぐに使える具体的なPhotoshopのテクニックが収録されているドキュメントです。その名の通り、パーフェクトな精度のピクセルでデザインをするためのノウハウが、わかりやすいビジュアルと簡潔な文章でまとまっています。 元々PPP™は、グローバルに拠点を置くデジタルデザインスタジオustwo™ のGyppsy氏が制作したドキュメントです。iBooks版とPDF版のPPP™ドキュメントに加え、スクリプトやPhotoshopパターン集を付録の「エクストラ」として、ustwo™ ウェブサイトにて無償で配布しています。 PPP™は、デジタルデザインを学びたい人に、デザインの基礎知識と概念的な全体像を提供できるドキュメントであると同時に、既
iOS7.1 Safariのminimal-uiと高さ100%コンテンツへの使用警告
Updated 2014.11.01 / Published 2014.03.11 The minimal-ui viewport property is no longer supported in iOS 8. ということで、minimal-uiはiOS8からは早速サポートされなくなり、iOS7.1限定のものすごく短命な機能となりました。 iOS 7.1がリリースされました。いろいろ改善されたり不具合がなおっているとのことですが、職業柄、特にiOSのSafariについてのチェックはかかせないため、チェックしていた最中に見つかったiOS7.1 Safariにおいていくつか注意すべき点を報告いたします。特にhtml, bodyともに高さ100%のコンテンツを作成している場合にiOS 7.1から指定できるようになったminimal-uiを指定すると、深刻な不具合が生じることを警告いたします。
なぜデザイナーはボタンをあと3ピクセル左に寄せるべきなのか？
by Ugo Cristofori デザイナーにとってデザインのディテールは非常に気になるところですが、デザイナー以外には違いがあまり伝わらず「ボタンを3ピクセル動かすだけで製品が改良されるの？」と言われたりします。しかし、プロダクトデザイナーとしてGoogle Venturesで働いているBraden Kowitzさんは「それでもデザイナーは細部にこだわるべき」として、細部までこだわるべき理由と、他の人たちにそれをどう伝えるべきかのテクニックについて語っています。 Why you should move that button 3px to the left | Google Ventures http://www.gv.com/lib/design-details ◆デザインは外見のためだけに行うのではない by Bytemarks ・ディテールを適切にすると信頼感が増す 顧客がオンラ
CATransitionでトランジションエフェクトを実行する方法 - プログラミングノート
レイヤのコンテンツ全体に作用するエフェクトを実行する場合は、Core Animation Transitionを利用するのが便利です。Core Animationは色々複雑なことが出来るようですが、今のところアニメーション関連はUIViewのクラスメソッドとこのCATransitionで事足りています。 CATransitionは、UIViewアニメーションのようにブロック単位で動作を指定するのではなく、レイヤ全体が対象となります。ですので、下記のように記述しておけば次回画面が描画されるタイミングで、指定したレイヤに対してアニメーションが実行されます。 // QuartzCoreが必要 #import <QuartzCore/QuartzCore.h> ... - (void) startTransition { CATransition *animation = [CATransitio
[iOS] ナビゲーションコントローラのトランジションを手軽に差し替える方法 | DevelopersIO
UINavigationControllerのトランジションエフェクトを簡単に変えたい 業務でiOSアプリ開発をやっていると、時々画面のトランジションエフェクトを全体的にデフォルト以外のものに変えてほしいという要望を頂く事があります。トランジションエフェクトの要望が局所的な場合や画面数があまり多くない場合は、個別に実装してしまっても問題ありません。しかし、画面数がそこそこあるアプリだと、UINavigationControllerで画面遷移を管理しつつ、デフォルトのPushトランジションエフェクトを置き換えてしまった方が楽です。そこで、今回はUINavigationControllerのトランジションエフェクトをデフォルトのPush以外に簡単に置き換える方法をご紹介します。 開発環境 今回の開発環境は下記の通りです。 OSX 10.8 Xcode 4.6 iOS SDK 6.1 UINav
初回起動時の離脱率をどうやって改善するか | うめのん開発日誌
昨日iPad対応が一段落着いたので、今日はアプリを起動したものの、すぐ離脱してしまう割合をどう改善するかを考えた。 アプリ起動して仕訳け入力までいく割合は？ この数字は、アプリを始めて起動する => 仕訳け入力を一度でもやる という二つの動作をしてもらえた割合です。 Taxnoteは仕訳入力をするという動作をしないとアプリを使っている事にならないので、まずは仕訳入力をやってもらわないとアプリのよさがわからない。 数字を見てみると、37％です。これは低い。つまり、6割以上の人が、アプリを起動してなんとなく画面みて、それで終わりというダメな状態。 アプリのUIの改善もやりたいけど、まず、この最初のフローをなんとか改善せねばならない。 アプリの改善には、ユーザーの意見を直接聞くの同時に、一つだけ実際に行動に移せるKPIを決めるんだけど、現時点での”Taxnoteは起動してから仕訳入力を試してもら
iOS 7 UI 移行ガイド: コントロール部品
コントロール部品 コントロール部品とは、情報を表示し、あるいはアクションを実行するために用いるUI要素のことです。iOS 7ではいずれも外観が変わり、多くは寸法も変わっています。 UIControl は UIViewの派生クラスなので、 tintColor プロパティで色遣いを設定できます。ビューの色遣いの設定について詳しくは、 “色遣いを指定する”を参照してください。 デフォルトでは、システム組み込みのコントロール部品にはシステム定義のアニメーションが付随しており、強調状態および選択状態に応じて外観が変わるようになっています。 日付ピッカー 日付ピッカーには、時、分、日、年など、日付や時刻の構成要素が表示されます。 iOS 7でも全体の大きさは同じです。 iOS 7のアプリケーションは一般に、独立したビューを用意せず、コンテンツに埋め込む形で日付ピッカーを使います。たとえば「カレンダー(
iOS 7で大きく変わったUI周りの開発に役立つ記事26選
iOS 7で大きく変わったUI周りの開発に役立つ記事26選：ここが変わった！ iOS 7まとめのまとめ（3）（1/3 ページ） 大きく変化したiOS 7に戸惑う多くの開発者／デザイナーのために、役立つブログ記事をまとめて紹介していく、まとめ連載。今回はUIKitやSprite Kitの機能を使う、アプリのUI周りやアニメーション、画像フィルタなど見た目に関するブログ記事をまとめて紹介します。 2013年9月18日、iOS 7の正式版リリースが始まりました。iOS 7は旧来のiOS 6に比べるとUI含め変わった部分が大きく、戸惑っている開発者／デザイナーも多いと思います。 そこで本企画ではアプリ開発者／デザイナー向けに、iOS 7リリースに合わせて多数のブログ記事を執筆したクラスメソッドの協力の下、数回に分けてiOS 7に関する情報をまとめて紹介していきます。 前回の「便利になったXcode
革新的デザインの裏側【インタビュー】Flipboardデザイン主任-Marcos Weskamp デザイン会社 ビートラックス: ブログ
まるで雑誌をめくるように、最新のニュースや友だちのアップデートを見ることのできるアプリケーション「Flipboard」。その革新的なインターフェイスと操作性(UI/UX)はリリース直後から大きな反響を呼び、Appleの選ぶ最も優れたiPadアプリである「iPad App of the Year」(初年度)にも輝いた。驚くべき事にコンセプト段階では、PCブラウザー向けに考えられていたという。 そして、現在まさにユーザビリティデザインの優れたアプリケーションの代名詞とも言える彼らが、今年9月には30の公式コンテンツパートナーを揃え、日本国内でもいよいよ本格的な展開をみせてきた。今回はそんなFlipboardの生命線とも言えるデザイン部署を統括するMarcos Weskamp氏と、広報担当のChristel van der Boom氏に、Flipboardのデザイン哲学と今後の展望を伺った。 【
ペーパープロトタイピング入門 – 第1回 どうして紙でプロトを作るのか | fladdict
ペーパープロトタイピング講座シリーズ。第1回は導入編。 第1回はの導入編。ペーパー・プロトタイピングとは何なのか、何故必要なのか。そして導入することで、どんな利点があるのかを説明する。 ペーパー・プロトタイピングって何？ ペーパー・プロトタイピングとは、紙で実際にアプリやサイトを「実装する」ことである。 通常の開発においてコンテンツが使いやすいかどうかは、開発が終盤になるまでわからない。このため「作ってはみたが使いにくい」や「いまさら後戻りできない」という問題が発生する。UIや手触りが重要なモバイル系のアプリにおいて、これは致命的な問題になる。ペーパープロトタイピングはこの問題を低コストで解決する。 紙とペンで動作モックを作成することで、本実装を行う前に、素早く手戻なく検証を行うことができる。これにより、仕様書策定や実装前にPDCAのサイクルを実現できる。作業負荷の高い本実装を行う前に軽く
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
UITableVIewの中身を分割してみませんか？
森田雄と深津貴之の UX 侍 初陣「全国タクシー配車アプリ」開発担当者とUXを語る | UXサムライ
新着記事
