読者です 読者をやめる 読者になる 読者になる

いつ俺〜いつから俺ができないと錯覚していた?〜

学生ブロガー。大学院でプログラミングを専攻している。日本のプログラミング教育に疑念を抱く。

デザイン初心者が最高におしゃれなヘッダー画像をAffinityで自作してみた。

Webデザイン

 

僕はやり遂げた。

このブログを一度でも読んだことのある方ならお気づきでしょう。

 

そう、ヘッダー画像です。

 

ついに作っちゃいました!!!!

こだわりをもって自分の手で作っちゃいましたよー!!!!

正直こういった絵というか画像のデザインは、全くの初心者なのですが、うまくいって本当によかった!!!!

 

今回は、そんなドヤって感じのお話です(笑)

 

 

今回自作したヘッダー画像

ヘッダー画像を作ろうと思ってから、いくつか作ってみたんですが、実際に採用したのはこちらです。

 

f:id:shun_prog0929:20160114211129p:plain

 

うーん。

我ながらおしゃれである。

こだわりは「いつ俺」のフォントですね。

これは明朝をベースにペンツールを使って自作しました。

すっごく大変だったけどやってよかったー!!!

 

ヘッダー画像作り

ここからはちょっとだけこの画像を作るまでにやったことを紹介しますね。

 

環境

使った環境はAffinityというMacで動くベクターグラフィックアプリです。

この手のツールだとAdobe Illustratorがよく使われますが、こちらは低価格思考で僕にとっては十分だったな、という感じです。

 

affinity.serif.com

 

練習

基本的にペンタブなどは使わずにペンツールでパスを作っていくようにする方針をとることにしました。

僕はこの手のツールを使うのが初めてだったので、まずは簡単にペンツールの使い方を実際に触って試してみました。

その後、練習になると思っていくつかのイラストレーターのチュートリアルで練習してみたので、その中から2つほどご紹介しますね。

 

まずは、このチュートリアル。

 

design.tutsplus.com

 

フラットなモノクロの建物を描くチュートリアルです。

これはパスを形成するいい練習になります。

これを一通りやったころには、ペンツールにかなり慣れていました。

 

次はかなり実践的なチュートリアル。

こちらです。

 

design.tutsplus.com

 

正直これは僕の自己満でやりたくなっちゃったからやっただけなんですけどね(笑)

ヘッダーようだったので、真ん中のタイトル用の部分だけやってみました。

結果はこちら!!

 

f:id:shun_prog0929:20160114013127p:plain

 

いやー。

これもかなり頑張りましたよ。

うん。

 

そんなわけでこれらのチュートリアル後に、今回採用したヘッダー画像の製作に取り掛かったわけです。

 

まとめ

というわけで、今回は結構頑張ってみたって話でした(笑)

初心者でもある程度までならできるようになるんじゃないかと思います!

僕は割とハマっちゃったのでこれからも色々作ってみようかなと思っています。