晶子さんのwebサイトができるまで。晶子さんのwebサイトができるまで。芸林晶子さんの公式ティザーサイトを制作しました。制作過程を順に追いながら、ビジュアルをはじめとしたエモーショナルな部分とそれを支える技術的な部分のコンセプトについてご説明したいと思います。新たな挑戦となる、陶芸家としてのターニングポイントに立っておられる時でした。その覚悟とその挑戦を私たちに託す、というこの上ないプレッシャーとやりがい。思い、ここにしかないもの──。幾度ものヒアリングやお手紙を通じて、それらをお互いが見えるかたちにして炙り出してゆきました。陶芸ならではの魅力や、芸林さん自身が大事にしている人の手が作り出す「ゆらぎ」は、webサイトでユーザーに伝えられるものなのだろうか。人の手が作る陶芸ならではの手触りや温度、柔らかさは。そこで私たちが選んだ表現方法は、アニメーションとオノマトペでした。名前もAnimateCCと変更されました。AnimateCCの抜かりなさ昨今アニメーションさせるにも様々な方法がある中で、なぜAnimateCCを選んだのか。それは私たちが持っているアニメーション技術の資産をすべて盛り込むことができるからでした。・Flashタイムラインアニメーション・ActionScript制御アニメーション・AfterEffectsアニメーション・Spineなどのボーン&メッシュアニメーション・JavaScript制御アニメーションなどを全て適切に導入できるAnimateCCはとても便利なツールでした。JPEGアニメーション・スプライトシートアニメーション・CreateJSアニメーション・DOM制御アニメーション・CSS3アニメーションなど、どれを選んでもいいし、制限はほぼないので、すきな箇所にすきなアニメーションを盛り込むことができるのです。※注釈:AnimateCCひとつだけで、全てが行えるようになるわけではありません。制作ツールにAnimateCCを加えることによって選択可能な手段が増えるという意味です。陶器としてどんな難しい形であったとしても表現を追求していきたいという陶芸家芸林晶子さんの姿勢や魅力を少しでもウェブ上で伝えるために、こちらもタイムラインアニメーションを極力まで手作業やパラメータ調整を行って調整していきたい。した理由からもAnimateCCは最適でした。7/23(土)、セミナーで登壇します「動くサイトにプログラムが必要な時代は終わった。CCとSpineの紹介」と題し、今回のサイトで使用した実際のソースファイルを公開しながら、制作フロとツールの魅力をデザイナー目線でお話しする予定です。追記(2016/08/09)当日のスライドをこちらにアップしました。動くサイトにプログラムが必要な時代は終わった。AnimateCC)が待望のHTML5への書き出し対応になったわけですが、そのノウハウや注意点を勉強するための参考書がまだほとんどない、というのがなかなか辛いところ。CC活用テクニック」には、とても助けられました。さいごにこんな感じで公開された芸林晶子さんのwebサイトですが、実はまだティザーサイト段階です。これからコンテンツもアニメーションもともに充実してもっとうごめくサイトになるかと思いますので、ぜひご期待ください。コメントをキャンセルメールアドレスが公開されることはありません。コメント名前メールアドレスサイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。