この度、雑誌 Web Designing 2014年 6月号に執筆させていただきました。特集の『エモーショナルなCSS表現』に4ネタほど書いています。今回はサンプルファイル付き！雑誌で解説を読みながら、実例を見て参考にしてみてください！

CSS3で実装できる、楽しくて注目させるような効果を紹介しています。私は『フィルタでレトロ感のある写真に』『乙女心をくすぐるハートのボタン』『ハートが浮き出るキュートなボタン』『手書き風フォントで親近感を演出』の4つを書きました。他にもいろんな技が多数！サンプルデータはWeb DesigningのWebサイトからダウンロードできます。

• 回転するホバーアクション
• キラリと光るメニューボタン
• CSSだけで秘密のメッセージ！
• CSSだけで描く、ストライプ、チェック、ドット
• 伝えたい言葉にはラインマーカーを引いて
• 画像の動きと、はじけるハートで魅せるギャラリー
• 文字が浮かび上がるアニメーション
• ブラウザの外から現れるモーション
• 恋に落ちるテキストエディタ「Sublime Text」
• マウスオーバーではずむナビゲーション
• ウインドウ幅でアイコンのデザインを変える
• レスポンシブなグローバルナビゲーション
• ドキドキするボタン
• キュンと狭くなるアニメーション
• 文字も画像も簡単に装飾できる、魔法のようなプロパティ
• じらすフルスクリーンアコーディオン
• マウスオーバーで現れるコンテンツ
• 回転するメッセージカード
• Edge Web Fontのツール連携
• 流れるようなモーションタイポグラフィ
• 万能型CSSジェネレータ「Enjoy CSS」

もうひとつの特集は『「機能のデザイン」入門』。ユーザビリティ＝使いやすさについて、身のまわりにあるモノを実例に挙げながら、機能をかたちにするための手法や理論を解説しています。Webデザインのユーザビリティについては日々学習しているつもりですが、実際に身近にあるものでも様々な配慮がされているんだなーと、改めて気付かされました。中でも「ふじようちえん」の話は読み応えありましたよ。ぜひ手にとってみてくださいね！

Web Designing 2014年 6月号を購入する