YouTube & プライベート日記

書いてる人の趣味をはじめ、多方面な記事を執筆しています。

あなたは人目のお客様です

【全ブログサイト共通】読者登録ボタンの作り方 Part1「ツールの準備編」

こんにちは、ジャッカルです。

日頃から、のデザインに不満を抱いているのです。

もっといいデザインはないのかと探していましたが、見つかりませんでした。。。

なら自分で作ってしまおう!

と思い立ったのです。

しかも、無料で!!

 

目次

 

完成品はこちら

f:id:jackal2801:20180206230703p:plain

スマホアプリでありそうな、立体感のあるデザインに仕上げました。

青系の色が好きなので、ベースを青にして文字には補色になる黄色を使いました。

今回はこのボタンの作り方を実際の画面とともに説明します!!

ちなみに、クリックで実際に読者登録できます。(クリックしてネ)

 

ツールの準備

今回使用するのは、Google先生が用意している画像編集ソフト。その名も、、、

 

 

Google 図形描写!!!

 

 

はい、そのまんまです。

Google ドライブのサービスの一部で、GoogleドキュメントやGoogleスプレッドシートの仲間で、Adobe社の「Illustrator(イラストレーター)」の廉価版のようなソフトです。

初心者にも使いやすく、とても僕は重宝しているサービスです。

Google社が提供しているブラウザ「Chrome」を始め、「Microsoft Edge」や「Firefox」など、さまざまなブラウザに対応していますので、お使いのパソコンに元からインストールされているブラウザで利用することができます。

※すべてのOSやブラウザでの動作確認をしていないので、利用は自己責任でお願いします。

では、実際に開いてみましょう。

 

1.Googleのトップページより

 Googleのトップページ( www.google.co.jp )を開いてください。

f:id:jackal2801:20180206164629p:plain

f:id:jackal2801:20180206164635p:plain

f:id:jackal2801:20180206164639p:plain

f:id:jackal2801:20180206164644p:plain

f:id:jackal2801:20180206164654p:plain

以上の操作で開くことができました。この画面がエディタ画面です。

中央のまだら模様の場所に図形や文字を入れて画像を作ることができます。

 

2.画像サイズの変更

開いた画面の画像サイズではボタンにするにはバランスが悪いです。理想は正方形のボタンなので、画像のサイズを変更します。

f:id:jackal2801:20180206164649p:plainf:id:jackal2801:20180206164658p:plain

f:id:jackal2801:20180206164703p:plain

f:id:jackal2801:20180206233255p:plain

これで、正方形にすることができました。

 

次回予告

以上が、ツールの準備編になります。次回は、実際に図形や色を載せて完成に向けて作業をします。

今回使ったこのアプリケーションは、クラウド上で作業をするため、自動保存をしてくれます。

提供:いらすとや

作業中にパソコンの充電が切れてデータが消えた!!

なんてことがないので安心ですね!!

 

では、次の「装飾編」でお会いしましょう!

さようなら!

f:id:jackal2801:20180206230703p:plain
登録してね