カテゴリー:登壇

リスト表示へ

COLOPL FrontNightに登壇してcompassについて話してきました

2012年7月14日 16:21

compassを使って簡単! CSS3を手軽に利用する

コロプラロゴ

最近めっきり更新できなくなっています( ;´Д`)

書きたいこととかは色々あるんですが、最近はJavaScriptしか触ってなくてJSの話ばかりになりそうな感じです。(まぁそもそも書く時間ないんですけどね)

さて、昨日コロプラさん主催の「COLOPL FrontNight」というイベントに登壇してきました。フロントエンドエンジニア向けの実践的な話をするイベントでした。

自分が話した内容はcompass。compassを使うことでCSS3をとても簡単に、メンテナンス性もよく記述できる、というお話しです。

ちなみに今回作成したサンプルはGitHubに上がっているのでよかったら落として色々触ってみてください。

scssを書くならjsdo.it!

ちょうどこのイベントの前日に、jsdo.itでscssをそのまま記述できる機能がリリースされました。まだcompassは使えないみたいですがさっとscssを試してみたい、という方は手軽に試せる環境なのでぜひ使ってみてください。

実際にjsdo.it上でscss形式で書いた例

jsdo.itでは1行目にscssで書いていることを明示する/* #! scss */を記述するとscssとしてコンパイルして表示してくれるようになります。

その他にもless形式も可能になっていて、それらはエディット時にCSSタブのすぐ下にあるボタンから設定可能です。

sassとそしてcompassはCSSを書く上で生産性が劇的に向上します。ぜひ、興味がある方は導入を検討してみてください。ある種の快感が得られると思いますw

以前にもこのブログでsassの便利機能について書いたことがあるので、ぜひそちらも見てみてください。→ sassを使ってCSSのめんどくさい繰り返し部分を楽に記述する

Adobe - ADC MEETUP ROUND01で、jQuery Mobileについて話してきました

2011年6月21日 09:19

イベントの主題は「モバイルを攻略せよ」

6/11(土)に、Adobeが主催する、ADC MEETUP ROUND01に登壇してきました。

今回自分が話した内容は、「ネイティブアプリに変わる、新しいアプリ開発スタイル」というタイトルです。
今まので(モバイルの)アプリ開発(言語)から、HTML5+JavaScriptを使った開発へのシフトする可能性、それらを実現するフレームワークや注意すべき点などを発表させて頂きました。

プレゼン資料公開

土曜日のセッションで使用した資料は、jsdo.it上ですでに公開されています。よかったら見てみてください。(※WebKitに最適化されています。また、最近のVersionUpでGoogle Chromeでの閲覧がなんだかおかしなことになってるので、Safariで見てもらえると幸せになれます)

「ADC MEETUP ROUND01 - ネイティブアプリに変わる、新しいアプリ開発スタイル」の資料はこちら

jQuery Mobileに触ってみよう

さて、資料をみていただくと分かりますがその中身の大半は「jQuery Mobile」の話です。
Dreamweaver CS5.5がサポートしたことによって、そのシェアはかなりのものになると予想しています。

もともとjQuery自体のシェア率がとても高いので親和性が高いことも上げられます。また、jQueryの使いやすさと同じように、jQuery Mobileもとても使いやすいものとなっています。

極端に言えば、jQuery Mobileとその関連ファイルを読み込み、あとは(jQuery Mobileの)作法に則ってマークアップするだけで、まるでアプリのような外観と機能を持ったサイトが作れてしまいます。

jQuery Mobileの日本語のリファレンスを作っている方がいるので、そちらを参考にするといいかも)

そんなお手軽なjQuery Mobileを手軽に触れるイベントが、jsdo.it上で開催中です。その名も「jQuery Mobileを触りながら覚えよう!」です。

ちなみに実際に作ってみたデモは↓こんな感じ。

jQuery Mobileデモ1 - jsdo.it - share JavaScript, HTML5 and CSS

jsdo.itは手軽にJavaScriptとHTML、CSSを使ってコードが書けるサイトです。その場で確認したり、他の人に共有したり、ということができるサービスです。↑のようにブログに貼りつけてサンプルのように使うこともできるので、とても助かってます。

jQuery Mobileはまだα版

これだけ話しておいてなんですが、実はまだjQuery Mobileはアルファ版です。
なので、メイン業務に使うには注意が必要。
これを書いたあとに気づいたんですが、すでにjQuery Mobileはβ版になっていました(; ´Д`) とはいえ、それでもまだβなので注意が必要なのには変わりありません。
とはいえ、現時点でも完成度は高く、またちょっとしたモックなどはjQuery Mobileでさくっと作ると説得力が増すのかなーと思っています。

CSS Nite LP13 スマートフォン特集に登壇することになりました

2010年11月13日 23:00

CSS Nite LP13 Smart Phoneバナー

この度、1/22に開催される CSS Nite LP13 「スマートフォン特集」の回に登壇することになりました。

CSS Niteには何度か参加させていただいていましたが、登壇する側というのは初体験であります。
前からぜひ登壇したいな、と思っていたので夢が叶いました!

とはいえ、逆に前からそう思っていたのでそれがプレッシャーにもなっていたり(; ´Д`)

色々と拙いところがあるかとは思いますが、興味がおありの方はぜひぜひ参加してください。ちなみにセッション内容は以下を予定しております。

自分のセッション以外も、スマートフォンに関する情報てんこ盛りなので、スマートフォン関連の制作に興味がある人はとても参考になると思いますよ!

しかも12/10までは早割り期間なので、早めに申し込むと少し安くなります。参加したい方はぜひ今のうちに!

セッション内容

教科書には出てこない!? iPhone のUIトリック表現

iPhone UIの応用編として、視点を変えたトリッキーなUIを紹介します。

現在、さまざまなサイトがiPhone対応を求められていますが「小さな画面で見る」ことを前提に見やすさ、操作性に注力するあまり、どうしても画一的な表現が多くなってしまいます。

そんな中、あえて複雑なUIを実装したり、はたまたネイティブアプリさながらのインタラクションを持ったサイトも出てきています。そうしたトリッキーなUIを考察しながら、実際に制作した実例を元に、こだわった点や苦労した点、実装するにあたっての注意点など、教科書に掲載されない(!?)UI表現についてお話しします。

セミナーに登壇してHTML5について話してきました

2010年9月24日 19:30

初のセミナー登壇でした

セミナーバナー

上のバナーは登壇したセミナーのバナーです。
話した主な内容は HTML5 について。題して「もしも、 マークアップエンジニアが ひとりでWebサイトをつくったら ?HTML5でつくるWebアプリ?」。
ということで、MEがWebアプリを作ったら、という想定で HTML5 を使うとこんなに簡単だよ?みたいな内容を話ました。

ひとりでも多く、HTML5 に興味を持って、実際に手を動かしてなにか作ってくれたらな?という思いで行ったセッションです。

今回行ったセッションの資料は、HTML5+CSS3 で作成し、オンライン上にも公開しています。下にある「Play」ボタンを押すと実際のものが見れますが、かなり小さいのでフルスクリーンモードで見るのをお勧めします。

もしも、 マークアップエンジニアが ひとりでWebサイトをつくったら ?HTML5でつくるWebアプリ? - jsdo.it - share JavaScript, HTML5 and CSS

セミナーをやってみて思ったこと

とにかく勉強になりました。

やはりなにかをアウトプットするには間違ったことは言えないので、かなり綿密に調査しました。それ以外にも、説得力を増すために細かい情報を収集したり。

このブログでの発信も同じようなことを心がけていますが、やはりなにかを発信するというのは仕事などでやるよりも遥かに多くのことを学べますね。

最近ブログの更新が滞りがちですが、できるだけ発信していこうと思っているので、これからも CSS-EBLOG をよろしくお願いします!

1