[ヅ] Swift で Twitter 投稿 UI を構築するサンプルコード (Storyboard を使わないお手軽コピペ版) (2016-01-21)
iPhone 用 Twitter クライアントアプリの投稿画面をいくつか集めてみた。だいたい同じような UI をしている。 → iOS アプリの Twitter 投稿画面あれこれ (iOS_Twitter_Post_Screen - MemoWiki) これらの画面を参考にして、Twitter でツイートを投稿する画面のテンプレート的な UI を Swift で書いてみた。 Storyboard を使わずに、サンプルコードをコピペするだけで UI を構築できるようにしてある (ファイルの追加は必要)。 UI部分のみで、ツイート機能などの実装はしていない。そのへんの機能が必要な場合は、このへんを参照 → [ヅ] Swift で位置情報付きの Twitter 投稿するサンプルコード (Storyboard を使わないお手軽コピペ版) (2015-12-09) 今回の動作確認環境: Xcode
![[ヅ] Swift で Twitter 投稿 UI を構築するサンプルコード (Storyboard を使わないお手軽コピペ版) (2016-01-21)](https://cdn-ak-scissors.b.st-hatena.com/image/square/8c99dec31154540a8ec818e9a0aa155d828065bd/height=288;version=1;width=512/http%3A%2F%2Fwww.nilab.info%2Flab%2Ftwitterpic%2F679653601375948804_1.jpg)
メガメニューはサイトナビゲーションに効果あり
大きな二次元のドロップダウンパネルは、ナビゲーションの選択肢をグループ化することでスクロールの必要性を無くし、タイポグラフィやアイコン、ツールチップを使うことで、ユーザの選択できる内容をわかりやすく提示してくれる。 Mega Menus Work Well for Site Navigation by Jakob Nielsen on March 23, 2009 もうすぐ開催予定のナビゲーションデザインセミナーに向け、我々は様々なナビゲーション機能についてのユーザスタディを実施している。いつものことだが、中にはひどい結果が出てしまった機能もあるし、これまた、いつものことだが、今、流行のようになっている機能（今回の場合はタグクラウド）にはユーザビリティ上の大きな課題が見つかった。 幸いにも、他のウェブトレンドは本質的にユーザビリティに優れており、ユーザの行動やゴールによく合っているというこ
Jesse James Garrett: The Elements of User Experience - Translations
The Elements of User Experience User-Centered Design for the Web Translations of the original diagram Spanish (thanks to Javier Velasco) Italian (thanks to Antonio Volpon) French (thanks to Thierry Goulet and Martin L'Allier) Slovene (thanks to Vuk Cosic) Portuguese (thanks to Livia Labate) German (thanks to Andreas Lutz) Dutch (thanks to Sven van de Riet) Japanese (thanks to Noriyo Asano) Vietnam
Jesse James Garrett: The Elements of User Experience
The Elements of User Experience User-Centered Design for the Web from New Riders Publishing in conjunction with the American Institute of Graphic Arts order now from Amazon.com the original diagram that started it all translations of the original diagram the simple planes poster teaser posters: #1 #2 #3 from the book: table of contents introduction chapter 2: meet the elements What the reviewers a
TInder like user interface
About HTML Preprocessors HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug. Learn more · Versions Adding Classes In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. So you don't have access to higher-
Tinder-esque location pulse animation effect
As shameful as it is to say I wanted to see what all the fuss about was with Tinder, but after downloading it I found I was more interested with its animation effects and started wondering how they did them! I decided I wanted to see if I could replicate some of them using jQuery so they can be used on web apps and sites and such, but it's always nice to have these snippets lying around if I ever
HTML5のVibration APIを使って画面を見なくてもダイヤルできるやつ作った (Kanasansoft Web Lab.)
画面にタッチしたり、タッチしている位置を移動すると、ボタンの種類別にもっている振動パターンでふるえる。 入力の決定は、画面から指をはなしたタイミングになっている。 入力を無効にしたい場合は、「Cancel」の位置で指をはなすと良い。 一番上の入力した番号が表示されているところで指をはなすと、入力済みの番号の確認が可能。 あとは、説明しなくても使えるかと。 画面の回転は無考慮。 ソースはGitHubにも上げた。
ユーザーの知識は低いレベルで停滞する
学習というのはたいへんな作業なので、ユーザーのやりたいことではない。その結果、彼らはユーザーインタフェースの探索をすることもなく、ほとんどの機能について知らないままだ。 User Expertise Stagnates at Low Levels by Jakob Nielsen on September 28, 2013 日本語版2013年11月25日公開 コンピュータシステムを長期間利用しているユーザーでも、知っていて使っているのは利用可能なコマンドや機能のほんの一部だけであることは多い。デザインのユーザビリティが優れていれば、ユーザーはシステムを利用しはじめて間もなく、かなり容易に一連の基本機能を理解する。しかし、その後、彼らは伸び悩み、それ以上はたいしてスキルが上がらない。システムを頻繁に使っているユーザーですら、年にわずか1つか2つの新しい知識を身につけられるようになるまでには何
Android : Navigation Drawer を使う
画面の左側にオーバーレイでアプリの主なオプションを表示するパネル。 通常は隠れていて、画面の左端からスワイプするか、トップレベルにいるならアクションバーのアイコンをタップすることで表示される。 http://developer.android.com/design/patterns/navigation-drawer.html より Navigation Drawer を使う前に、Navigation Drawer デザインガイドにあるこのパターンのユースケースとデザイン原則をきちんと理解すること。 Drawer Layout を作成する support package にある DrawerLayout を利用する。 DrawerLayout をルートビューとし、その中にメインのコンンテンツを表示するビューと、NavigationDrawer として利用するビューを入れる。 <androi
Navigation drawer – Material Design 3
Navigation drawers provide access to destinations in your app.
ソシオメディア | iPhone の当たり判定を検証した
スマートフォンやタブレットなどのモバイルデバイス向けにUIをデザインする際には、タッチ操作に適したコントロール表現を追求しなければいけません。 タッチ操作に適したコントロール表現とは、前回書いたジェスチャもありますが、それ以前に、ボタンやリンクなどのUI要素を指で押しやすい大きさにすることが大切です。 パソコン画面のマウスポインターと違って、タッチスクリーンにおいて指でボタンをタップする場合、指がそのボタンを覆い隠してしまうので、意図した場所に正しく触れているのか分かりにくく、またボタン自体の視覚的なフィードバックも確認しづらいという課題があります。 またマウスポインターではピクセルレベルで画面上の座標を指し示すことができますが、指先ではそのような細かい操作はできません。 ですからタッチデバイスでは、ボタンやリンクが細かく密集しているようなデザインは大きなストレスになります。 最低限の大き
圏外でも利用可能! インクリメントＰ、地図内蔵のiPhone向けナビアプリ発表
また、オンライン環境では、ルート案内や音声ガイドも利用可能。ルート案内には、「高速(有料)道路優先」「一般道優先」といった自動車用の案内機能だけでなく、「簡易歩行者」と呼ばれる自転車・歩行者向けの案内機能も用意されている。 加えて、同社がMapFan Webで提供しているサービス「テレビ de み～た」と連携する「TVスポット」機能も用意されており、過去にテレビで紹介された各地のお店や施設を地図上に表示させることもできる。インクリメントＰ サービスプラットフォーム事業本部 第一技術部 第四技術グループ 今枝洋一氏によると、「お店・施設情報は1日3回程度更新されており、午前中にテレビで放送されたランチ情報も夕方には検索できるようになっている」という。 そのほか、ピンチイン/アウトでの縮尺変更が可能なうえ、地図上の文字はそのままに地図画像だけを1本指でぐるぐると回転させられるなど、操作性にも配
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Edge UI Kit - Limited Edition - Design Freebies
Yahoo! JAPAN
iOS7でAppleが目指したのは「UIデザインの常識」の再発明である
访问安全
TechCrunch | Startup and Technology News
androidviews.net
Introducing Smoothie
KLab
