今年注目のオープンWebテクノロジーのひとつに、Web Componentsが挙げられると思います。HTML5Experts.jpでも今まで幾度も関連記事、Polymer.jsについての記事が紹介されてきました。今回は実際に、PolymerとMaterial Designのデザインコンセプトを用いて、視覚的にもユーザエクスペリエンスにも優れたチャットアプリを実際に作ってみましょう。 まず始める前にこのライブデモ、Kitteh Anonymousをデスクトップまたはモバイルのモダンブラウザで実際に試してみてください。ここでは、このデモの簡略版であるLiteバージョンを実際に作成する方法をステップ・バイ・ステップで紹介したいと思います。 必要な知識 Polymerの基礎知識 パッケージマネージャ、Bowerの基本的な使い方(Polymerと依存するファイルをインストール、アップデートするのに使
第49回 HTML5とか勉強会に行ってきた。テーマは「HTML5最新情報 @Google I/O」だけど、Web Components祭りだったと思う。スタッフなので受付の案内したり、ピザやビールを並べたり、ピザやビールを食べたり飲んだりした。 第49回 HTML5とか勉強会 : ATND 第49回 HTML5とか勉強会 - Togetterまとめ 動画が上がってる。はやい! セッションはこんな感じ。 第49回HTML5勉強会 Google I/O 2014サマリー from Takuya Oikawa Google I/O サマリー @takoratta Web Componentsが変えるWeb開発の未来 泉水翔吾 @1000ch Material Design + Polymer 佐藤歩 @ahomu Material Design と Polymer - HTML5とか勉強会に登壇
話題のMaterial DesignをWebで実現!Polymerで「Paper Elements」を試そう 佐藤歩(株式会社サイバーエージェント) この記事では2014年7月にGoogle I/Oで発表されたMaterial Designについて、どのようなコンセプトなのか、これまでのデザインガイドラインと何が違うのか、ポイントをおさえて紹介します。記事の後半では、Material DesignをWebで実現するためのPolymerとPaper Elementsに関しても説明します。 Material Designという視覚的言語 Material Designの目的は、ひとつの視覚的な言語(Visual Language)によって、あらゆるプラットフォーム、あらゆるスクリーンサイズのデバイスで、一貫性のある体験を提供することです。 それを実現するため、伝統的なグラフィックデザインとテク
エモくない話はQiitaに書きました http://qiita.com/nekova/items/30f1e11d6adfa1ff1ba9 WebComponentsって何なの agektmrさんがWeb Componentsについて詳しくは知らない人に向けて、素晴らしい記事 を書いてくれているので読まない手はありません。 agektmrさんの記事読んだ後はWeb Componentsを使ってみよう!を読むのが良いと思います。 Polymerって何なの Polymerとは、一部のモダンブラウザが対応しているWeb Componentsの機能を、未対応ブラウザに提供するためのPolyfillライブラリです。 一部のモダンブラウザとはChromeとOperaを指します。つまり、それら以外のブラウザのためにはPolymerが必要です。 先日のGoogle I/Oで発表されたMaterial De
今年のGoogle I/Oの目玉はなんといってもMaterial Designでしょう。 人によってはAndroidWearとかAutoとかTVとかCardboardとかまぁ色々意見が分かれると思います。一席打ちたいけどぐっと我慢。 去年、Google IO2013 Android関連セッションまとめという記事を書きました。 さて今年も行います僕が勤務するTOPGATE社によるGoogle IO報告セミナー(有料)! 開催日は7/7で、ギリギリまで参加申し込み受け付けてると思います多分。 このタイミングでIO報告セミナーやるために現地2日+帰国後4日以上かけて38セッションぐらいチェックしてますからね。血反吐吐きますよいい加減。 Google Cloud Platformについても、僕以外の弊社エンジニアがガッツリ話しますのでご期待ください。 なお、去年は懇親会は潰して延々と僕がしゃべり続
Material design with Polymer Google I/O 2014 で発表になった「Material Design」ですが、Web の場合は Polymer で提供されています。Polymer は Web Components を使ったフロントエンドフレームワークです。昨年の Google I/O で発表されました。 ということで、リファレンスを参考に Polymer を使って Material Design の Web ページ制作を試してみたいと思います。 デモで Material Design の世界を体験してみよう その前に、Material Design でどのような Web ページが作れるのか、デモの Web ページが公開されているので、ちょっと触ってみましょう。以下の 3 つのデモが公開されています。 Topeka (クイズアプリ) Paper Eleme
Dialogs, snackbars, and toasts Dialogs, snackbars and toasts all appear as a separate sheet, overlaying the background. The paper element collection includes two elements. A dialog (<paper-dialog>) is a modal window that can include a title, text, action buttons, and other controls. A snackbar or toast (<paper-toast>) is a small, transient popup that includes a message and optionally a single acti
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く