タグ

ブックマーク / ascii.jp (11)

  • 10分でわかる! jQuery Mobileのキホン (1/2)

    スマートフォンサイトの制作でいま注目を浴びているのが「jQuery Mobile」です。jQuery Mobileを利用すると、CSSJavaScriptの知識がない人でも簡単に格的なスマートフォンサイトを作成できます。そんな“jQuery Mobileのキホン”が10分でわかるように、要点をギュッと絞って解説しましょう。 ※記事は、jQuery Mobile 1.0をもとに執筆しています。 0分目: jQuery Mobileのダウンロードと利用方法 jQuery Mobileは、HTMLのhead要素で、(1)jQueryのスクリプトファイル、(2)jQuery Mobileのスクリプトファイル、(3)jQuery MobileのCSSファイルを読み込むだけで利用できます。 それぞれのファイルはjQueryのサーバーから呼び出せるようになっているので、わざわざ手元にダウンロードし

    10分でわかる! jQuery Mobileのキホン (1/2)
    ginpei
    ginpei 2012/02/06
    わかりやすいと思う。サンプルコードはHTMLのみ、JS/CSSはjQM以外に不要! でもそれっぽい見た目と動きにしてくれる。
  • 日本生まれのクラウドノート「KYBER」がすごい理由 (1/3)

    オーリッドという日IT企業が注目を集めている。売上高は40億円規模。法人向けWebサービスを提供していたが、昨年から個人向けサービス「KYBER」を開始した。16日に発売した「KYBER Smartnote」(写真、3冊1500円)は、そのサービスの目玉だ。 見た目はごく普通のノート。メモをしたり、議事録をとったり、普通のノートとして使える。ノートをiPhone付属のカメラで撮影し、KYBERのWebサイトにアップロードすると、画像のデータがクラウドサーバー上で管理される(Androidには10月対応予定)。そこまではこれまでのクラウドサービスにもあったもの。「Evernote」を思い浮かべる人もいるだろう。 だが、話はここからだ。 しばらくすると、手書きのメモが文字データになって送られてくる。いわゆるOCR(画像からの文字起こし)だが、その精度は異様に高い。ほぼ完璧だ。納品までも最速

    日本生まれのクラウドノート「KYBER」がすごい理由 (1/3)
    ginpei
    ginpei 2011/09/21
    紙のノートに書いたものを撮影してアップロードすると、OCRで文字起こししてくれるサービス。機械だけでなく人力も使っているらしい。人の管理が大規模ですごい。
  • iframe対応!初めてのFacebookページの作り方 (1/4)

    Facebookを企業で活用するために、Facebookページの開設・運用方法を解説する連載。第1回では、Facebookページの概要と基的な機能について、事例を挙げながら紹介しました。今回はASCII.jp Web ProfessionalのFacebookページを例にとって、Facebookページの作成方法を具体的に解説しましょう。 さっそくですが、完成したWeb ProfessionalのFacebookページを紹介します。 Web Professional編集部では、「固定読者を育てることで媒体価値をアップさせる」ことを目的にFacebookページを開設しました。「いいね!」をしてくれたユーザー(ファン)に対して、ニュースフィードを通じて最新情報を提供し、ウォールによる記事へのフォードバックや、ファンの友人を通じた潜在的な読者へのリーチも狙います。Web Professiona

    iframe対応!初めてのFacebookページの作り方 (1/4)
    ginpei
    ginpei 2011/08/10
    ページの登録から製造まで。
  • iPhoneで操作! 未来のラジコンヘリ「AR.Drone」を触った (1/3)

    「AR.Drone」は、1月のCESで発表されたばかりのクアドリコプター(4ローター式ヘリコプター)だ。発表時にYouTubeで公開した上の動画が大きな話題となったため、ご存じの方もいらっしゃることだろう(関連記事)。 動画ではいかにもスイスイと自由自在に飛ばしているが、ヘリと言えばラジコン操作の中でも最難関と言われるジャンル。当に誰もがこのように自在に飛ばせるのか、正直疑問もあった。今回、日でお披露目された試作機に触れる貴重な機会に恵まれたので、その操作感をご報告しよう。 まさに空飛ぶコンピューター! まずはAR.Droneについて説明しよう。AR.DroneはiPhoneやiPod touchで操作するラジオコントロールの4ローター式ヘリコプターだ。体からは4方向に、ブラシレスモーターで駆動する4つのカーボンファイバー製ローターが飛び出ている。 一般的なヘリコプターというイメージ

    iPhoneで操作! 未来のラジコンヘリ「AR.Drone」を触った (1/3)
    ginpei
    ginpei 2010/09/05
    四つの回転翼を持ったヘリのラジコン。iPhoneで簡単に操作できて、安定性も相当高い様子。カメラ搭載でAR機能付き、APIも公開されてゲーム作ったりできる。すげーなあ。日本でもこういうの作ってみてほしかったな。
  • ASCII.jp:サイボウズが無料に!? 家族や友達と使えるサイボウズLive (1/3)

    サイボウズのグループウェアが、SaaSとして一般向けに無料で提供される——。ただし広告モデルでの展開ではない。21人以上のグループを作る場合には、有料とするビジネスモデルだ。同社青野社長はこれを「Freemiumを採用した」と語った。サービス名称は「サイボウズLive」である。 イベントは、渋谷円山町の劇場を借り切って開催された そもそも発表の方法からして大かがりだった。渋谷円山町の「渋谷シアターTSUTAYA」地下ワンフロアを丸ごと借り切り、サイボウズユーザーを特別招待。フリーの無線LANを特設し、さらにTwitterのタグ「#cybozu1126」を用意するという念の入れようだ。 こうした姿勢から今回のサイボウズLiveにかける同社の意気込みが伝わってこようというものだ。サービスはベータ版が開始され、来年前半には正式サービスインとなる。 サイボウズLiveのグループ概念。中央の複数の輪

    ASCII.jp:サイボウズが無料に!? 家族や友達と使えるサイボウズLive (1/3)
    ginpei
    ginpei 2009/11/27
    学生時代に「あったらいいな」で考えてたものに近いかも。先を越されたorz
  • 透過PNG対応!jQueryでオリジナルツールチップ (1/3)

    「ツールチップ」の完成画面。左から、CSSで装飾するツールチップ、透過GIFを使ったツールチップ、透過PNGを使ったツールチップ(画像クリックでサンプルページを表示します) CSSで装飾するシンプルなツールチップ 最初に作成するのは、リンク(a要素)にマウスカーソルが重なると補足テキストをフェードインで表示する、シンプルなツールチップです。ツールチップはマウスカーソルの右下にピッタリくっ付いて表示され、マウスの動きに合わせて移動します(サンプル01)。 HTML/XHTML(以下、HTML)は以下のようになります。ツールチップを設定するリンクはa要素で通常通りマークアップします。ツールチップ内に表示する補足テキストは、a要素の後ろにspan要素で記述します。span要素には「tooltip」というclass属性を設定します。 ▼サンプル01(HTML部分) <p>Lorem (中略) qu

    透過PNG対応!jQueryでオリジナルツールチップ (1/3)
  • 噂の新モバイルノート「VAIO type P」がついに発表! (1/3)

    昨年末から断片的な情報が流れて話題を呼んでいたソニーの新モバイルノートがついに発表された。その名も「VAIO type P」。「ポケットスタイルPC」をコンセプトとして、モバイルパソコンとしての良さを追求した製品である。目を見張る小型軽量ボディーに加えて、予想実売価格が10万円前後という意欲的な値段な点も驚きだ。 安さを追求したNetbookとは異なり、携帯するパソコンとしての魅力を追求して生まれたtype P。写真中心に見ていこう。また、開発スタッフへのインタビュー記事も別途掲載しているので合わせてご覧いただきたい。 片手で持てる「ジャストキーボードサイズ」 type Pがこだわったのは、まずパソコンとしての使いやすさだ。第1のポイントは体とキーボードのサイズ。特に奥行きを重視し、大人が片手で持てる奥行き120mmのサイズに収めた。厚さも19.8mmと、非常に薄くなっている。幅は約24

    噂の新モバイルノート「VAIO type P」がついに発表! (1/3)
    ginpei
    ginpei 2009/01/09
    祝スティックポインタ復活! C1ぽい新型。ああちくしょう、最近小型ノートを購入したばかりだというのに……。
  • Web制作に超便利!無料のプロトタイプ作成ツール

    格的なWebデザインに取り掛かる前に作るプロトタイプ。特に受託サイトの制作やチームで制作する場合にはある程度きっちり作っておきたいものだが、「なかなかちょうどいい作成ツールがない」という人も少なくないのではないだろうか。 FireworksやillustratorからVisio、PowerPointまで、プロトタイプの制作に使えるツールはいろいろあるが、今回は無償で使える便利な専用ツールを紹介しよう。それが、オープンソースの「Pencil」だ。Firefox 3のプラグインとして動作するものだが、実際の使い勝手としては独立したアプリケーションのように動く。 使い方は簡単だ。インストールが済むと、Firefoxの[ツール]に[Pencil Sketching]という項目が追加される。Pencilの起動はここをクリックしよう。 プロトタイプを作るための基操作は、左側に並んでいるGUI部品を

    Web制作に超便利!無料のプロトタイプ作成ツール
    ginpei
    ginpei 2008/10/24
    サイトの雛形
  • Flash不要!JavaScriptで派手なWebデザイン

    ブラウザーいっぱいに広がる鮮やかなグラフィック。フェードインでゆっくりと出現する写真画像。スクロールしながら画像に重なっていく半透明のテキストボックス――思わず見とれてしまう、キャンペーンサイトなどでおなじみの“派手なWebサイト”は、フルFlashが一般的だ。「Flashはよく分からないし、そもそもオーサリングツールもない」という個人サイトの制作者はあきらめるしかなかった。 パリ在住のフリーコンサルタント/Webデザイナー「Sebcreation」のWebサイトは、そんな常識を打ち破ることに挑戦している。まずはトップページを見てみよう。 おなじみのローディングアイコン、上下右左から次々とスライドしてくる半透明のテキストボックス……といったダイナミックなデザインに、「またFlashか」と思わずつぶやいてしまうかもしれない。ところがSebcreationでは、アニメーション/エフェクト処理を

    Flash不要!JavaScriptで派手なWebデザイン
    ginpei
    ginpei 2008/10/03
    FlashぽいことをJavaScriptで実装したサイトの紹介。よくやるなあとは思うけど……使い勝手の悪さが、なるほどFlashぽい。ページ切替アニメーションはもっと素早く完結させるべき。
  • ソニーグループ、FlashやめてAjaxでリニューアル

    画像がダイナミックに切り替わり、マウスオーバーに合わせてナビゲーションバーが変化する――そんな“動きのあるサイト”を作るのに、あなたなら今、何を使うだろうか? 4~5年前ならほぼ間違いなく「Flashで決まり!」だったかもしれないが、2005年以降、Ajax/JavaScriptを使うサイトが増えている。最近では手軽に実装できるライブラリの充実とともに、ますますその傾向にあるようだ。 9月9日にリニューアルされたソニーグループのコーポレートサイト(www.sony.co.jp)もその一つ。旧サイトに比べてトップページのレイアウト領域が広くなり、文字も大きく、スッキリとしたナビゲーションバー……と、注目したいところはいろいろあるが、最初に目を奪われるのは中央にある大きなメインビジュアル部分のはずだ。実はここにJavaScriptが使われている。

    ソニーグループ、FlashやめてAjaxでリニューアル
    ginpei
    ginpei 2008/09/12
    おお、結構良い感じに仕上がってる。ライブラリにはjQueryを使用。
  • マイクロソフト、国内向けに次世代インターネット戦略“Microsoft .NET”の概要を明らかに

    ginpei
    ginpei 2006/03/08
    2000年7月14日の戦略発表当時の記事
  • 1