タグ ナビゲーションバー
新着順 10 users 50 users 100 users 500 users 1000 usersiPhone/iPadアプリデザインで使っているツール | 云々(うんぬん)
企画やらUIを考えるツール iPhone Idea Sheet(PDF) 三階ラボさんのアイデアシート(PDF)。 iPhoneの枠だけじゃなく、ナビゲーションバーやタブバー、ステータスバーが書きやすいように、うっすら線が入っていてGOOD。 印刷して何枚か持ち歩いている。何か作りたいなーどうかなーと思ったら、手書きでワーっと書く。このシート自体が美しいので、いいもの作れそうな気がしてくる。 紙な... 続きを読む
スマフォ用サイトでよく使うエレメントが豊富に揃ってるフレームワーク -ChocolateChip-UI | コリス
スマートフォンなどのモバイル用サイトを簡単に制作できるようにするJavaScriptベースのフレームワークを紹介します。 先日リリースされたiOS5にも最適化されています。 ChocolateChip-UIで用意されているエレメント あらかじめ用意されているエレメントは数多くあります。 ツールバー ナビゲーションバー ボタン アイコン ナビゲーションリスト テーブルビューアー セレクションリスト ... 続きを読む
モーダルを閉じるボタンのUIは右か左か | Reflection
モーダルビューを「閉じる」ボタンの位置は右に置くべきか左に置くべきか。iOSにおいてはナビゲーションバーの右と左の2択であるため、逆に迷ってしまいがちなのかもしれません。 よくある話としては「設定ボタンがナビゲーションバーの左にあるのなら、同じように左側に閉じるボタンを配置するべきではないのか…」といったことをよく聞きますが、トリガーとなるボタンの位置はあまり関係なく、その後のモーダルビューでの内... 続きを読む
Photoshop Vip » ウェブデザインに便利なPSD素材を無料ダウンロードできる5つの優良サイト
NewsHome > News > ウェブデザインに便利なPSD素材を無料ダウンロードできる5つの優良サイトウェブデザインに便利なPSD素材を無料ダウンロードできる5つの優良サイト2011年3月4日 ウェブデザイン制作においてボタンやナビゲーションバー、バナーデザインは重要なデザインパーツです。しかしすべてのパーツをPhotoshopで制作するとなると時間もアイデアも必要となります。そんなと... 続きを読む
【保存版】CSS Flexboxでレスポンシブ対応のレイアウトを実装するHTMLとCSSのシンプルなコードのまとめ | コリス
CSS Flexboxで実装するWebページでよく見かけるレスポンシブ対応のレイアウト、カードレイアウト、ナビゲーションバー、サイドバー、聖杯レイアウトなどのHTMLとCSSのコードを紹介します。 コードは非常にシンプルなので、テンプレートやスニペットとして再利用できます。 Master CSS Flexbox 2021 ?- Build 5 Responsi... 続きを読む
EZ-NET: iPhone や iPad の画面レイアウト : iPhone プログラミング
□ iPhone や iPad の画面レイアウト iPhone や iPad でコントロールをレイアウトしようと思ったときに、どこからどこまでが何ピクセルとかわからなくなることが多かったので、整理しておくことにしました。 基本的に、iPhone では横が 320px の縦が 480px で、iPad では横が 768px の縦が 1024px です。その他のナビゲーションバーやツールバーといったも... 続きを読む
「Ajaxアプリでもナビゲーションバーで戻りたい!」を叶える、dsHistory登場 | エンタープライズ | マイコミジャーナル
Ajaxを活用して開発されたWebアプリケーションは、サーバとの通信をWebブラウザのページ読み込み処理とは異なる方法で(非同期で)行うため、基本的にWebブラウザのナビゲーションバーでは制御できない。つまり、Ajax機能を活用して再描画された内容は「戻る」ボタンでは戻れないということだ。 これは便利でもあり不便もである。特定の操作においては戻るボタンで戻れた方が扱いやすいこともある。Ajaxアプ... 続きを読む
2015年の最もよく使われているWebデザイントレンド | Flips Blog Web担の小技
2015年のWebサイト、Web デザインにおいて、海外で最もよく使われているトレンドについて以下、意訳となります。 特にナビゲーションバーの柔軟な変更や、機能アイコンに関しては、本当によく見かけるようになりました。 是非チェックしてみてください。 Top Web Design Trends for 2015 ゴーストボタン 背景に大きな画像を利用されるケースが増えたという影響もありますね。 ライ... 続きを読む
iOS 7 エンジニア勉強会 @Yahoo - 2013/10/07
Yahoo! 株式会社 2013/10/07 資料は後ほどシェア iOS 7 でアプリ開発はどう変わる (佐野さん) iOS 7 のデザイン原則 UI はコンテンツに従順 Safari が分かりやすい ナビゲーションバーが殆ど消える コンテンツを強調 分かりやすくスッキリしている 余白がたっぷり 平面的 アイコンよりもテキスト 奥行きがある iOS 7 = フラットを鵜呑みにしてはいけない UI ... 続きを読む
この発想はなかった!開いたアプリごとに最適な"アシスト"を自分で作れる「アプリアシスト」が超イカス!!無料 | アンドロイドアプリならオクトバ
ナビゲーションバーのホームボタンを上にスワイプするとGoogle Nowが起動しますよね。 ここをGoogle Nowの代わりにサブランチャーを仕込むアプリなどを以前紹介しました。でも今度の「アプリアシスト」はもっとスゴイ! なんと現在開いているアプリごとにホームボタンスワイプで起動するアプリを設定することができるんです! とにかくまずは便利な2つの設定を作ってみたのでご覧ください! アプリに「オ... 続きを読む
Chromeの拡張機能のアイコンを好きなアイコンに変える方法 : ライフハッカー[日本版]
Google , Google Chrome , Webツール , デザイン , フリーソフト , ブラウザ Chromeの拡張機能のアイコンを好きなアイコンに変える方法 2011.05.28 17:00 コメント数:[ 0 ] Check Tweet Chromeの拡張機能をインストールすると、右上のナビゲーションバーにクイックアクセス用のアイコンが表示されることがあります。これは便利でいいので... 続きを読む
ナビゲーションバーのボタンのデザインで犯しやすい5つの間違い | UX MILK
UX Movementの著者、編集長。明快で効果的なデザインを愛し、ユーザのために日々奮闘しています。 ナビゲーションバーは、サイトでもっとも大切な要素の1つです。ユーザーは必要なコンテンツを探し出すとき、ナビゲーションバーを頼ります。ナビゲーションバーのボタンを正しくデザインしなければ、ユーザーに無駄な作業をさせてしまうかもしれません。 間違ったデザインだと、ユーザーがナビゲーションフローのどこ... 続きを読む
ページ上部に隠れるナビゲーションバーが実装できるjQueryプラグイン「jBar」:phpspot開発日誌
jBar Plugin, the jQuery call to action bar : Todd Motto: Front-End Web Developer & Graphic Designer in Wiltshire, UK. ページ上部に隠れるナビゲーションバーが実装できるjQueryプラグイン「jBar」。 初期化すれば、次のようなつまみが現れて、クリックするとバーが現れるというインタ... 続きを読む
Bootstrap ナビゲーションバーのカスタマイズ方法といろいろなデザインの実装例 | コリス
Bootstrap 4のナビゲーションバーのカラーを変更したり、アイテムを整列させたり、レスポンシブのブレークポイントを変更するなどのカスタマイズ方法、ナビゲーションバーのいろいろなデザインの実装例を紹介します。 Bootstrap Navbar Guide and Free Navigation Examples by Nataly Birch 下記は各ポイントを意訳した... 続きを読む
オススメのXperiaテーマ20選 | orefolder.net
Android4.3以上のXperiaはテーマ機能に対応しています。各テーマはapkファイルでPlayストアやその他で公開されています。これをインストールすると壁紙やアイコンはもちろん、設定画面の配色やbuttonなど、そして通知領域やナビゲーションバーのアイコンまでも変わるものがあります。 というわけで、オススメの物をまとめてみました。 ※公開されているテーマの中にはroot権限がないと壁紙以外... 続きを読む
レスポンシブ対応のメガメニュー実装jQueryプラグイン「Accessible Mega Menu」:phpspot開発日誌
レスポンシブ対応のメガメニュー実装jQueryプラグイン「Accessible Mega Menu」 2013年11月18日- Accessible Mega Menu レスポンシブ対応のメガメニュー実装jQueryプラグイン「Accessible Mega Menu」 メガメニューとはナビゲーションバーを押すと表示される大きなメニューのことですが、こちらはレスポンシブ対応でPCでもスマホでも活用... 続きを読む
「Android 10」正式版リリース まずはPixelシリーズにローリングアウト - ITmedia Mobile
Googleが「Android 10」(コードネーム:Android Q)の正式版をリリースした。まずはPixelシリーズにローリングアウトしていく。ナビゲーションバーのないジェスチャーナビゲーションやシステム全体のダークテーマなどの新機能が使える。 米Googleは9月3日(現地時間)、モバイルOS「Android 10」の正式版をリリースした... 続きを読む
ブログのSEO対策として画面最上部に固定してあるSNSへのリンク・検索窓をフッターへ書き直してみた | OZPAの表4
最近読んだカグア!Googleアナリティクス解説Blogさんの最新SEO対策メモと7つの気づき2013と言う記事を参考に、最上部に固定してあるSNSへのリンク・検索窓の要素をフッターに書き直してみました。 これまでは <head></head> <body> <div id="header"> <div id="nav"> <!-- ここにナビゲーションバーの記述 --> </div> </div... 続きを読む
【iOS6】ステータスバーの色を検証 : Excite Smartphone Designer's Blog
iOS6ではナビゲーションバーの色に応じて、ステータスバーの色を自動的に変更してくれます。 どういうルールで色を表示しているのか、検証してみました。 今回は大きい画像が多いです。 色の例 ご覧のように、ナビゲーションバーが赤ければステータスバーも赤。 青ければ青、というように連動しています。 画像の場合 チェックの画像とボーダーの画像を用意しました。 グリーンのチェック画像は、ステータ... 続きを読む
iOS版 Gmail アプリ更新、iPad は全画面メール作成などメジャーアップデート - Engadget Japanese
Google がiOS 版Gmail アプリをバージョン 2.7182 にアップデートしました。UI を一新し、特にiPad での利便性が増したほか、スクロール操作もよりスムーズになっています。 主な変更点は、まずiPad をランドスケープ(横持ち)モードにすると、上記画像のように画面の左端にナビゲーションバーが表示され、アカウントの切り替えや受信箱の選択などがシングルタップで可能になりました。C... 続きを読む
Twitter、「Moments」タブに代えて「Explore」タブを追加へ - CNET Japan
Twitterは米国時間1月26日、新しい「Explore」タブを追加すると発表した。ツイートや流行のトピックをもっと簡単に見つけられるようにする新たな取り組みだ。 アプリのナビゲーションバーには、「Moments」を表す稲妻アイコンのタブに代わって、Exploreタブの虫眼鏡アイコンが表示される。Momentsは、大きく喧伝されたTwitterの機能で、多くの人が話題としているトピックスに関して... 続きを読む
ウェブとChrome版 TweetDeck がUI更新、サイドバー採用とフラット化 - Engadget Japanese
そういえば純正の Twitter クライアントである TweetDeck が、ウェブ版および Chromeアプリ版の UIをアップデートしました。 主な更新点は、トップにあったナビゲーションバーが側面に移ったこと、また本家 Twitter アプリに準じて全般にすっきりフラットなデザインになったこと。 サイドバーにはトップからツイートボタン、検索、に続いて各コラムのアイコンが並び、1クリックで任意の... 続きを読む
不評過ぎた? Windows版「Outlook」のナビゲーションバーを元に戻すオプションが追加/でも、Microsoftに撤回の意思はない模様【やじうまの杜】
ドコモの「Galaxy S8」でソフトウェア更新したら「謎の点」が出た件 - ITmedia Mobile
NTTドコモの「Galaxy S8 SC-02J」「Galaxy S8+ SC-03J」にソフトウェア更新が配布されました。手持ちのSC-02Jに適用してみたところ、見覚えのない「謎の点」がナビゲーションバーに……。 続きを読む
便利なのが登場! Tailwind CSSで実装されたOSSのUIコンポーネント集 -FlowBite
Webサイトやスマホアプリでよく使用されるUIコンポーネントをTailwind CSSのユーティリティクラスで実装したオープンソースのライブラリを紹介します。 Tailwind CSSには、コンポーネントの基本セットがありません。FlowBiteではナビゲーションバー、カード、ボタン、ページネーション、フォームなど基本的なコンポーネ... 続きを読む