タグ

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

  • これはすごい! メディアクエリなしでレスポンシブを実装するCSSトリック5選

    メディアクエリーのようにビューポートではなく、コンテナの幅に応じてレイアウトを柔軟に調整するテクニックを紹介。calc関数を上手に活用した、マニアックなCSSトリックたちです。 はじめに、タイトルとは裏腹にこの記事は、メディアクエリ不要論を唱えたり、メディアクエリを批判したりするものではないことを伝えておきます。メディアクエリはとても使い勝手が良いので、私はいつもいろいろなことに使っています。とはいえ、メディアクエリでレスポンシブWebデザインにおける課題すべてを解決できるわけではありません。 要素の配置はビューポートではなくコンテナの寸法に基づいて変更するのが望ましい場合がよくあります。この課題を解決するためにエレメントクエリのコンセプトが誕生しました。とはいえエレメントクエリは実際まだ納得のいくものになっていないので、Mat Marquisはこのコンセプトにおける課題を示し、改良してc

    これはすごい! メディアクエリなしでレスポンシブを実装するCSSトリック5選
  • デザイン上級者になるために身につけたい、バーティカルリズムの正しい使い方

    バーティカルリズム(Vertical Rhythm)はタイポグラフィにおける重要な概念ですが、絶対的なルールではありません。 Webのレイアウトをするとき、デザイナーやフロントエンドコーダーは縦方向より横方向のレイアウトに時間をかけるのが普通です。 これはそれほど不思議なことではありません。たいていのデバイスは縦にスクロールするように設計されているので、ページの横幅は高さに比べて制限があります。ですから、最初に水平方向のスペースを分割して考えていくのはごく自然なことです。 ベースラインのリズム ベースラインのリズム – 「バーティカルメジャー」と呼ばれることもあります – は水平ラインのグリッドで、文字を揃えるのに使います。学校で使ったノートに印刷されていたライトブルーの罫線のようなものです。 リチャード・ルターは次のように表現しています。 見出し、小見出し、引用、脚注、挿絵、キャプション

    デザイン上級者になるために身につけたい、バーティカルリズムの正しい使い方
  • PHPでカレンダーを作りたい!だったらGoogle Calendar APIを使ってみたら?

    予定の管理はGoogleカレンダーが便利。でも独自のインターフェイスを持ったカレンダーサービスが作りたい。そんなときはGoogle Calendar APIを使ってみるといいかもしれません。 この記事では、PHPGoogle Calendar APIを扱う方法を紹介します。カレンダーアプリを構築し、ユーザーが新しいカレンダーを作成したり、イベントを追加したり、Googleカレンダーと同期したりできるようにします。この記事に沿って作業する場合は、Homesteadをセットアップするとアプリの実行環境を簡単に用意できるのでおすすめです。 Google Console Projectのセットアップ 最初にGoogle Developers Consoleで新たなプロジェクトを作成します。 プロジェクトを作成したら、ダッシュボードにある「enable and manage APIs(APIを有効

    PHPでカレンダーを作りたい!だったらGoogle Calendar APIを使ってみたら?
  • 2016年最速で成長した次世代JSフレームワーク「Aurelia」の未来

    Angular 2、ReactといったJavaScriptライブラリー/フレームワークが盛り上がった2016年。一方で急速にコミュニティが立ち上がり、大きく成長したのが「Aurelia(アウレリア)」です。今後の気になる動きとは? Aureliaへの取り組みの根幹はオープンソースであることです。オープンソースがもたらす自由、コミュニティの存在とその協力は、多くの人のビジョンに欠かせません。オープンなWebとオープンなプラットホームの、これからの成長は、世界規模のコミュニティが活躍できるような、テクノロジーの民主化を実現するものです。もっと多くの人に、消費者側の考え方ではなく産み出す側・提供する側の考え方を持つようになってほしいのです。これこそがオープンソースの核となる考え方であり、業界の未来だけでなく、文明の未来さえ左右するほど大切なことだと信じています。Aureliaはこの夢の実現に向け

    2016年最速で成長した次世代JSフレームワーク「Aurelia」の未来
  • 目まぐるしすぎる“VR元年”の3ヵ月を振り返る

    こんにちは、弓月ひろみです。VR元年とも言われる2016年。PlayStation VRの価格・出荷時期が発表され、Oculus RiftやHTC Viveの製品版も控えています。まさに“VRのビックウェーブ”が押し寄せてきている感じがして、ワクワクしますね。 ヘッドマウント型のVR機器は1968年、ユタ大学のアイバン・サザンランドが考案したものが初とされています。それから48年、なぜ今がVR元年なのか。それはゲーム、家電、コンテンツ、コミュニケーションといった分野への応用が具体的に見えてきたからでしょう。 そんな目まぐるしいVRの最新事情を知るべく4月19日(水)、渋谷ヒカリエで開催されたトークイベントへ行ってまいりました。その名も「最新VR事情が一気にわかる!! 2016年1~3月海外イベントまとめ」(VR・パノラマ系メディアPANORA主催)。3月までに開催された海外イベント・カンフ

    目まぐるしすぎる“VR元年”の3ヵ月を振り返る
  • アスキーゲーム:まさに未来のゲーセン! ナムコのVR体験施設が楽しすぎる (1/3)

    ナムコが4月15日より、バンダイナムコエンターテインメントが開発したVR技術VRアクティビティー”が体験できる施設「VR ZONE Project i Can」をダイバーシティー東京プラザにオープンする。 VR ZONE Project i Canは、「大人の好奇心を実現し、多くの人に驚き楽しんでもらうために開設した」というエンターテインメント施設で、設置されているアトラクションのほとんどが、VRゴーグルをつけて体験するアクティビティーとなっている。半年間の期間限定でのオープンで、VRアクティビティーを体験したユーザーからの意見を研究に反映させて、今後の可能性を追求していくという。 なお、施設の利用は予約制で、バンダイナムコグループのサービスが利用できる電子マネー「バナコイン」が必要。4月8日12時より公式サイトで体験予約の受付を開始している。 4月11日にはメディア向けの先行体験会が開

    アスキーゲーム:まさに未来のゲーセン! ナムコのVR体験施設が楽しすぎる (1/3)
  • Photoshopで高品質なUIを作り込むチュートリアル

    Photoshopを使ってスマートフォンアプリのUIをデザインするコツを学ぶ連載。前回は、作例となる「お天気投稿アプリ」の主な要素を配置して、基的な画面レイアウトを整えました。第3回では写真やアイコンを配置したり、質感を作り込んだりして、アプリのデザインを完成させます。 お天気投稿アプリのUIデザインチュートリアル ▼第2回 1.アプリの配色を考えよう 2.ドキュメントを新規作成する 3.基的な要素をレイアウトする ▼第3回 4.レイヤー効果を使って質感のあるボタンを作る 5.Illustratorで作ったアイコンを配置する 6.写真を配置してデザインを調整する 7.SNS連携ボタンを配置する 4.レイヤー効果を使って質感のあるボタンを作る お天気アイコンのボタンを作ります。このアプリのキーとなる「お天気選択機能」を実行するためのボタンですので、ユーザーにアプリを印象づけるデザインに

    Photoshopで高品質なUIを作り込むチュートリアル
  • 1