カテゴリー別アーカイブ: WebSite

ポートフォリオ制作 #2

しばらく空きましたが作業は少しずつですが進んでいるので
おさらい程度になるかもしれません。
さて、

前回はコンテンツの書き出し、まとめ、絞りと行いました。

今回はそれをどのようなサイト構造にするかという図があります。

site_memo_3

相変わらず、読みにくいものになってますが構造的には並列なのでこのタイプの構造では
どのページにどんなコンテンツを配置するのかさえ明確にしてく位です。

ちなみに、ご依頼があったものはきちんとPCで清書しておりますので。

それができたら、とうとうデザインです。

というか今回はあらかじめどのようなレイアウトにするかを前々から決めていたので
そのまま、書き始めました。

正直スケッチとも言えない落書きなのでお見苦しいのですが、
コンテンツの太さが変化する2枚だけ掲載してみます。

site_design1 site design 2

大変お見苦しいものをお見せしました(汗)

自分のサイトという事もあるので、大まかなスケッチしか書いていません。
枠組みの割合比率や各コンテンツの配置場所やだいたいの形ですね。

後は PhotoshopやIllustratorで形成していきます。

今回は全面リニューアルなのでロゴも新しいものを作ります。

にしても、スケッチというか落書きレベルですね。
私はよく電車で座れたときにこういう作業をやるんですが、下手過ぎですね。
本当は制作以外でもスケッチを練習しなければと思っているのですが
さぼってしまっております。

少し脱線しますが、制作をするときなどはもちろんデザインをします

しかしアイデアがひねれないときもあります。

私的にそれはアウトプットが足りないと思うのです。
インプットに関しては写真が気軽に撮れるこの時代はステキだと思います。
もちろん写真以外にもインプットを増やすというのはいい事だと思うのですが、
どうしてもアウトプットできないものは隅の方によってしまいます。

私自身デザインセンスがそこまであるとは断言できませんから、たくさんのもの
に触れてはいるのですが、アウトプットを怠ると頭から抜けてしまうものもあります。

しかしアウトプットと言っても…、という人には

先ほど挙げたスケッチですとか、もちろんPCを使ってたくさんのデザインを作るのも
いいと思います。

写真の加工でもかまわないと思います。
専用のソフトもありますし、今はスマートフォンにもたくさんの写真加工アプリもあります。

そういう事をやらないと置いてけぼりになってしまいますね。
脱線が長くなってしまったので今回はこれくらい。

ポートフォリオ制作 #1

久しぶりにウェブサイトを制作することに。

まずは構想、

  • 目的
  • ターゲット
  • 機能
  • 競合

最低この4項目を考えていくことから始めてます。(いきなりPhotoshopで作れるくらいの時もありますが本当に稀です。)

今回のサイトは

  • 就職活動と個人的な活動のツールとしてそして自分のスキルのアピール目的で
  • ウェブデザイン業界の採用人事やデザイナーへ
  • 今回はモックはPhotoShopで制作しコーディングはHTML5。CSS3はブラウザの関係上必要であればを使用、PHPでのフォーム作成、JQueryでシンプルな装飾を
  • 競合としては、他デザイナーが挙げられる

これを常に念頭においてサイトのコンテンツ構想を練っていこうとおもう。

構想は書くことから

ということで、下のメモが今回の構想を考えた結果出てきたコンテンツの走り書きですが、
他人が見たらよくわからないですねf^_^;)

site memo1 site memo2

いちよう説明すると大まかなコンテンツに記載することを1枚目に
そして、それを各ページごとに分けてみたのが2枚目。

私の場合書き方は違えど、だいたいこのようにコンテンツ内容を出して、
絞りページ分けをするというやり方をとっている。オーソドックスな手法です。

次回はもう少し進むと思う。