ニッポンの引き算恐怖症 | 無線にゃん
今日もちょっとだらだらと長いです。愚痴です。特にモバイルとか携帯電話とかってことに限定される話でもないんですけど、今の日本のモノづくり、製品開発って、「引き算恐怖症」ともいうべき恐慌状態にあると思うんです。大企業病みたいな慢性疾患というよりは、恐慌状態。パニックで正しい判断ができなくなっている状態。 これは前にも似たようなことを書いたと思うんですけど、何かものを作る、ゼロから作る、って時は、たぶん、今できること x 市場の需要で機能を決めていると思うんですよね。なので、たぶん、最低限のものができあがって、大体他社もほぼ同じようなものを出して、あとはデザインか値段か、そのあたりで勝負になるんでしょうなぁ、という感じなんですよ。 しかし、その後継機を作る、って時に、前身製品機能 + (今できること x 市場の需要)、っていう足し算でものを作っているように思います。ほとんどの場合。たぶん、製品の
PCサイトとスマートフォンサイトを切り替える「Pc2Sp.js」
PCサイトとスマートフォンサイトを切り替える「Pc2Sp.js」 PCサイトとスマートフォンサイトを切り替える「Pc2Sp.js」を作成したので公開しておきます。 このライブラリを利用すると スマートフォンでPCサイトにアクセスした場合、指定したスマートフォン用のURLに転送されます。 PCでスマートフォンサイトにアクセスした場合、指定したPC用のURLに転送されます。 スマートフォン用ページでは「PCサイトを見る」なリンクが設定可能で、それがクリックされると、スマートフォンでPC用のサイトが閲覧できます。クリック後は1の転送機能が無効になります PC用のサイトでは、スマートフォンで見た場合のみ表示される「スマートフォンサイトを見る」なリンクが設定可能で、これがクリックされるとスマートフォン用のURLに転送され1の機能が復活します。 個々のページでどのPCページとスマートフォンページが対応
jQuery mobileはじめの一歩！「jQuery mobileで簡単なページを作成してみる」のまとめ | jQeryMobileでサイトをつくろう
jQuery Mobileの概要 jQuery Mobileは、jQueryをベースとした、スマートフォン向けのフレームワーク※1です。 スマートフォン向けの直観的かつ使いやすいUIを瞬時に作成できます。 ※1フレームワーク：アプリケーション制作の土台を作ってくれるソフトウェアのこと デザイナー好みの「手軽さ」と「自由さ」を兼ね備え、デベロッパーが求める「リッチなヴィジュアル」のスマートフォンUIが作成できます。 指定した形式でHTMLを書くことで、自動的にスマートフォン向けにデザインされたネイティブアプリケーションさながらのページが瞬時にしてできあがります。（jQuery Mobileが作成できるのは、ウェブアプリケーションです。） 2010年10月にアルファ版がリリースされ、2011年11月ついにjQuery Mobile1.0正式版が公開されました。現在も、jQueryの開発者で
様々なモバイルユーザーインターフェイスが確認出来る「MobileTuxedo」が熱い
発見して記事書き始めて、もしや他でも紹介されているのかと思ったらコリスさんとかでも紹介されてた。なので書くの一度やめてたのですが、やっぱりこのサイトは、もっと広く知られるべきかと思ってご紹介。 なんというか、きっちり絞ってまとめるっていうのはそれだけで価値があるんだなと感じさせられるWebサイトでもありますよね。 素材、デザインなんでもあり 特に注力したいのがインターフェイスデザインの豊富さ。 UI Patterns | Mobile Tuxedo とにかく豊富なリソース。 モバイルインターフェイスの中でもカテゴリがたくさんあります。 ナビゲーション コメントインターフェイス ログインインターフェイス 写真ギャラリーインターフェイス この他、マップやサインアップインターフェイス、設定画面、電卓など色々ありますので、モバイル開発者なら一度は目を通しておくといいかもしれませんね。 またインター
ケータイ・スマートフォン・タブレットの振り分け機能付きQRコードが簡単に作成できる -スマートQR
プログラムやサーバーなどの複雑な専門知識なしで、ケータイ・スマートフォン・タブレット用のQRコードを一本化できるオンラインサービスを紹介します。 QRコードでできるのは世界初！ とのことです。 端末振り分け機能付きQRコード -スマートQR [ad#ad-2] スマートQRの主な特徴 スマートQRの使い方 スマートQRの主な特徴 一つのQRコードで、ユーザーの端末ごとに設定されたリンクへ移動します。 プログラムなどの知識無しに簡単に、QRコードを作成できます。 ケータイ、スマートフォン、タブレットの振り分けに対応。 対応端末 ケータイ3キャリア docomo au Softbank スマートフォン iPhone Android タブレット iPad Android [ad#ad-2] スマートQRの使い方 使い方は簡単で、下記の2つの準備してください。 端末ごとのURL一覧 QRコードのデ
フリーエンジニア座談会「ぶっちゃけた話、スマホ業界ってオイシイ？」
経緯も目標もさまざま。でも、スマホ業界には夢がある！ ――今回集まっていただいた皆さんは、フリーという立場でスマホ関連業務をやっているとのこと。どういった経緯で今の職に就いたのですか？ M畑氏 私はもともとフリーを目指していたわけではなく、所属会社の事業転換で仕方なくなったクチです。それまでサーバサイドの仕事に従事してたのが、会社の意向でITから急に商業に……無理です。で、仕方なくフリーエンジニアになりました。ちょうど自分のキャリアとポジション、それに報酬が見合うのがスマホ関連の案件だったんです。 T林氏 私は「好きなことをやりたかった」というのが一番の動機でしたね。会社にいるとどうしてもメインプロダクトをやらなきゃならない。自分はもっといろいろなものを作りたかったので、フリーを選びました。スマホ業界はその点、面白そうだった。好きなことをやって、お金をもらえるのが一番ですね。 N岡氏 私は
たった2KBで動作するスマホ用マルチタッチジェスチャーライブラリ「Hammer.js」:phpspot開発日誌
Hammer.js たった2KBで動作するスマホ用マルチタッチジェスチャーライブラリ「Hammer.js」。 タップ、ダブルタップ、ホールド、ドラッグ、トランスフォームといった処理を一手に扱えるようになるライブラリです スマホだけでなく、かなりのブラウザにも対応 使い方は、まずHammerオブジェクトのインスタンスを初期化します。 あとはイベントハンドラを ontap といった形で記述していくだけなので、面倒な事は何一つ考えないでいいです 若干動きが良くない部分もあるみたいですが、今後に期待したいですね 関連エントリ スマホのホーム画面っぽいものを作れるjQueryプラグイン「Promptumenu」 スマホサイト作成のフレームワーク「iUI」が新しくなっている件 PCでもスマホでもスワイプで画像を送れるギャラリー実装jQueryプラグイン「Asketic Swipe Gallery」 ス
スマートフォンアプリやスマホサイトのUI設計をする際に参考になる記事
【スマートフォンのユーザビリティチェックリスト】 1.小さくし過ぎない、詰め込み過ぎない 2.バラつきを無くす 3.タップしたオブジェクトは反応させる 4.画面遷移アニメーションを設定する 5.画像の解像度はきちんと合わせる 6.実装側でもデザインする 7.ローディング中も画面操作できるようにする 8.真っ白なローディング画面を避ける 9.更新頻度の低いコンテンツはローカルで保持する 【スマートフォン向け開発】ユーザビリティチェックリストを作ってみた http://masaki0720.tumblr.com/post/19192937336 【Android設計のポイント】 Android では画面上になるべくボタンをおかないAndroid 端末ボタンを効果的に使うAndroid には Notification、ウィジェットもある
[JS]柔軟なclassの設定が可能なResponsive Web Design用の超軽量(1KB)スクリプト -syze
demo 1：幅1920pxで表示 デスクトップ用の画像（hdsize-wide-512x512.png）を表示 syzeの使い方 上記のdemo 1を例に実装方法を紹介します。 外部ファイル 当スクリプトを外部ファイルとして指定します。 <script src="syze.min.js"></script> JavaScript demo1では表示サイズの数値を元に、class名にもその数値を利用します。 syze.sizes(320, 480, 768, 1024, 1920); class名 .is320(0-479px) .is480(480-767px) .is768(768-1023px) .is1024(1024px-1079px) .is1920(1920+px) CSS 設定が完了したら、あとはサイズごとにスタイルシートを設定します。 body { background:
レスポンシブWebデザインで作られた10の美しすぎるサイト ｜SEO Japan by アイオイクスSEO Japan｜アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
PCにモバイル、スマートフォンにタブレット、そして今後はデジタルTVまでユーザーがデジタルコンテンツに多種多様なデバイスでアクセスし、消費する時代が本格化している最中。デバイス毎にウェブサイトをデザインしていてはキリがないとばかりに、最近注目されているのが「レスポンシブWebデザイン」という画面サイズやOSにデザインを柔軟に対応して表示させる手法。今回は、そんなレスポンシブWebデザインを実践しているサイトからThe Next Webが厳選した10の素敵なサイトを紹介します。 — SEO Japan 最近、皆が異なる方法でコンテンツを消費している。私の母はネットブックを持っているし、友人は27インチのiMacを持っていて、ガールフレンドと私はスマートフォンを持ち、彼女の母はiPadを持っている。 あなたのコンテンツはこれまでになく多くのデバイスとブラウザで閲覧されており、デザイナーはそのこ
スマホのホーム画面っぽいものを作れるjQueryプラグイン「Promptumenu」:phpspot開発日誌
natrixnatrix89/promptumenu @ GitHub スマホのホーム画面っぽいものを作れるjQueryプラグイン「Promptumenu」 iPhoneのホーム画面でフリックによってメニューがスライドできるというようなものをブラウザ上で実現できます。 当然、PCだけでなく、スマホでもフリック可能で、動きがなめらかなのもいいです。スマホのメニューを作るなら使えそうです フリック可能 実装も超簡単です。ulにメニューを並べて初期化するだけ 自分で作ると大変そうなところをやってくれるのはありがたいですね。 関連エントリ デザインがクールなタグクラウドを実装できるjQueryプラグイン「jQCloud」 スライダーとアコーディオンを組み合わせたカッコいいUI作成jQueryプラグイン「Slidorion」 時間の入力を楽にすることが出来るjQueryプラグイン アニメーションする
スマートフォン、タブレット、デスクトップのためにレイアウトの幅をどのように設計すればよいか
iPhoneやAndroidなどのスマートフォン、「新しいiPad」などのタブレット、そしてデスクトップなど、さまざまなデバイスの幅に対応させるResponsive Web Designのために、どのようにレイアウトの幅を設計し、いくつレイアウトを用意するのか3つの方法を紹介します。 各デバイスの幅は、2012年3月のデータです。 A Simple Device Diagram for Responsive Design Planning [ad#ad-2] 下記は各ポイントを意訳したものです。 キャプチャに使用している画像は元記事よりPSDファイルでダウンロードできます。 各デバイスのサイズ レイアウトを3つ レイアウトを4つ レイアウトを6つ 各デバイスのサイズ まずは、2012年3月現在の各デバイスの幅です。 ※クリックで拡大 ポイント 上段：ポートレイト（縦置き）、下段：ランドスケ
XHR XSS の話． - ほむらちゃほむほむ
概要 CORS が「幾つかのブラウザの先行実装」の状況から「古いブラウザではサポートされない機能」に変わりつつある頃合いなので，XHR2 が XSS の起点になりますよってお話． そもそも XHR XSS って何よ 簡単に言うとXHR2 による XSS のことのつもり．身近なところだと，jQuery Mobile がやらかしたり，大阪府警がやらかしたりした． 具体例1 jQuery Mobile jQuery Mobile については，jQuery MobileのXSSについての解説 で解説されるとおり． かいつまんで言うと，jQuery Mobile に location.hash の変更( hashchange イベント発火）時に，location.hash を URL とみなして読込んで，ページ内容を変更という機能があって，その読込先 URL にクロスドメインの制約がなかったので X
モバイルに最適化した5kBのJavaScriptフレームワーク「jqMobi」が正式版公開
モバイルデバイスのレンダリングエンジンとして事実上の標準になっているWebkitに特化し、iOSやAndroidに最適化したJavaScriptフレームワークの「jqMobi」が、正規版となる1.0を公開しました。 jqMobiは、jQuery Mobileと同様にHTML5をベースにモバイルアプリケーションを開発できるJavaScriptフレームワークのコアモジュール。jQueryと同様の文法を備えたセレクタエンジンです。 ユーザーインターフェイスを構築するモジュールである「jqUi」と合わせて使うことで、HTML5のタグを記述することによりモバイル向けユーザーインターフェイスを備えたアプリケーションの開発が可能になります。 小さくて早いのが特徴 jqMobiとjqUIの特徴は、Webkit上でのモバイル向けアプリケーションに特化したことでサイズを小さくできたこと、環境に最適化できたこと
「落とし物のスマホ、拾った人はどう扱うか？」……シマンテックが50台をわざと“放置” | RBB TODAY
シマンテックは13日、スマートフォン50台を使って、意図的にスマートフォンを紛失し、発見者がそのスマートフォンをどのように扱うのかを調査する実験「ハニースティックプロジェクト（Honey Stick Project）」の結果を発表した。 この実験では、Security Perspectives社のスコット・ライト氏協力のもと、ダミーの企業データや個人データを入れた端末を用意。さらに、その端末が発見された後、データに対して行われた操作がリモートで監視できる機能を追加したうえで、意図的に紛失させた。こうして50台のスマートフォンが、ニューヨークシティ、ワシントンD.C.、ロサンゼルス、サンフランシスコ、オタワ（カナダ）の5都市で“置き忘れ”となった。置き場所は、エレベーターやショッピングセンター、フードコート、バス停など、人通りの多い公共の場所だった。 その結果、スマートフォンを見つけた人のう
【スマートフォン向け開発】ユーザビリティチェックリストを作ってみた
最近はスマートフォン系の開発から離れてしまっているので、感覚が鈍らないうちに（備忘録も兼ねて）スマートフォン向け開発（主にネイティブアプリ開発）におけるユーザビリティチェックリストを作ってみました。 ちなみに、このチェックリストは以下が前提となっていますのでご了承ください。 ・独自性を生み出すようなものではない ⇒現在のスマートフォンアプリのメインストリームの中で、アプリの印象をより洗練されたものにするためのポイントです。 ・案件の内容に関わらず意識すべきポイント ⇒ある程度汎用性の高いチェックリストになっているとは思います。 それでは、全てベーシックな内容ではありますが、その中でも特に基本的なものから説明していきます。 ※僕がiPhoneユーザーということもありiPhoneの画面イメージばかりが並んでいますが、全てAndroidでも使えるチェック項目です。 小さくし過ぎない、詰め込み過ぎ
アドビの新ツール「Shadow」は、モバイル用Webアプリ開発者必須のツール
モバイルデバイス用のWebサイトやWebアプリケーション開発で大変なものの1つが動作確認です。何台ものデバイスを机の上に並べて、ひとつひとつ確認しなければなりません。 アドビシステムズのAdobe Labsが公開した「Adobe Shadow」は、そうした苦労をしているデベロッパー、デザイナーにとって手放せないツールになるでしょう。 複数デバイスに対する同時表示とリモートインスペクション Shadowがどんなツールなのか解説用ビデオの説明を紹介しましょう。 iPhoneアプリのShadowを起動すると番号が表示されます。 その番号を、MacOSかWindows用Chromeブラウザのエクステンションとして配布されているShadowに入力します。これで、ChromeブラウザとiPhoneがペアになりました。 同じように、Android用ShadowもChromeブラウザとペアにすることができ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
css-eblog.com
DeNA Creative Seminar vol.1
転職・退職代行マガジン -