KDC : Web演習 中期 第6回

Web制作の現場で闘うために必要なスキルや知識、最新のデザインツールや実践的なテクニックを学習する熊本デザイン専門学校GD2 Web演習のための記事を掲載します。

第6回以降は、UIkitを用いた課題の制作期間に入ります。これまでの授業で学んできたことを思い出しながら、課題制作にチャレンジしましょう。

課題

シングルページ（1ページ物）の観光サイトのデザイン案を考え、
UIkitでHTML化して提出

地元の紹介等でもOK！
作りたいエリアが決まらない人は県内で自分が紹介したいエリア（例えば『阿蘇』や『八代』など）で挑戦しましょう。

作業の流れ

1. 作りたいデザインの方向性を固める
2. ワイヤーフレーム（ラフデザイン）を考える
   • ラフを考えるときは手書きがおすすめ
   • UIkitで再現可能なレイアウト（構成）にしよう
3. ワイヤーフレームが完成したら、実際にデザインを作成
   • デザイン作成に使うソフトは使い慣れたもの（Illustrator, Photoshopなど）でOK
   • デザインに使用した画像は書き出して、作業用フォルダ内のimageフォルダへ移動しておく
4. 作成したデザインを元に、DreamweaverでHTML化

提出物

• Finderに作成した自身の作業用フォルダ一式
  • 必須ファイル
    • index.html
    • css（UIkit純正）
    • js（UIkit純正）

自身で追加したデータ（style.cssやimageフォルダ等）があれば、そちらも含めて提出してください。

納期（提出期限）

2023年 11/6（月）23:59まで

提出方法

デザインを考えづらい人へ

あなたはデザイン会社で働くWebデザイナーです。
とある会社の営業さんから、1ページものの『阿蘇』エリアを紹介する特設ページを作成してほしいと依頼されました。
営業さんは、自治体に対して「もっと阿蘇を訪れてもらえるように」特設ページを作ってはどうですか？というプレゼンテーションを行うため、提案資料としてあなたの作成するデザインを必要としているようです。

※あくまでも課題用の仮の設定です。

デザインの考え方

• 目的：何のために作るのか
  • なぜ訪れてもらいたいのか？→理由を明確にする。
• 目標：どのような成果をゴールにするか
  • 年間訪問者数を増加させる具体的な数値目標を設定。
• ターゲット：誰に見てもらいたいか
  • 特定の年齢層や性別に焦点を当てて、彼らの関心や価値観に響くような要素を取り入れる。
  • 例えば、20代から30代の男女、など
• コンセプト：方針、軸になる考え方
  • 想像力の補助=旅行のプランを提案したり、その土地ならではの魅力的な体験を伝え、訪問者に新たな発見をしてもらう。
  • 旅の提案=旅行の予定に組み込みたいと思ってもらえるようなアイデアをデザインに組み込む。
• デザインの方向性：テーマカラーやモチーフ、テイスト、キーワードなど
  • テイスト: グランピング的なニュアンスを取り入れ、ドライブの楽しさとおしゃれなアウトドア感を表現。
  • テーマカラー: 自然の色調、青や緑を基調とする。
  • イラストモチーフ: 山、森、星空、アウトドアアクティビティなどの自然要素。
  • キーワード: “自然を感じる”、”贅沢な体験”、”新たな発見”など。
• 具体的なデザイン要素
  • 阿蘇の美しさは写真でしっかり伝える
  • 各スポット紹介ではあしらいに手書き風イラスト等も交え、グランピング感を演出。
  • スナップ写真風に画像を処理することで、実際に旅した人が紹介している雰囲気を演出。

デザインの参考サイト

• LP-ARCHIVE – 観光
• webdesignclip – ホテル・旅行・交通