こんにちは。エンジニアの山岡です。
WEB制作において、どうしてもこだわりたくなるものがあります。ブログを読む時、はたまたネット通販で商品を探している時、別に無くても困らない、でも無いと寂しい。
それは−−そう、「トップへ戻るボタン」です！
WEBサイトを一番下までスクロールした時、クリックするとページ最上部までスルスル〜っとスクロールしてくれるあのボタンです。スマホだとスクリーン２枚分くらいスクロールしたところで画面右下にふわっと現れたりしますよね。
今回は、エコクリが過去にデザインしたトップへ戻るボタンをまとめました。WEBデザインの参考として、また休憩時間の話題や暇つぶしのひとつとして、少しでも皆様のお役に立ちましたら幸いです。
それでは、「トップへ戻るボタン」デザインコレクション Vol.01、スタート♪
CONTENTS
山と自然を愛する"トップへ戻る"
青川峡キャンピングパーク
予約が取れないほど大人気な三重県いなべ市にあるキャンプ場です。
挿絵を描かせて頂いたイラストレーター 濱口由佳の手書きイラストでデザインしたトップへ戻るボタンは、初心者を迎え入れてくれる優しいキャンプ場の雰囲気を纏っています。
いなべ山女子フェスタ
青川峡キャンピングパークをメイン会場にして開催される山女子が対象のキャンプ&登山イベントです。
ターゲットが女性ということでオトナ女子もキュンとくる落ち着いた可愛さのトップへ戻るボタンが出来上がりました。テントの三角形がそのまま上矢印を表していて伝わりやすさも兼ね備えています。
可愛らしい"トップへ戻る"
Cafe de UN Daniel’s
バリスタチャンピオンが三重県桑名市で営む、コーヒーが抜群に美味しいカフェです。
Topのpの文字がまるでティースプーンの様にも見えます。マウスオーバーするとアニメーションして傾く所もキュートです。
株式会社東海共同測量設計コンサルタント
三重県菰野町の測量・建設・補償コンサルタント会社です。
測量業務というカタくなりがちなイメージをマイルドにしてくれる、そんなトップへ戻るボタンになりました。測量ということでメジャーの形をしています。くるくる巻き取るアニメーションにしようと考えたのですが、工数の都合で断念しました。いつか実装したいです。
Sanahana
三重県伊賀市に最近オープンしたハンドメイド雑貨教室を行なっているアトリエで、レンタルスペースや子育てサロンとしても利用できる施設です。
ふんわりとしたサイトカラーのおうちシルエットが可愛らしいトップへ戻るボタンです。筆記体はCantoniというフォントを使用しています。
モノクロな"トップへ戻る"
湯の山温泉芸術祭
湯の山温泉 開湯1300年に開催されたアートイベントです。
文字と矢印がずれて動くようにしています。
COSture ブランドサイト
COStureは三重県四日市市の女性起業家が立ち上げたふんどしパンツブランドです。
このトップへ戻るボタンは、太めの罫線と文字だけでデザインされているにも関わらず、「ここにいるよ」と囁きかけてくるようです。
三重県民の森
三重県民の森は鈴鹿山地のふもとに広がる緑豊かな森林公園です。
白淵＆黒背景のボタンは木目の背景と対照的で、他の要素に紛れてしまうことがない優れものです。
最後に
「トップへ戻るボタン」デザインコレクションはいかがでしたか？ こだわってデザインされていることに気付かされますよね。次はどんな「トップへ戻るボタン」が生み出されるのでしょうか−−それでは皆様、Vol.02をお楽しみに♪
