mkasumi.com


a-blog cms の Unit_List のおすすめの使いかたについて、a-blog cms DAY in Nagoya で紹介しました。今回はa-blog cms DAYの後に、a-blog cms Training Camp 2015 Autumn が開催され、私は事例紹介の枠で10分ほどお時間をいただきましたが、タイトルを見たらわかる通り機能紹介9割事例紹介1割の内容になっています。

「a-blog cms の Unit_List のおすすめの使いかた」のつづきを読む


Tag:a-blogcms CMS セミナー 

Posted by 森田かすみ at 13:54  Permalink


10月24日(土)に名古屋で開催された「アクセシビリティからはじめる、WebサイトのUXデザイン」に参加しました。講師は BA 太田良典さん、株式会社Gaji-Labo 山岸ひとみさんでした。

株式会社ボーンデジタルさんが出版している「コーディング Webアクセシビリティ」と「デザイニングWebアクセシビリティ」の出版イベントでした。勉強会&ワークショップということでちょっとドキドキしながらの参加でした。

「「アクセシビリティからはじめる、WebサイトのUXデザイン」に参加しました」のつづきを読む


Tag:アクセシビリティ コーディング セミナー 

Posted by 森田かすみ at 12:04  Permalink

以前、結構緊急リンクが飛ばない iOS 8.4.1からCSS :hoverも1クリックカウントっぽいSafari という記事があったのですが、どうやらiOS9では修正されて、CSSの:hoverは1クリックカウントではなくなったようです。

私自身、さきほどのページにあったサンプルページをiOS8.4.1で確認していたのですが、2015年9月17日にiOS9がリリースされ、iOS9をインストールした端末で同じページを開いたところ、1クリックでページが移動できるようになっていました。

記事内では、Safariだけではなく、Chromeでも同様の問題が起こるとのことでしたが、確認したところどちらのブラウザも修正されていました。

「iOS9にてCSSの:hoverが1クリックでカウントされる問題が修正された件について」のつづきを読む


Posted by 森田かすみ at 21:33  Permalink

当日の a-blog cms ブース(準備中)

9月5日(土)に開催された、CMS大阪夏祭り2015に参加しました。

大阪の各CMSユーザーによるイベントで、私はCMSプレゼンテーションのMacの操作役、a-blog cmsブースの助っ人として行ってきました。a-blog cmsはオープンソースではないのでこういったイベントに参加することが今までなく、とても新鮮でした。機会をくださった大阪ユーザーの方々、主催者の方々ありがとうございました!

イベントでは、CMSにまつわるセミナー、各CMSプレゼンテーション、そしてブース出展が同時進行で行われました。

夏祭りのポイント

12のCMSが集まるだけでもお祭り感はあったのですが、ほかにも「お祭り」感を感じたところを少し考えてみました。

参加者がどう行動するかは自由

セミナー、CMSプレゼンテーション、ブース出展と主に3つのことが行われていたのですが、とくにそれぞれお申し込みはなく、自由に聞きたいお話を聞きに行くという形式でした。例えば、当日いきなり聞くこともできたり、どれも無料なので追加料金がかかることもないので、参加者も自由に行動しやすかったんじゃないかなあと思います。

ブース出展

ブース出展は常に賑やかだった印象があります。普通のセミナーだと黙々と登壇者のお話しを聞いていますが、ブースでは各CMSの説明を1対1でしているので、常に話し声が途切れません。各CMSそれぞれスティッカーなどのグッズも用意していたので、「なにかお土産がもらえる」というところもお祭りポイントなのかなと思います。

セミナーをやっている横でブース出展する機会は今までなかったので、面白かったです!同じ部屋で行われていたのですが、間隔が離れていれば結構できるものなのですね。

終わってからも建物の入り口でお話している方々も多く、皆さんイベントを楽しまれていたんだなあということがすごく伝わって来るイベントでした。

大阪という場所

大阪で行われたので、やっぱり西日本の方が多かったです。私がお名刺交換した中では、大阪、滋賀、京都、兵庫、広島など。大阪なので広範囲の方がいらっしゃっていたようです。普段は名古屋のイベントばっかり顔を出しているので、愛知、岐阜、三重の方が多く、知らない企業の方とお話しできたのも新鮮でした。同時に関西のほうのイベントにもこれからは顔を出していきたいなと思いました…!

懇親会もひとりぼっちになるかなと思っていたのですが、以前からお知り合いの方や、a-blog cms全国ツアー(という名の勉強会)でお知り合いになった方々にお声をかけていただいて、なんとか寂しい思いをせずに過ごせました…!当日お声がけていただいた方々、ありがとうございました!


Tag:CMS a-blogcms 

Posted by 森田かすみ at 08:58  Permalink

写真:HTML5名古屋勉強会風景

HTML5NAGOYA #16ではテーマがSVGということで、「CSSでできるSVGアニメーション」というタイトルでお話ししてきました。

JSと比べるとCSSはブラウザ対応していないし、できるアニメーションも少ないのですが、 CSSでできたらお手軽ですよね。

どちらかというと私はJSはできないほうで、CSSでアニメーションできたらいいのにな、と日頃探している人なので、同じような人にちょっとでも面白いなと思ってもらえたら幸いです。

今回ご紹介した主なアニメーション

  • トランスフォーム
  • ドローイングアニメーション
  • 円グラフ

トランスフォームのアニメーションについて

スライドでもご紹介しているトランスフォームのアニメーションはpngやjpegでもできたりしますが、書き出しやCSSスプライトにわけるのがとても手間がかかってしまいます。(実は、実際に趣味で制作していたのですが、途中で挫折してしまいました…。)SVGは、イラストレーターで書いて、SVGに拡張子を変換したらすでにパーツごとに分かれていて、idやclassも適応できるので比較的楽に実装できます。

写真だとか複雑なイラストなどのSVGで表現できないものはpngやjpegのほうがいいと思いますが、簡単な図形やパーツが多いものはSVGのほうがいいんではないかなと思います。

ドローイングアニメーションについて

ドローイングアニメーションについては1年ほど前の記事ですが、説明しているものがありますので、スライドではわからないという方はこちらをご覧ください。

円グラフについて

円グラフは最近海外の記事やデモでいろんな人が作成しているので気になっていたアニメーションでした。こちらは主にSmashing Magazine の Designing Flexible Pie Charts With CSS and SVG の記事を参考にしたものを自分なりに解釈して今回ご紹介しました。英語ですが、こちらの記事はとてもわかりやすいのでおすすめです。

個人的には、学生の頃役には日常生活では立たないと思っていた円周率がSVGで大活躍して義務教育にありがたみを感じました。


最後に

今回はCSSでできる範囲でご紹介しましたが、やはりJSもできたほうが表現が広がります。日頃からJSも勉強したいと思っているので、再度エンジンをかけていきたい所存です!

今回発表させていただいたHTML5NAGOYAですが、次回は未定だそうです。発表者がいれば開催するそうなので、興味ある方はツイッターアカウントGoogle グループがあるので、こちらから連絡できると思います。

それでは、この度は貴重なご機会をありがとうございました!


Tag:SVG セミナー 

Posted by 森田かすみ at 10:11  Permalink

プロフィール

森田かすみ

名古屋のWeb制作会社でマークアップエンジニアとして働いています。マークアップ勉強会名古屋という勉強会の主催もやっています。

  • はてなブックマーク

カテゴリー