RUNABLOG

RUNABLOGの制作について(デザイン編)
2022年11月28日
最終更新:2022年11月29日
投稿者:RUNAちゃん

こんにちは!

高校の頃は制服を着ていたので、何も感じませんでしたが今は毎日何を着るかとても悩みます。
でも、自分は今日はこれが着たい!っていうよりは、今日はこの靴を履きたいからこの服を着ようという方が多いです。

今回は、このRUNABLOGを制作したときのことについて書いていきます!

夏休み前の最終課題

このブログは、課題の一環として出されたのが制作の初めです。

この課題は、夏休み前にPhotoshopでこのブログのwebデザインを作り、夏休み中にHTML、CSS、JSなどでマークアップしていきます。
そして9月の間にPHPを習得しながら、夏休みにマークアップしたブログデザインをWordPressのテーマにするため、PHPを使用しました。

マークアップをするのは好きなのですが、なんせデザインをするのが得意ではなくデザインを制作するのはとても苦戦しました。

自分はデザインにおいていろいろなコンテンツが入り混じるデザインをするのが得意ではなく、一つのスクロールに一つのコンテンツを入れるのが得意です。

そうしてまず出来たワイヤーフレームがこちらです。

これがトップページのデザインになります。

そうしてこれがアバウトページになります。

という感じでワイヤーフレームを制作しました。

ワイヤーフレームを作るのはとても難しいですね。
どんなデザインにするかをある程度頭に入れながら、いる項目を入れていかなければならないので大変でした。

デザイン開始

ワイヤーフレームができたのでついにデザインをしていきます。

さまざまなサイトを見て、ブログサイトというのは白背景のものが多く、やはりブログというものは長く文章を読むため読みやすくそうされているのかなと思いましたが、自分は同じになるのが嫌だったためあえて白を使わないデザインになる様に考えました。

自分の頭の中ではデザインが大体はできていたので、このワイヤーフレームに合わせて組み込んでいきます。

自分は青色を使うのが得意ではないため、今回は挑戦の意味も込めて青系統の色を主なカラーとして作成していきます。

そうして出来たデザインがこちらです。

こうしてRUNABLOGのデザインが完成しました。

このブログの元データですので背景の色と同化してしまい少し見にくいですが意外と青でやってみようという挑戦はできたのではないでしょうか…。

まとめ

今回はRUNABLOGのデザインについてですので、今回のブログはここまでになります。

また次のブログではこのデザインを元にマークアップしたときのことを書いていきますのでお待ちください!

最後まで読んでいただきありがとうございました!

Subscribe
Notify of
guest

0 Comments
Inline Feedbacks
View all comments