AWクリエイターメモ

日本電子専門学校のWebデザイン科に通っている学生によるWeb制作入門ブログです。

学生が感じた企画書を書く時のポイント！

f:id:WebAccess-D:20121215193216p:plain

こんばんわ、ＡＷクリエイターです。

今回は企画書の書き方についてです。

４点ほどポイントを簡単に挙げますので是非自分が企画書を作る際に参考にしてみてくださいね。

 

①TOPページのデザインは凝ってみると○

トップページは企画書の入り口です。

なるべくシンプルなものが良い企画書ですが、シンプルながらもオシャレなテイストを目指してみましょう。

TOPページのデザイン＝インパクトになりますから、きちんと考えたいところですね。

ちなみにそういったデザインは検索すると色々出てきます。

実際に企業さんが使用している様な企画書を見るとより参考になるかと思います。

 

 

②写真、画像等を有効に

相手にしっかり説明を、と思っているとどうしても文章が多くなりがちです。

しかし、人間の集中力は持ったところで大した時間は無いです。

文字だけの企画書では疲れてしまうことで、その企画書に入り込めない可能性があります。

 

そこで、何かイメージになるような画像等を入れてあげると良いかと思います。

（お店の企画書ならお店の写真のように関連したもの）

画像や写真を入れてあげることで企画書自体にメリハリが出ます。

加えて画像でシンプルな企画書を少し鮮やかにすることも出来ます。

 

※しかし、使いすぎず

上記で説明したとおり、企画書はシンプルな物がウケが良かったりします。

そんなシンプルな企画書作りをするのに画像の多様は邪魔になってしまいがちです。

ですので画像のあるページ、無いページを作ってみたりしてみればOKでしょう。

１Pに画像１、2枚ぐらいがいいと思います。

 

③調査は適宜使用

企画書を作るのに必ず必要になるのが、調査ですが

調査もただひたすらにすればいいという訳ではありません。

何を調査するのか、その結果どういった調査結果が出るのかといったような目的を明確にしてから調査を始めましょう。

SNSを使用したい！等という場合も良くあるかと思いますが、そういった場合

・何故そのSNSなのか、そのSNSにする必要性

などしっかりと調査した上でクライアント様にお伝えしましょう

 

※調査しすぎて結論が「？」になってしまうとNGです。

ひたすらに調査をした結果、結局その調査がどのような結論に至ったのかが分からない。

又調査をしすぎて相手も結局覚えきれずに訳がわからなくなってしまう。

なんてことが起きない様に調査量には注意してみましょう。

 

 

④企画書全体はなるべく長くならないように

企画書は基本的にすごく面白い物ではないです。もちろん人間ですから

上記にもある通りあまりに企画書が長いと「飽き」がきてしまい、たいして内容が入ってこなかったりします。

企画書全体はなるべく長くなりすぎず、かといって説明不足にもならずといったバランスを考えると良いでしょう。

 

 

簡単に4つ程挙げさせていただきましたが、いかがでしょうか。

企画書に対しての考え方というのは三者三様であり、とても難しいものだと思っています。

是非この記事を参考にした上で、自分のしっくりくる企画書を作って頂ければ良いかなと思います。

初めてのスマホサイト作成で学生が知ったこと

スマートフォン

f:id:WebAccess-D:20121208163758j:plain

今回は私が授業で勉強した、iPhoneのスマートフォンサイトのデザインを作成する際に知っておきたいポイントを紹介します。

iPhoneの画面解像度

iPhone3GSまで 320×480px
iPhone4以降 640×960px(Retina Display対応)

iPhone4以降では解像度が2倍ですが、ブラウザ100％表示時には従来と同じ320×480pxで表示されます。

"Retina Display"って？

  • iPhone4から用いられるようになった高精細なディスプレイのこと。
  • Retina Displayに対応するためにカンバスサイズは640×960pxでデザインする。

ブラウザ"MobileSafari"の特徴

ボタンのサイズ

  • 最小サイズ：44×44pxが望ましい。

リンク等をタップしやすくするために

  • ボタンの大きさ・余白の取り方を考える。
  • 文字の大きさは最低でも14px～16pxにする。
  • 角丸やグラデーションは画像ではなくCSS3などで済ませること。 

どうでしたか？以上は基礎的な知識のほんの一部です。

とくにRetina Display対応など、今時のWebデザイナーにとっては必要な技術ですね。

スマートフォンアプリやサイトのデザインをするためには、より見やすく、操作しやすいUIの最新技術の勉強をしていくことが重要になってきています。

DTD宣言について

HTML DTD

こんにちは。

今回は、以前 掲載した記事、「HTMLを書きはじめるときに覚えておきたいこと」の中でふれた、DTD宣言について記載します。

DTDとは

DTDとは、Document Type Definitionの略で、「ドキュメントタイプ宣言」、「DOCTYPE宣言」、「文書型定義」と呼ばれるスキーマ言語のひとつで、「このファイルはHTML標準に準拠して記述されています。」と、宣言するものです。

HTMLのバージョンによって、書き方が大きく変わってくるものもあります。

※本記事は、以降、特別な記述がある場合を除いて、「(X)HTMLにおける文書型宣言」をさして、「DTD」という名称を用いて執筆します。

バージョン別DTD記述方法

各バージョン別のDTDを見てみましょう。

HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<!DOCTYPE HTML>

XHTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

Strict型とTransitional型

上記のとおり、HTML4.01、およびXHTML1.0には、Strict型とTransitional型が用意されています。

Strictとは、「厳密な」などの意味を持つ言葉で、そのバージョンのルールに厳密に準拠することを宣言するものです。

Strict型では、非推奨の要素、属性を使用することが認められていないなど、詳細な決まりがあります。

これに対して、Transitional型とは「過渡的な」文書型で、Strict型に比べて、そのルールは厳しくありません。

非推奨の要素、属性を使用することが認められています。

※HTML5の場合、<!DOCTYPE HTML>という記述のみで「HTML5で作成する」という宣言になりますが、正式にはDTDが存在しないようです。