FICC KYOTO BLOGのこだわり

こんにちは。近頃どんどん寒くなってきましたね。
夏の終わりから、スタッフみんなで試行錯誤してきたFICC KYOTO BLOG。
この度、やっとみなさまにお披露目することができました。

今回ブログをつくるにあたり、スマートフォンでの見せ方に特にこだわりました。
このエントリーでは、そんなFICC KYOTO BLOGのこだわりを、
私、森 江里奈がご紹介したいと思います。
今PCでご覧になっている方は、是非スマートフォンでも見ていただけると嬉しいです。

まずは、オープニングから。
FICC KYOTO BLOGのロゴがアニメーションで表示されます。
私も、「Kyoto Blog」の文字のスプラッシュをつくらせていただきました。

131218_img_00

アニメーションが終わると、記事一覧が表示されます。
左右にスワイプすることで、記事がスライドするようになっています。
また、勢い良くスワイプすると、ちゃんとその分記事を送ってくれます。

131218_img_01

ここでは、一度に全ての記事を出すとローディングに時間がかかるため、
ajaxで動的に次の記事を読み込むようにしています。
これで、記事の数が増えても、ローディングで待たされることはありませんね。

次に、詳細ページをご紹介します。
次の記事を読みたい時は、記事を下に引っ張ってみてください。
すぐ次の記事が見られるようになっています。

131218_img_02

詳細ページも記事一覧と変わらず、スムーズに動きます。
これは、pushStateというHTML5の機能を使い、画面ごとに個別のURLは存在しつつも、シームレスに画面遷移するようにしているからです。
反対に前の記事を読みたいときは、上に引っ張ってくださいね。

そして、カテゴリ別に記事を見たい場合は、フッターメニューの「CATEGORY」をタップするとカテゴリが横からスライドしてきます。

131218_img_03

CONTRIBUTORをタップすると、投稿者別でチェックも可能です。

以上、FICC KYOTO BLOGのこだわりについてご紹介させていただきましたが、如何でしたでしょうか。
このブログを通じて、少しでもスマートフォンサイトの可能性を感じていただけると嬉しいです。

あなたのお手元で、是非これからもFICC KYOTO BLOGをご愛読くださいね。
今後とも、どうぞよろしくお願いいたします。

≫FICC KYOTO twitter
≫FICC KYOTO facebook