HTML,CSS,JavaScript – Hiroshi Watanabe

Cafe BLAKE

カフェブレイクという喫茶店をデザインしてみました。全体的にスタイリッシュでクールな感じにすることを意識しました。

風流という居酒屋をデザインしてみました。このサイトでは、html,cssにプラスしてJavaScript・jQueryを導入し、サイトに動きを加えました。

メニューのボタンを押すと、それぞれのコンテンツにスクロールしながら移動するようになっています。

また、topから下にスクロールしていくとメニューバーが上からスライドして現れるようにしております。

パララックスという視差効果も導入していて、スクロールをするとサイトに奥行きを感じるようになっています。

エレベーターを製造している会社の製品を紹介するサイトを擬似的に作成して見ました。

このサイトではJavaScriptや jQueryを使用しておりませんが、画像などにマウスオーバーした際に軽く動きがつくようにしてあります。

レスポンシブ対応は現在対応中です。

参考サイトをもとに旅行先を紹介するブログを作成いたしました。

loadingや画面遷移などの動きをつけています。あまり動きをつけてしまうとうるさくなってしまうので抑えました。動きは多くしている方ですが、それでも少なめにしております。

まだレスポンシブ対応はしておりません。

こちらは自分の生活に取り入れたものです。

普段ギターで耳コピなどをするのですが、サイトの楽譜が間違っていたりするので、もっと見やすく、わかりやすくするために自分用に作成したギターコードサイトになります。

サイトの画面をクリック又はタップすると自動でスクロールを始めるサイトを作成しました。

内容はとてもシンプルですが、コーディングの勉強をしていてよかったと思えた作品で、今でも自分用に新しく作ったりしています。