ソニー「PSP」はゲーム、映画、音楽、ネット対戦と俺たちの夢が詰まった携帯ゲーム機だった
高画質のゲームが外で遊べる衝撃！ 「PSP」はポータブルゲームの礎を築いた プレイステーションのゲームを持ち運んで、いつでもどこでも遊びたい！ その願いは、当時のSCE（ソニー・コンピュータエンタテインメント）から2004年12月12日に登場したプレイステーション・ポータブル、PSP（ピーエスピー）の名前で親しまれた携帯型ゲーム機として叶うことになります。 PSPはプレイステーション10周年の年（2004年）に発売されたことを、ついこの前のように覚えていますが、まさか発売から20年の歳月が経っているとは……。 気を取り直して性能を見てみましょう！ 4.3型の液晶ディスプレーに、PlayStation2に匹敵するほどのグラフィックを楽しめる脅威のハイスペック。無線LANを備えて、インターネットにつながることは当然として、そこからゲームコンテンツをダウンロードしたり、離れているプレイヤーたちと
画像生成AIに2度目の革命を起こした「ControlNet」 (1/4)
画像生成AI「StableDiffusion」の進化が止まりません。昨年8月にオープンソースとしてリリースされてから、世界中のプロアマ問わず多数の人たちが様々な研究成果を反映させ、毎日と言っていいほど新機能を誰かが発表するという状況が起きています。 StableDiffusion登場当初は、画像の品質のランダム性が高く、構図やポーズなどを指定できないという弱点を抱えていました。1枚の画像をもとに画像を生成する「i2i（image2image）」である程度コントロールすることはできても、「キャラクターに特定のポーズをとらせる」といったことは非常に難しかったんですね。 その状況を一変させる新機能が今年2月に登場しました。その名も「ControlNet」。プロンプトによる制約を克服するための、とてつもないポテンシャルを持つ技術でした。Stable Diffusionに次ぐ「2度目の炸裂」と言って
日本版Surface Goの価格が「妥当」といえる理由 (1/3)
米国で399ドルという低価格が注目を浴びたマイクロソフトの「Surface Go」ですが、日本版は税抜き6万4800円という価格になり、疑問の声が上がっています。価格差の理由はOfficeをバンドルしたことにあります。なぜ日本版は価格のインパクトを犠牲にしてまで、Officeをバンドルしたのでしょうか。 ■衝動買いしたくなっても「Go」できない価格に Surface Goはシリーズ最小かつ最安という点が強調されています。個人的に最安といえば99ドルで投げ売りされていたSurface RTを思い出さずにはいられないのですが、Surface Goは最初から安いのです。 最近、「Go」という名前が付いた製品は増えていますが、英語では気軽に持ち出せるというニュアンスがあります。小型軽量の新モデルにふさわしい名称であると同時に、お店で見かけたら「レジにGo」しやすい価格でもあるのです。 ところが日本
「Google丸投げ」でiOSアプリ開発が恐ろしくラクになる！Firebaseの使い方
Googleが運営するFirebaseを使えば、面倒なサーバーの処理は任せて、クライアント側の開発に集中できます。サンプルアプリを例に、基本的な使い方を体験してみましょう。 Firebaseは、アプリを素早く開発しデプロイできるようにするための「Backend as a Service（BaaS）」プラットホームです。Firebaseは多くの機能を提供しています。リアルタイムデータベース、ユーザー認証（Eメールとパスワード、Facebook、Twitter、GitHub、Googleアカウントを使用できる）、クラウドメッセージング、ストレージ、ホスティング、リモートコンフィギュレーション、Test Lab、クラッシュレポート、通知、アプリのインデックス付け、ダイナミックリンク、招待、AdWordsとAdMobなどが含まれています。 この記事ではシンプルなToDoアプリを作成しながら、Fir
「うわっ、そのコード変態的すぎ…」と叫びたくなるCSSトリック10選
多少複雑なデザインでも、画像や JavaScript には頼らず、CSS で実現させる。そこにはもはや手軽さなどは存在しない。あるのは男のロマン。 https://speakerdeck.com/ixkaito/bian-tai-de-css-torituku ということで、「変態的CSSトリック」が流行っているようなので、JavaScriptや画像を使わない変態的なCSSテクニックを探してみました。何を持って変態的とするかは個人の性癖によるところが大きいので、あくまでも主観ですが。 CSS counterで数字を計算 実はCSS 2からあるcounter系のプロパティ。順番に番号を振れる便利なプロパティですが、意外とマイナーな存在では？ 次のデモは、リンクの数だけページネーション番号を自動的に付与するもの。うん、便利ですね。 え、でもこれだとノーマルっぽい？ じゃあこちらでどうでしょう。
WordPressコアコントリビューターに聞く「ぼくのかんがえた最強の開発環境」
WordPressで開発をするなら、いまどきどんなツールを使うのがいい？ WordPress専門のデベロッパーであり、コアコントリビューターでもあるMatt Geriさんがおすすめるする、最高の開発環境とは？ 近年、WordPressによる開発は大きな進展を遂げています。特に、ツールに関しては。以前は、WordPressでサイトを構築しようものなら、ほぼ確実にMAMP/WAMPのローカルホスティングの設定をしなければならず、それはもう悩みの種でしたよね。ひょっとしたら、本番の状態でサイトの開発を進めなければならなかったりしました。 そう、私もその一人でした。 幸い、時代は変わり、いまではそんな頭痛の種や反復作業を取り除くツールが出てきました。 WordPress開発業者としてフルタイムで開発をしていた私は、WordPressから離れて丸3年後の2015年12月、再びフルタイムのWordPr
CSS3で作るダイナミックな3D表現 (1/2)
ダイナミックに切り替わるページナビゲーション 一見するとシンプルなデザインのサイト「HUMAAN」。その魅力は、細部まで作り込まれたインタラクションにある。中でも目を引くのが、フルスクリーンで展開されるダイナミックな変形アニメーションだ。何気なく下部のメニューをクリックすると、ページ全体が大きく回転しながら切り替わる。その動きが非常に気持ちよく、コンテンツをうまく魅せる素敵な仕掛けだ。 この3D回転は、連載第1回「CSS Transitionsを使った3Dロールオーバーのアイデア」で紹介した3D変形と同じ仕組みで実装されている。今回は、3D回転によるダイナミックなコンテンツ切り替えについて、第1回の記事をヒントに再現してみよう。 STEP 1：3Dの構造を考える 最初に、ページ全体を回転させるため、ウィンドウと同じ大きさの2つの面（div要素）を用意し、transformプロパティで変形さ
明朝体は絶滅するのか？ AXIS Font生みの親の挑戦
「明朝体はこのままだとあと20年もすればこの世から消えてしまうかもしれない」。独立系フォントベンダーであるタイププロジェクト社長の鈴木功さんはそう語る。鈴木さんはタイプデザイナーであり、デザイン業界で評価の高いAXIS Fontの生みの親として知られる人物だ。 事実、明朝体を目にする機会は激減している。PCのWebブラウザーはもちろん、スマートフォン、タブレットといったデバイスの基本フォントはいずれもゴシック体。ニュースは新聞ではなくニュースサイトやアプリでチェックし、知りたいことは本ではなくググるかFacebookで尋ねる時代。紙媒体ですら、ゴシック体で堂々と本文を組む書籍が増えた。私自身、Web業界の経験が長い新人編集者に、明朝体で組まれた新刊のゲラを「なんか読みづらい」と言われてしまった経験がある。 「気持ちが悪い」から始まった、明朝体の居場所作り 6年前。鈴木さんには忘れられないエ
「源ノ角ゴシック」を実現させたアドビ西塚氏の勘と感覚 (1/5)
アドビ Japan R&D 日本語タイポグラフィ シニア デザイナーの西塚涼子氏。「かづらき」「りょうゴシック」のデザインを担当したことでもしられる人物だ 開発に3年をかけたアドビのPan-CJK（汎 中日韓）フォント「Source Han Sans（和名：源ノ角ゴシック）」が7月16日にリリースとなった。 「日本語、中国語の繁体字・簡体字、韓国語いずれも1つのフォントファミリーでカバー」と聞くと、「ああそうなんだ。カバーできるんだ」とすんなり飲み込んでしまうが、Source Han Sansは、日中韓国語をカバーし、かつ「どの国にとっても自然」という点で画期的なフォントだ。 同じ起源を持ち、近い意味を表す漢字でも、日本と中国、韓国とでは書体が異なる。繁体字と簡体字でも全く異なるし、各国に固有の漢字もあるから、話はさらに複雑だ。「どんな書体なら自然なのか」は国によって全く違うのだ。 国ごと
SVG線画が美しいリッチアニメーションの作り方 (2/2)
STEP 4：ボックスに組み込む SVGのアニメーションができたら、続いて、線で取り囲むためのボックスを用意する。一見すると1pxのボーダーを指定しただけのdiv要素に見えるが、あとで動きをつけるために、幅もしくは高さを1pxにして塗りつぶしたdiv要素を上下左右に4つ配置し、枠線として見せている。 ボックスが完成したら、先ほど作成したSVGをボックス（div.db）の中に入れる。 ■ソースコード（HTML） <div class="box"> <div class="bd"> <svg><g><path class="path" d="M5….." /></g></svg> <div class="bdT"></div> <div class="bdB"></div> <div class="bdR"></div> <div class="bdL"></div> </div><!-- .
遅すぎる日本のスマホサイトの原因を探る (1/4)
デジタル機器の利用動向で知られるコムスコアの調査によると、2011年12月時点の日本における携帯電話に占めるスマートフォンの割合は16.6%でしたが、2012年6月には23.5%になり、半年で約7ポイントも増加しました。「まだ4人に1人の割合じゃないか」と思う方もおられるでしょう。 しかし、有名な「キャズム理論」によれば、普及率がイノベーターとアーリーアダプターを合わせて16%を超えると、一般大衆が技術を受け入れます。2012年12月時点の普及率はまだわかりませんが、すでに半分を超えていてもおかしくありません。スマートフォン未対応の企業サイトは、「時代遅れ」といっても過言ではないのです。 日本のスマートフォンサイトの問題点 すでにスマートフォン対応を済ませた日本の企業サイトは「マーケットに素早く対応して流石だ！是非、お手本として見習おう」といえるでしょうか？ 先行してスマートフォンに対応し
“5年目”を次のステージに導く「iPhone 5」—誰もが予想できなかった魅力を備えて堂々デビュー (1/7)
ほぼ2年に1回のペースで製品の形状を刷新してきたiPhoneシリーズだが、どんなに大胆に形を変えた時でも、決して変えていないポイントがいくつかあった。例えば3.5インチのスクリーンサイズ。Retinaディスプレイ搭載のiPhone 4で解像度が変わった時でも、アップルは3.5インチの画面サイズをかたくなに守り続けてきたが、今回はこれも変えた。 2003年に登場した第３世代iPodで開発され、それ以来、iPhoneにも継承されてきた30ピン横長のドック端子もそのひとつで、今回のiPhone 5で、新たに「Lightningコネクタ」という、ちゃんと名前までついた端子に生まれ変わった。そしてiPod用を元に、リモコンの真裏にマイクを追加した、リモコン付きイヤーバッド（earpad）式ヘッドホンも、新たに３年間かけて開発したという「Apple EarPods with Remote and Mi
無料で使えるHTML5 JavaScriptゲームエンジンまとめ
HTML5とJavaScriptによるインタラクティブなWebアプリケーションの開発が注目される中、ゲーム分野では数多くのHTML5 JavaScriptゲームエンジン（ゲーム開発用のフレームワーク）が登場している。JavaScriptのライブラリーや情報をまとめているJSwikiによると、その数は70以上に上り、開発者はどのゲームエンジンを選べばいいのか判断が難しい状況だ。 本記事では、数多くあるJavaScriptゲームエンジンの中から、筆者がおすすめするライブラリーを紹介しよう。紹介するゲームエンジンはすべてMIT Licenseで提供されているので、個人はもちろん、商用でも利用できる。 Cocos2D JavaScript (http://cocos2d-javascript.org/) Crafty (http://craftyjs.com/) enchant.js (http:
jQuery Mobileを使った国内スマホサイトまとめ (1/3)
jQuery Mobileの採用が国内でも進んでいる。jQuery Mobileは、iPhone/Android、WindowsPhoneやBlackBerryなど、主要なスマートフォンに対応したUIフレームワーク。HTMLに簡単な記述を追加するだけで、スマートフォンに最適化したサイトやWebアプリケーションを制作できる、注目のフレームワークだ。 昨年11月には、待望の「jQuery Mobile 1.0」正式版がリリースされ、実務でも本格的に利用しやすくなった。今後、ますます増えそうなjQuery Mobileを使ったスマートフォンサイトの事例をチェックしておこう。 ※商品紹介／キャンペーンサイトに、「太鼓の達人学園（太鼓の達人×AKB48キャンペーンサイト）」を追加しました。（2012年3月1日16時更新） ※ネットサービスに、「一休.com」「recbike」を追加しました。（201
XHTML1.0とHTML5の違いをスタバのページで紹介 (1/6)
「HTML5タグの誤用で恥をかいた」「分厚い仕様書は読み切れない」コーダー＆デザイナーのためのコーディングガイド。最終草案に対応したほか、商用サイトを意識したコーディング例を新たに書き下ろし。HTML5マークアップへ移行するために必要な知識を効率よく学べる1冊です。ネットで話題の「HTML5カルタ」付き! HTML5マークアップ 現場で使える最短攻略ガイド 定価：2,808円 （本体2,600円）／形態：B5変 (240ページ) ISBN：978-4-04-866070-9 HTML5と従来のHTML4.01やXHTML1.0との違いは、既存のサイトをHTML5化してみると理解しやすいでしょう。今回は、実在するWebサイトをHTML5に（勝手に）リニューアルしながら、HTML 4.01やXHTML 1.0との違いを解説します。ソースコードだけをリニューアルすることは実務ではあまりないと思い
jQueryによるアニメーションエフェクトの基本 (1/5)
jQueryの特徴の1つは、Webサイトに動きを付ける「アニメーションエフェクト」を手軽に実装できることです。jQueryで実現できるのは、セレクターで指定したHTML/XHTML（以下、HTML）要素のサイズや位置、透明度を時間の経過とともに徐々に変化させ、動いているように見せる簡単なアニメーションですが、最近のWebデザインで用いられる“動きのあるUI”を作るのには重宝します。 今回は、jQueryに用意されているアニメーションエフェクト関連の命令を紹介します。 非表示状態の要素を表示するshow() show()は、CSSのdisplayプロパティの値が「none」、つまり非表示に設定されているHTML要素を、アニメーション付きで表示状態（display:bolck;）に切り換える命令です。要素の透明度を透明から不透明にしながら、サイズ（高さ／幅）を0から本来のサイズに変化させます。
新聞社が「無断リンク」を禁止する3つの理由
「日本経済新聞 電子版」のリンクポリシーで「リンクをお断りする」場合が列挙され、その中に「個別記事へのリンク」があり、「以上の項目に違反した場合は、損害賠償を請求することがあります」と記載されていることが話題になっている。日本経済新聞社に限らず、他のマスコミ、企業一般の中にも、無断リンクを禁止する旨の「リンクポリシー」があり、20世紀の頃から、Webや技術に詳しいユーザーにとっては格好の話題だ。 アスキー・メディアワークスのリンクポリシーには、「本サイトのトップページ、ならびに本サイト内の各コンテンツへのリンクは、ご自由にご利用ください。弊社の許諾等は必要ありません。」とあり、「あえてはっきり言いたい。馬鹿じゃないの？」とか「完全に時代遅れ」と言われる心配はなさそうだ。とはいえ、「すべての新聞社はリンク自由のリンクポリシーを策定すべし」とも思わない。 今回のコラムはその理由を書こう。日経新
最終決定版！ ネットで役立つ定番フリーソフト｜超定番から上級者向けまで！ ネットツール徹底活用
動画や掲示板、オンラインストレージなど、普段から利用しているネットサービスは数多くある。これらのサービスのほとんどはブラウザーから利用でき、専用ソフトがいらないという手軽さが魅力だ。しかしその半面、動画のダウンロードができなかったり、サーバーが混むと接続できなくなったりと、不便に思うことも多々ある。 そこで今回紹介するのが、こういったネットサービスを便利にしてくれるフリーソフト。初心者でも安心して使いこなせるものから、機能を特化した便利ツールにいたるまで、動画、画像、音楽、コミュニケーション、ファイル管理の5つのテーマにわけて紹介していこう。 動画を楽しむ まずは見たい動画の検索やダウンロード、再生ができるソフトが基本。これにプラスして、携帯プレーヤーの形式へと変換してくれるツールを使えば、ダウンロードした画像を活用しやすくなる。また、自分で動画を作るときに便利なデスクトップ録画ソフトも紹
30分でできる！Webサイトを高速化する6大原則 (1/4)
Webサイトを制作するとき、「パフォーマンス」を気にしたことがあるだろうか？ もしまったく気にしたことがないなら、気をつけた方がいい。閲覧に時間のかかる“遅いWebサイト”はユーザーにフラストレーションを与え、閲覧をやめさせてしまう恐れがある。 下記のグラフは、「Simple-Talk」という海外のオンラインメディアで発表されたユーザー調査の結果だ。アンケートページの表示にかかる時間を意図的にコントロールし、表示時間によってユーザーが感じるフラストレーションの違いを調べたものだ。 縦軸がフラストレーション（10段階）、横軸が表示までの時間を表している。1～5秒以内にページが表示された人に比べ、ページ表示までに5秒以上かかった人は2倍以上もフラストレーションを感じている。フラストレーションがあまりに高ければ、せっかく何らかの目的を持って訪れてきたユーザーも待ち切れずにブラウザーを閉じてしまう
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Edge Animateで作るHTML5リッチコンテンツ入門
